From 0688f2de1926751bbd042c611108a01dd6daf7d0 Mon Sep 17 00:00:00 2001 From: Sebastian Markbage Date: Sun, 21 Apr 2024 13:05:45 -0400 Subject: [PATCH] Flag the change --- packages/react-dom/src/__tests__/ReactComponent-test.js | 1 + packages/react-dom/src/__tests__/ReactDOMOption-test.js | 3 ++- packages/react-dom/src/__tests__/refs-test.js | 4 ++-- packages/shared/ReactFeatureFlags.js | 3 +++ packages/shared/ReactSymbols.js | 8 +++++--- packages/shared/__tests__/ReactSymbols-test.internal.js | 1 + packages/shared/forks/ReactFeatureFlags.native-fb.js | 2 ++ packages/shared/forks/ReactFeatureFlags.native-oss.js | 2 ++ packages/shared/forks/ReactFeatureFlags.test-renderer.js | 2 ++ .../forks/ReactFeatureFlags.test-renderer.native-fb.js | 2 ++ .../shared/forks/ReactFeatureFlags.test-renderer.www.js | 2 ++ packages/shared/forks/ReactFeatureFlags.www.js | 2 ++ 12 files changed, 26 insertions(+), 6 deletions(-) diff --git a/packages/react-dom/src/__tests__/ReactComponent-test.js b/packages/react-dom/src/__tests__/ReactComponent-test.js index 6e77db9d290b7..61538fed69492 100644 --- a/packages/react-dom/src/__tests__/ReactComponent-test.js +++ b/packages/react-dom/src/__tests__/ReactComponent-test.js @@ -612,6 +612,7 @@ describe('ReactComponent', () => { ); }); + // @gate renameElementSymbol it('throws if a legacy element is used as a child', async () => { const inlinedElement = { $$typeof: Symbol.for('react.element'), diff --git a/packages/react-dom/src/__tests__/ReactDOMOption-test.js b/packages/react-dom/src/__tests__/ReactDOMOption-test.js index 93feea73f8a36..4b431a85bbdee 100644 --- a/packages/react-dom/src/__tests__/ReactDOMOption-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMOption-test.js @@ -134,11 +134,12 @@ describe('ReactDOMOption', () => { }).rejects.toThrow('Objects are not valid as a React child'); }); + // @gate www it('should support element-ish child', async () => { // This is similar to . // We don't toString it because you must instead provide a value prop. const obj = { - $$typeof: Symbol.for('react.transitional.element'), + $$typeof: Symbol.for('react.element'), type: props => props.content, ref: null, key: null, diff --git a/packages/react-dom/src/__tests__/refs-test.js b/packages/react-dom/src/__tests__/refs-test.js index 408f0928f0cb7..2cd23bd831790 100644 --- a/packages/react-dom/src/__tests__/refs-test.js +++ b/packages/react-dom/src/__tests__/refs-test.js @@ -382,14 +382,14 @@ describe('ref swapping', () => { }).rejects.toThrow('Expected ref to be a function'); }); - // @gate !enableRefAsProp + // @gate !enableRefAsProp && www it('undefined ref on manually inlined React element triggers error', async () => { const container = document.createElement('div'); const root = ReactDOMClient.createRoot(container); await expect(async () => { await act(() => { root.render({ - $$typeof: Symbol.for('react.transitional.element'), + $$typeof: Symbol.for('react.element'), type: 'div', props: { ref: undefined, diff --git a/packages/shared/ReactFeatureFlags.js b/packages/shared/ReactFeatureFlags.js index 5e987aec180e3..545afd1cdcc32 100644 --- a/packages/shared/ReactFeatureFlags.js +++ b/packages/shared/ReactFeatureFlags.js @@ -143,6 +143,9 @@ export const transitionLaneExpirationMs = 5000; // const __NEXT_MAJOR__ = __EXPERIMENTAL__; +// Renames the internal symbol for elements since they have changed signature/constructor +export const renameElementSymbol = true; + // Removes legacy style context export const disableLegacyContext = true; diff --git a/packages/shared/ReactSymbols.js b/packages/shared/ReactSymbols.js index 87c1457631f25..002870896f00f 100644 --- a/packages/shared/ReactSymbols.js +++ b/packages/shared/ReactSymbols.js @@ -7,15 +7,17 @@ * @flow */ +import {renameElementSymbol} from 'shared/ReactFeatureFlags'; + // ATTENTION // When adding new symbols to this file, // Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols' // The Symbol used to tag the ReactElement-like types. -export const REACT_ELEMENT_TYPE: symbol = Symbol.for( - 'react.transitional.element', -); export const REACT_LEGACY_ELEMENT_TYPE: symbol = Symbol.for('react.element'); +export const REACT_ELEMENT_TYPE: symbol = renameElementSymbol + ? Symbol.for('react.transitional.element') + : REACT_LEGACY_ELEMENT_TYPE; export const REACT_PORTAL_TYPE: symbol = Symbol.for('react.portal'); export const REACT_FRAGMENT_TYPE: symbol = Symbol.for('react.fragment'); export const REACT_STRICT_MODE_TYPE: symbol = Symbol.for('react.strict_mode'); diff --git a/packages/shared/__tests__/ReactSymbols-test.internal.js b/packages/shared/__tests__/ReactSymbols-test.internal.js index c651f53075a12..2ee93336ea7ee 100644 --- a/packages/shared/__tests__/ReactSymbols-test.internal.js +++ b/packages/shared/__tests__/ReactSymbols-test.internal.js @@ -23,6 +23,7 @@ describe('ReactSymbols', () => { }); }; + // @gate renameElementSymbol it('Symbol values should be unique', () => { expectToBeUnique(Object.entries(require('shared/ReactSymbols'))); }); diff --git a/packages/shared/forks/ReactFeatureFlags.native-fb.js b/packages/shared/forks/ReactFeatureFlags.native-fb.js index b0df95c2d6bb3..a4d0434f50469 100644 --- a/packages/shared/forks/ReactFeatureFlags.native-fb.js +++ b/packages/shared/forks/ReactFeatureFlags.native-fb.js @@ -69,6 +69,8 @@ export const enableLegacyFBSupport = false; export const enableFilterEmptyStringAttributesDOM = true; export const enableGetInspectorDataForInstanceInProduction = true; +export const renameElementSymbol = false; + export const enableRetryLaneExpiration = false; export const retryLaneExpirationMs = 5000; export const syncLaneExpirationMs = 250; diff --git a/packages/shared/forks/ReactFeatureFlags.native-oss.js b/packages/shared/forks/ReactFeatureFlags.native-oss.js index defe3d6e0fe88..723a6a69c376b 100644 --- a/packages/shared/forks/ReactFeatureFlags.native-oss.js +++ b/packages/shared/forks/ReactFeatureFlags.native-oss.js @@ -104,6 +104,8 @@ export const enableDO_NOT_USE_disableStrictPassiveEffect = false; export const passChildrenWhenCloningPersistedNodes = false; export const enableEarlyReturnForPropDiffing = false; +export const renameElementSymbol = true; + // Profiling Only export const enableProfilerTimer = __PROFILE__; export const enableProfilerCommitHooks = __PROFILE__; diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.js index 26b4086ca19fe..2271d9b2a25db 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.js @@ -79,6 +79,8 @@ export const enableServerComponentLogs = true; export const enableInfiniteRenderLoopDetection = false; export const enableEarlyReturnForPropDiffing = false; +export const renameElementSymbol = true; + // TODO: This must be in sync with the main ReactFeatureFlags file because // the Test Renderer's value must be the same as the one used by the // react package. diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.native-fb.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.native-fb.js index f39974ab98c98..e6b299035a99e 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.native-fb.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.native-fb.js @@ -90,5 +90,7 @@ export const disableDOMTestUtils = false; export const disableDefaultPropsExceptForClasses = false; export const enableEarlyReturnForPropDiffing = false; +export const renameElementSymbol = false; + // Flow magic to verify the exports of this file match the original version. ((((null: any): ExportsType): FeatureFlagsType): ExportsType); diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js index fdb85b0be0e67..44972804eb2de 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js @@ -90,5 +90,7 @@ export const disableDOMTestUtils = false; export const disableDefaultPropsExceptForClasses = false; export const enableEarlyReturnForPropDiffing = false; +export const renameElementSymbol = false; + // Flow magic to verify the exports of this file match the original version. ((((null: any): ExportsType): FeatureFlagsType): ExportsType); diff --git a/packages/shared/forks/ReactFeatureFlags.www.js b/packages/shared/forks/ReactFeatureFlags.www.js index 753d2f27b67d5..cf634cb168700 100644 --- a/packages/shared/forks/ReactFeatureFlags.www.js +++ b/packages/shared/forks/ReactFeatureFlags.www.js @@ -65,6 +65,8 @@ export const enableSchedulingProfiler: boolean = export const disableLegacyContext = __EXPERIMENTAL__; export const enableGetInspectorDataForInstanceInProduction = false; +export const renameElementSymbol = false; + export const enableCache = true; export const enableLegacyCache = true; export const enableFetchInstrumentation = false;