diff --git a/packages/react-devtools-shared/src/backend/fiber/getWorkTagMap.js b/packages/react-devtools-shared/src/backend/fiber/getWorkTagMap.js new file mode 100644 index 0000000000000..9618d82fc451c --- /dev/null +++ b/packages/react-devtools-shared/src/backend/fiber/getWorkTagMap.js @@ -0,0 +1,205 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ + +// Do not add / import anything to this file. +// This function is used from multiple places, including hook. + +import type {WorkTagMap} from 'react-devtools-shared/src/backend/types'; + +import {gt, gte} from 'react-devtools-shared/src/backend/utils'; + +export default function getWorkTagMap(version: string): WorkTagMap { + let ReactTypeOfWork: WorkTagMap = ((null: any): WorkTagMap); + + // ********************************************************** + // The section below is copied from files in React repo, see ReactWorkTags.js. + // Keep it in sync, and add version guards if it changes. + if (gt(version, '17.0.1')) { + ReactTypeOfWork = { + CacheComponent: 24, // Experimental + ClassComponent: 1, + ContextConsumer: 9, + ContextProvider: 10, + CoroutineComponent: -1, // Removed + CoroutineHandlerPhase: -1, // Removed + DehydratedSuspenseComponent: 18, // Behind a flag + ForwardRef: 11, + Fragment: 7, + FunctionComponent: 0, + HostComponent: 5, + HostPortal: 4, + HostRoot: 3, + HostHoistable: 26, // In reality, 18.2+. But doesn't hurt to include it here + HostSingleton: 27, // Same as above + HostText: 6, + IncompleteClassComponent: 17, + IncompleteFunctionComponent: 28, + IndeterminateComponent: 2, // removed in 19.0.0 + LazyComponent: 16, + LegacyHiddenComponent: 23, + MemoComponent: 14, + Mode: 8, + OffscreenComponent: 22, // Experimental + Profiler: 12, + ScopeComponent: 21, // Experimental + SimpleMemoComponent: 15, + SuspenseComponent: 13, + SuspenseListComponent: 19, // Experimental + TracingMarkerComponent: 25, // Experimental - This is technically in 18 but we don't + // want to fork again so we're adding it here instead + YieldComponent: -1, // Removed + Throw: 29, + }; + } else if (gte(version, '17.0.0-alpha')) { + ReactTypeOfWork = { + CacheComponent: -1, // Doesn't exist yet + ClassComponent: 1, + ContextConsumer: 9, + ContextProvider: 10, + CoroutineComponent: -1, // Removed + CoroutineHandlerPhase: -1, // Removed + DehydratedSuspenseComponent: 18, // Behind a flag + ForwardRef: 11, + Fragment: 7, + FunctionComponent: 0, + HostComponent: 5, + HostPortal: 4, + HostRoot: 3, + HostHoistable: -1, // Doesn't exist yet + HostSingleton: -1, // Doesn't exist yet + HostText: 6, + IncompleteClassComponent: 17, + IncompleteFunctionComponent: -1, // Doesn't exist yet + IndeterminateComponent: 2, + LazyComponent: 16, + LegacyHiddenComponent: 24, + MemoComponent: 14, + Mode: 8, + OffscreenComponent: 23, // Experimental + Profiler: 12, + ScopeComponent: 21, // Experimental + SimpleMemoComponent: 15, + SuspenseComponent: 13, + SuspenseListComponent: 19, // Experimental + TracingMarkerComponent: -1, // Doesn't exist yet + YieldComponent: -1, // Removed + Throw: -1, // Doesn't exist yet + }; + } else if (gte(version, '16.6.0-beta.0')) { + ReactTypeOfWork = { + CacheComponent: -1, // Doesn't exist yet + ClassComponent: 1, + ContextConsumer: 9, + ContextProvider: 10, + CoroutineComponent: -1, // Removed + CoroutineHandlerPhase: -1, // Removed + DehydratedSuspenseComponent: 18, // Behind a flag + ForwardRef: 11, + Fragment: 7, + FunctionComponent: 0, + HostComponent: 5, + HostPortal: 4, + HostRoot: 3, + HostHoistable: -1, // Doesn't exist yet + HostSingleton: -1, // Doesn't exist yet + HostText: 6, + IncompleteClassComponent: 17, + IncompleteFunctionComponent: -1, // Doesn't exist yet + IndeterminateComponent: 2, + LazyComponent: 16, + LegacyHiddenComponent: -1, + MemoComponent: 14, + Mode: 8, + OffscreenComponent: -1, // Experimental + Profiler: 12, + ScopeComponent: -1, // Experimental + SimpleMemoComponent: 15, + SuspenseComponent: 13, + SuspenseListComponent: 19, // Experimental + TracingMarkerComponent: -1, // Doesn't exist yet + YieldComponent: -1, // Removed + Throw: -1, // Doesn't exist yet + }; + } else if (gte(version, '16.4.3-alpha')) { + ReactTypeOfWork = { + CacheComponent: -1, // Doesn't exist yet + ClassComponent: 2, + ContextConsumer: 11, + ContextProvider: 12, + CoroutineComponent: -1, // Removed + CoroutineHandlerPhase: -1, // Removed + DehydratedSuspenseComponent: -1, // Doesn't exist yet + ForwardRef: 13, + Fragment: 9, + FunctionComponent: 0, + HostComponent: 7, + HostPortal: 6, + HostRoot: 5, + HostHoistable: -1, // Doesn't exist yet + HostSingleton: -1, // Doesn't exist yet + HostText: 8, + IncompleteClassComponent: -1, // Doesn't exist yet + IncompleteFunctionComponent: -1, // Doesn't exist yet + IndeterminateComponent: 4, + LazyComponent: -1, // Doesn't exist yet + LegacyHiddenComponent: -1, + MemoComponent: -1, // Doesn't exist yet + Mode: 10, + OffscreenComponent: -1, // Experimental + Profiler: 15, + ScopeComponent: -1, // Experimental + SimpleMemoComponent: -1, // Doesn't exist yet + SuspenseComponent: 16, + SuspenseListComponent: -1, // Doesn't exist yet + TracingMarkerComponent: -1, // Doesn't exist yet + YieldComponent: -1, // Removed + Throw: -1, // Doesn't exist yet + }; + } else { + ReactTypeOfWork = { + CacheComponent: -1, // Doesn't exist yet + ClassComponent: 2, + ContextConsumer: 12, + ContextProvider: 13, + CoroutineComponent: 7, + CoroutineHandlerPhase: 8, + DehydratedSuspenseComponent: -1, // Doesn't exist yet + ForwardRef: 14, + Fragment: 10, + FunctionComponent: 1, + HostComponent: 5, + HostPortal: 4, + HostRoot: 3, + HostHoistable: -1, // Doesn't exist yet + HostSingleton: -1, // Doesn't exist yet + HostText: 6, + IncompleteClassComponent: -1, // Doesn't exist yet + IncompleteFunctionComponent: -1, // Doesn't exist yet + IndeterminateComponent: 0, + LazyComponent: -1, // Doesn't exist yet + LegacyHiddenComponent: -1, + MemoComponent: -1, // Doesn't exist yet + Mode: 11, + OffscreenComponent: -1, // Experimental + Profiler: 15, + ScopeComponent: -1, // Experimental + SimpleMemoComponent: -1, // Doesn't exist yet + SuspenseComponent: 16, + SuspenseListComponent: -1, // Doesn't exist yet + TracingMarkerComponent: -1, // Doesn't exist yet + YieldComponent: 9, + Throw: -1, // Doesn't exist yet + }; + } + // ********************************************************** + // End of copied code. + // ********************************************************** + + return ReactTypeOfWork; +} diff --git a/packages/react-devtools-shared/src/backend/fiber/renderer.js b/packages/react-devtools-shared/src/backend/fiber/renderer.js index 75cf2c7c03755..0bb7fd3c94122 100644 --- a/packages/react-devtools-shared/src/backend/fiber/renderer.js +++ b/packages/react-devtools-shared/src/backend/fiber/renderer.js @@ -132,6 +132,7 @@ import type { } from 'react-devtools-shared/src/frontend/types'; import type {Source} from 'react-devtools-shared/src/shared/types'; import {getStackByFiberInDevAndProd} from './DevToolsFiberComponentStack'; +import getWorkTagMap from 'react-devtools-shared/src/backend/fiber/getWorkTagMap'; // Kinds const FIBER_INSTANCE = 0; @@ -286,195 +287,6 @@ export function getInternalReactConstants(version: string): { StrictModeBits = 0b10; } - let ReactTypeOfWork: WorkTagMap = ((null: any): WorkTagMap); - - // ********************************************************** - // The section below is copied from files in React repo. - // Keep it in sync, and add version guards if it changes. - // - // TODO Update the gt() check below to be gte() whichever the next version number is. - // Currently the version in Git is 17.0.2 (but that version has not been/may not end up being released). - if (gt(version, '17.0.1')) { - ReactTypeOfWork = { - CacheComponent: 24, // Experimental - ClassComponent: 1, - ContextConsumer: 9, - ContextProvider: 10, - CoroutineComponent: -1, // Removed - CoroutineHandlerPhase: -1, // Removed - DehydratedSuspenseComponent: 18, // Behind a flag - ForwardRef: 11, - Fragment: 7, - FunctionComponent: 0, - HostComponent: 5, - HostPortal: 4, - HostRoot: 3, - HostHoistable: 26, // In reality, 18.2+. But doesn't hurt to include it here - HostSingleton: 27, // Same as above - HostText: 6, - IncompleteClassComponent: 17, - IncompleteFunctionComponent: 28, - IndeterminateComponent: 2, // removed in 19.0.0 - LazyComponent: 16, - LegacyHiddenComponent: 23, - MemoComponent: 14, - Mode: 8, - OffscreenComponent: 22, // Experimental - Profiler: 12, - ScopeComponent: 21, // Experimental - SimpleMemoComponent: 15, - SuspenseComponent: 13, - SuspenseListComponent: 19, // Experimental - TracingMarkerComponent: 25, // Experimental - This is technically in 18 but we don't - // want to fork again so we're adding it here instead - YieldComponent: -1, // Removed - Throw: 29, - }; - } else if (gte(version, '17.0.0-alpha')) { - ReactTypeOfWork = { - CacheComponent: -1, // Doesn't exist yet - ClassComponent: 1, - ContextConsumer: 9, - ContextProvider: 10, - CoroutineComponent: -1, // Removed - CoroutineHandlerPhase: -1, // Removed - DehydratedSuspenseComponent: 18, // Behind a flag - ForwardRef: 11, - Fragment: 7, - FunctionComponent: 0, - HostComponent: 5, - HostPortal: 4, - HostRoot: 3, - HostHoistable: -1, // Doesn't exist yet - HostSingleton: -1, // Doesn't exist yet - HostText: 6, - IncompleteClassComponent: 17, - IncompleteFunctionComponent: -1, // Doesn't exist yet - IndeterminateComponent: 2, - LazyComponent: 16, - LegacyHiddenComponent: 24, - MemoComponent: 14, - Mode: 8, - OffscreenComponent: 23, // Experimental - Profiler: 12, - ScopeComponent: 21, // Experimental - SimpleMemoComponent: 15, - SuspenseComponent: 13, - SuspenseListComponent: 19, // Experimental - TracingMarkerComponent: -1, // Doesn't exist yet - YieldComponent: -1, // Removed - Throw: -1, // Doesn't exist yet - }; - } else if (gte(version, '16.6.0-beta.0')) { - ReactTypeOfWork = { - CacheComponent: -1, // Doesn't exist yet - ClassComponent: 1, - ContextConsumer: 9, - ContextProvider: 10, - CoroutineComponent: -1, // Removed - CoroutineHandlerPhase: -1, // Removed - DehydratedSuspenseComponent: 18, // Behind a flag - ForwardRef: 11, - Fragment: 7, - FunctionComponent: 0, - HostComponent: 5, - HostPortal: 4, - HostRoot: 3, - HostHoistable: -1, // Doesn't exist yet - HostSingleton: -1, // Doesn't exist yet - HostText: 6, - IncompleteClassComponent: 17, - IncompleteFunctionComponent: -1, // Doesn't exist yet - IndeterminateComponent: 2, - LazyComponent: 16, - LegacyHiddenComponent: -1, - MemoComponent: 14, - Mode: 8, - OffscreenComponent: -1, // Experimental - Profiler: 12, - ScopeComponent: -1, // Experimental - SimpleMemoComponent: 15, - SuspenseComponent: 13, - SuspenseListComponent: 19, // Experimental - TracingMarkerComponent: -1, // Doesn't exist yet - YieldComponent: -1, // Removed - Throw: -1, // Doesn't exist yet - }; - } else if (gte(version, '16.4.3-alpha')) { - ReactTypeOfWork = { - CacheComponent: -1, // Doesn't exist yet - ClassComponent: 2, - ContextConsumer: 11, - ContextProvider: 12, - CoroutineComponent: -1, // Removed - CoroutineHandlerPhase: -1, // Removed - DehydratedSuspenseComponent: -1, // Doesn't exist yet - ForwardRef: 13, - Fragment: 9, - FunctionComponent: 0, - HostComponent: 7, - HostPortal: 6, - HostRoot: 5, - HostHoistable: -1, // Doesn't exist yet - HostSingleton: -1, // Doesn't exist yet - HostText: 8, - IncompleteClassComponent: -1, // Doesn't exist yet - IncompleteFunctionComponent: -1, // Doesn't exist yet - IndeterminateComponent: 4, - LazyComponent: -1, // Doesn't exist yet - LegacyHiddenComponent: -1, - MemoComponent: -1, // Doesn't exist yet - Mode: 10, - OffscreenComponent: -1, // Experimental - Profiler: 15, - ScopeComponent: -1, // Experimental - SimpleMemoComponent: -1, // Doesn't exist yet - SuspenseComponent: 16, - SuspenseListComponent: -1, // Doesn't exist yet - TracingMarkerComponent: -1, // Doesn't exist yet - YieldComponent: -1, // Removed - Throw: -1, // Doesn't exist yet - }; - } else { - ReactTypeOfWork = { - CacheComponent: -1, // Doesn't exist yet - ClassComponent: 2, - ContextConsumer: 12, - ContextProvider: 13, - CoroutineComponent: 7, - CoroutineHandlerPhase: 8, - DehydratedSuspenseComponent: -1, // Doesn't exist yet - ForwardRef: 14, - Fragment: 10, - FunctionComponent: 1, - HostComponent: 5, - HostPortal: 4, - HostRoot: 3, - HostHoistable: -1, // Doesn't exist yet - HostSingleton: -1, // Doesn't exist yet - HostText: 6, - IncompleteClassComponent: -1, // Doesn't exist yet - IncompleteFunctionComponent: -1, // Doesn't exist yet - IndeterminateComponent: 0, - LazyComponent: -1, // Doesn't exist yet - LegacyHiddenComponent: -1, - MemoComponent: -1, // Doesn't exist yet - Mode: 11, - OffscreenComponent: -1, // Experimental - Profiler: 15, - ScopeComponent: -1, // Experimental - SimpleMemoComponent: -1, // Doesn't exist yet - SuspenseComponent: 16, - SuspenseListComponent: -1, // Doesn't exist yet - TracingMarkerComponent: -1, // Doesn't exist yet - YieldComponent: 9, - Throw: -1, // Doesn't exist yet - }; - } - // ********************************************************** - // End of copied code. - // ********************************************************** - function getTypeSymbol(type: any): symbol | number { const symbolOrNumber = typeof type === 'object' && type !== null ? type.$$typeof : type; @@ -485,6 +297,7 @@ export function getInternalReactConstants(version: string): { : symbolOrNumber; } + const ReactTypeOfWork = getWorkTagMap(version); const { CacheComponent, ClassComponent,