diff --git a/packages/shared/ReactSymbols.js b/packages/shared/ReactSymbols.js index 523cc1436dfc2..6ff9305fa7b00 100644 --- a/packages/shared/ReactSymbols.js +++ b/packages/shared/ReactSymbols.js @@ -11,72 +11,33 @@ // When adding new symbols to this file, // Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols' -import {enableSymbolFallbackForWWW} from './ReactFeatureFlags'; - -const usePolyfill = - enableSymbolFallbackForWWW && (typeof Symbol !== 'function' || !Symbol.for); - // The Symbol used to tag the ReactElement-like types. -export const REACT_ELEMENT_TYPE = usePolyfill - ? 0xeac7 - : Symbol.for('react.element'); -export const REACT_PORTAL_TYPE = usePolyfill - ? 0xeaca - : Symbol.for('react.portal'); -export const REACT_FRAGMENT_TYPE = usePolyfill - ? 0xeacb - : Symbol.for('react.fragment'); -export const REACT_STRICT_MODE_TYPE = usePolyfill - ? 0xeacc - : Symbol.for('react.strict_mode'); -export const REACT_PROFILER_TYPE = usePolyfill - ? 0xead2 - : Symbol.for('react.profiler'); -export const REACT_PROVIDER_TYPE = usePolyfill - ? 0xeacd - : Symbol.for('react.provider'); -export const REACT_CONTEXT_TYPE = usePolyfill - ? 0xeace - : Symbol.for('react.context'); -export const REACT_SERVER_CONTEXT_TYPE = usePolyfill - ? 0xeae6 - : Symbol.for('react.server_context'); -export const REACT_FORWARD_REF_TYPE = usePolyfill - ? 0xead0 - : Symbol.for('react.forward_ref'); -export const REACT_SUSPENSE_TYPE = usePolyfill - ? 0xead1 - : Symbol.for('react.suspense'); -export const REACT_SUSPENSE_LIST_TYPE = usePolyfill - ? 0xead8 - : Symbol.for('react.suspense_list'); -export const REACT_MEMO_TYPE = usePolyfill ? 0xead3 : Symbol.for('react.memo'); -export const REACT_LAZY_TYPE = usePolyfill ? 0xead4 : Symbol.for('react.lazy'); -export const REACT_SCOPE_TYPE = usePolyfill - ? 0xead7 - : Symbol.for('react.scope'); -export const REACT_DEBUG_TRACING_MODE_TYPE = usePolyfill - ? 0xeae1 - : Symbol.for('react.debug_trace_mode'); -export const REACT_OFFSCREEN_TYPE = usePolyfill - ? 0xeae2 - : Symbol.for('react.offscreen'); -export const REACT_LEGACY_HIDDEN_TYPE = usePolyfill - ? 0xeae3 - : Symbol.for('react.legacy_hidden'); -export const REACT_CACHE_TYPE = usePolyfill - ? 0xeae4 - : Symbol.for('react.cache'); -export const REACT_TRACING_MARKER_TYPE = usePolyfill - ? 0xeae5 - : Symbol.for('react.tracing_marker'); -export const REACT_SERVER_CONTEXT_DEFAULT_VALUE_NOT_LOADED = usePolyfill - ? 0xeae7 - : Symbol.for('react.default_value'); -const MAYBE_ITERATOR_SYMBOL = usePolyfill - ? typeof Symbol === 'function' && Symbol.iterator - : Symbol.iterator; +export const REACT_ELEMENT_TYPE = Symbol.for('react.element'); +export const REACT_PORTAL_TYPE = Symbol.for('react.portal'); +export const REACT_FRAGMENT_TYPE = Symbol.for('react.fragment'); +export const REACT_STRICT_MODE_TYPE = Symbol.for('react.strict_mode'); +export const REACT_PROFILER_TYPE = Symbol.for('react.profiler'); +export const REACT_PROVIDER_TYPE = Symbol.for('react.provider'); +export const REACT_CONTEXT_TYPE = Symbol.for('react.context'); +export const REACT_SERVER_CONTEXT_TYPE = Symbol.for('react.server_context'); +export const REACT_FORWARD_REF_TYPE = Symbol.for('react.forward_ref'); +export const REACT_SUSPENSE_TYPE = Symbol.for('react.suspense'); +export const REACT_SUSPENSE_LIST_TYPE = Symbol.for('react.suspense_list'); +export const REACT_MEMO_TYPE = Symbol.for('react.memo'); +export const REACT_LAZY_TYPE = Symbol.for('react.lazy'); +export const REACT_SCOPE_TYPE = Symbol.for('react.scope'); +export const REACT_DEBUG_TRACING_MODE_TYPE = Symbol.for( + 'react.debug_trace_mode', +); +export const REACT_OFFSCREEN_TYPE = Symbol.for('react.offscreen'); +export const REACT_LEGACY_HIDDEN_TYPE = Symbol.for('react.legacy_hidden'); +export const REACT_CACHE_TYPE = Symbol.for('react.cache'); +export const REACT_TRACING_MARKER_TYPE = Symbol.for('react.tracing_marker'); +export const REACT_SERVER_CONTEXT_DEFAULT_VALUE_NOT_LOADED = Symbol.for( + 'react.default_value', +); +const MAYBE_ITERATOR_SYMBOL = Symbol.iterator; const FAUX_ITERATOR_SYMBOL = '@@iterator'; export function getIteratorFn(maybeIterable: ?any): ?() => ?Iterator<*> { diff --git a/packages/shared/ReactSymbols.www.js b/packages/shared/ReactSymbols.www.js new file mode 100644 index 0000000000000..523cc1436dfc2 --- /dev/null +++ b/packages/shared/ReactSymbols.www.js @@ -0,0 +1,93 @@ +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow + */ + +// ATTENTION +// When adding new symbols to this file, +// Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols' + +import {enableSymbolFallbackForWWW} from './ReactFeatureFlags'; + +const usePolyfill = + enableSymbolFallbackForWWW && (typeof Symbol !== 'function' || !Symbol.for); + +// The Symbol used to tag the ReactElement-like types. +export const REACT_ELEMENT_TYPE = usePolyfill + ? 0xeac7 + : Symbol.for('react.element'); +export const REACT_PORTAL_TYPE = usePolyfill + ? 0xeaca + : Symbol.for('react.portal'); +export const REACT_FRAGMENT_TYPE = usePolyfill + ? 0xeacb + : Symbol.for('react.fragment'); +export const REACT_STRICT_MODE_TYPE = usePolyfill + ? 0xeacc + : Symbol.for('react.strict_mode'); +export const REACT_PROFILER_TYPE = usePolyfill + ? 0xead2 + : Symbol.for('react.profiler'); +export const REACT_PROVIDER_TYPE = usePolyfill + ? 0xeacd + : Symbol.for('react.provider'); +export const REACT_CONTEXT_TYPE = usePolyfill + ? 0xeace + : Symbol.for('react.context'); +export const REACT_SERVER_CONTEXT_TYPE = usePolyfill + ? 0xeae6 + : Symbol.for('react.server_context'); +export const REACT_FORWARD_REF_TYPE = usePolyfill + ? 0xead0 + : Symbol.for('react.forward_ref'); +export const REACT_SUSPENSE_TYPE = usePolyfill + ? 0xead1 + : Symbol.for('react.suspense'); +export const REACT_SUSPENSE_LIST_TYPE = usePolyfill + ? 0xead8 + : Symbol.for('react.suspense_list'); +export const REACT_MEMO_TYPE = usePolyfill ? 0xead3 : Symbol.for('react.memo'); +export const REACT_LAZY_TYPE = usePolyfill ? 0xead4 : Symbol.for('react.lazy'); +export const REACT_SCOPE_TYPE = usePolyfill + ? 0xead7 + : Symbol.for('react.scope'); +export const REACT_DEBUG_TRACING_MODE_TYPE = usePolyfill + ? 0xeae1 + : Symbol.for('react.debug_trace_mode'); +export const REACT_OFFSCREEN_TYPE = usePolyfill + ? 0xeae2 + : Symbol.for('react.offscreen'); +export const REACT_LEGACY_HIDDEN_TYPE = usePolyfill + ? 0xeae3 + : Symbol.for('react.legacy_hidden'); +export const REACT_CACHE_TYPE = usePolyfill + ? 0xeae4 + : Symbol.for('react.cache'); +export const REACT_TRACING_MARKER_TYPE = usePolyfill + ? 0xeae5 + : Symbol.for('react.tracing_marker'); +export const REACT_SERVER_CONTEXT_DEFAULT_VALUE_NOT_LOADED = usePolyfill + ? 0xeae7 + : Symbol.for('react.default_value'); +const MAYBE_ITERATOR_SYMBOL = usePolyfill + ? typeof Symbol === 'function' && Symbol.iterator + : Symbol.iterator; + +const FAUX_ITERATOR_SYMBOL = '@@iterator'; + +export function getIteratorFn(maybeIterable: ?any): ?() => ?Iterator<*> { + if (maybeIterable === null || typeof maybeIterable !== 'object') { + return null; + } + const maybeIterator = + (MAYBE_ITERATOR_SYMBOL && maybeIterable[MAYBE_ITERATOR_SYMBOL]) || + maybeIterable[FAUX_ITERATOR_SYMBOL]; + if (typeof maybeIterator === 'function') { + return maybeIterator; + } + return null; +} diff --git a/packages/shared/__tests__/ReactSymbols-test.internal.js b/packages/shared/__tests__/ReactSymbols-test.internal.js index df16a51c7c8ff..4b6a2d0bc61c0 100644 --- a/packages/shared/__tests__/ReactSymbols-test.internal.js +++ b/packages/shared/__tests__/ReactSymbols-test.internal.js @@ -32,7 +32,7 @@ describe('ReactSymbols', () => { const originalSymbolFor = global.Symbol.for; global.Symbol.for = null; try { - const entries = Object.entries(require('shared/ReactSymbols')).filter( + const entries = Object.entries(require('shared/ReactSymbols.www')).filter( // REACT_ASYNC_MODE_TYPE and REACT_CONCURRENT_MODE_TYPE have the same numeric value // for legacy backwards compatibility ([key]) => key !== 'REACT_ASYNC_MODE_TYPE', diff --git a/scripts/jest/setupTests.www.js b/scripts/jest/setupTests.www.js index c0058cb6e0849..e80448db4e078 100644 --- a/scripts/jest/setupTests.www.js +++ b/scripts/jest/setupTests.www.js @@ -19,6 +19,10 @@ jest.mock('shared/ReactFeatureFlags', () => { return wwwFlags; }); +jest.mock('shared/ReactSymbols', () => { + return jest.requireActual('shared/ReactSymbols.www'); +}); + jest.mock('scheduler/src/SchedulerFeatureFlags', () => { const schedulerSrcPath = process.cwd() + '/packages/scheduler'; jest.mock( diff --git a/scripts/rollup/forks.js b/scripts/rollup/forks.js index d45c41a74268d..5c3abebc5e495 100644 --- a/scripts/rollup/forks.js +++ b/scripts/rollup/forks.js @@ -138,6 +138,17 @@ const forks = Object.freeze({ return null; }, + './packages/shared/ReactSymbols.js': bundleType => { + switch (bundleType) { + case FB_WWW_DEV: + case FB_WWW_PROD: + case FB_WWW_PROFILING: + return './packages/shared/ReactSymbols.www.js'; + default: + return './packages/shared/ReactSymbols.js'; + } + }, + './packages/scheduler/index.js': (bundleType, entry, dependencies) => { switch (bundleType) { case UMD_DEV: