Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix[react-devtools/ReactDebugHooks]: support unstable prefixes in hooks and useContextWithBailout #30837

Merged
merged 1 commit into from
Aug 30, 2024
Merged

fix[react-devtools/ReactDebugHooks]: support unstable prefixes in hooks and useContextWithBailout #30837

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
31 changes: 30 additions & 1 deletion packages/react-debug-tools/src/ReactDebugHooks.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ import type {
Dependencies,
Fiber,
Dispatcher as DispatcherType,
ContextDependencyWithSelect,
} from 'react-reconciler/src/ReactInternalTypes';
import type {TransitionStatus} from 'react-reconciler/src/ReactFiberConfig';

Expand All @@ -37,7 +38,6 @@ import {
REACT_CONTEXT_TYPE,
} from 'shared/ReactSymbols';
import hasOwnProperty from 'shared/hasOwnProperty';
import type {ContextDependencyWithSelect} from '../../react-reconciler/src/ReactInternalTypes';

type CurrentDispatcherRef = typeof ReactSharedInternals;

Expand Down Expand Up @@ -76,6 +76,13 @@ function getPrimitiveStackCache(): Map<string, Array<any>> {
try {
// Use all hooks here to add them to the hook log.
Dispatcher.useContext(({_currentValue: null}: any));
if (typeof Dispatcher.unstable_useContextWithBailout === 'function') {
// This type check is for Flow only.
Dispatcher.unstable_useContextWithBailout(
({_currentValue: null}: any),
null,
);
}
Dispatcher.useState(null);
Dispatcher.useReducer((s: mixed, a: mixed) => s, null);
Dispatcher.useRef(null);
Expand Down Expand Up @@ -280,6 +287,22 @@ function useContext<T>(context: ReactContext<T>): T {
return value;
}

function unstable_useContextWithBailout<T>(
context: ReactContext<T>,
select: (T => Array<mixed>) | null,
): T {
const value = readContext(context);
hookLog.push({
displayName: context.displayName || null,
primitive: 'ContextWithBailout',
stackError: new Error(),
value: value,
debugInfo: null,
dispatcherHookName: 'ContextWithBailout',
});
return value;
}

function useState<S>(
initialState: (() => S) | S,
): [S, Dispatch<BasicStateAction<S>>] {
Expand Down Expand Up @@ -753,6 +776,7 @@ const Dispatcher: DispatcherType = {
useCacheRefresh,
useCallback,
useContext,
unstable_useContextWithBailout,
useEffect,
useImperativeHandle,
useDebugValue,
Expand Down Expand Up @@ -954,6 +978,11 @@ function parseHookName(functionName: void | string): string {
} else {
startIndex += 1;
}

if (functionName.slice(startIndex).startsWith('unstable_')) {
startIndex += 'unstable_'.length;
}
Comment on lines +982 to +984
Copy link
Collaborator

@eps1lon eps1lon Aug 29, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I never considered that. I guess we also have a similar problem with experimental_useEffectEvent.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@jackpope @gsathya Do we have plans for using experimental_useEffectEvent soon? Will it be transpiled by the compiler?

I can put up a separate PR for it.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Not that I know of. But it might be worth handling the pattern anyway. I think we can assume we'll create more unstable_ or experimental_ prefixes in the future, beyond useEffectEvent / useContextWithBailout.


if (functionName.slice(startIndex, startIndex + 3) === 'use') {
if (functionName.length - startIndex === 3) {
return 'Use';
Expand Down
Loading