diff --git a/packages/react-dom/src/__tests__/ReactDOMServerPartialHydration-test.internal.js b/packages/react-dom/src/__tests__/ReactDOMServerPartialHydration-test.internal.js index f373213b099bf..8d0023b6f2078 100644 --- a/packages/react-dom/src/__tests__/ReactDOMServerPartialHydration-test.internal.js +++ b/packages/react-dom/src/__tests__/ReactDOMServerPartialHydration-test.internal.js @@ -776,14 +776,7 @@ describe('ReactDOMServerPartialHydration', () => { const span2 = container.getElementsByTagName('span')[0]; // This is a new node. expect(span).not.toBe(span2); - - if (gate(flags => flags.dfsEffectsRefactor)) { - // The effects list refactor causes this to be null because the Suspense Activity's child - // is null. However, since we can't hydrate Suspense in legacy this change in behavior is ok - expect(ref.current).toBe(null); - } else { - expect(ref.current).toBe(span2); - } + expect(ref.current).toBe(null); // Resolving the promise should render the final content. suspend = false; diff --git a/packages/react-reconciler/src/ReactFiber.js b/packages/react-reconciler/src/ReactFiber.js index 53d7bc601aa05..573e497454028 100644 --- a/packages/react-reconciler/src/ReactFiber.js +++ b/packages/react-reconciler/src/ReactFiber.js @@ -28,7 +28,6 @@ import { isHostSingletonType, } from './ReactFiberConfig'; import { - createRootStrictEffectsByDefault, enableCache, enableProfilerTimer, enableScopeAPI, @@ -456,7 +455,7 @@ export function createHostRootFiber( let mode; if (tag === ConcurrentRoot) { mode = ConcurrentMode; - if (isStrictMode === true || createRootStrictEffectsByDefault) { + if (isStrictMode === true) { mode |= StrictLegacyMode | StrictEffectsMode; } if ( diff --git a/packages/react-reconciler/src/__tests__/StrictEffectsMode-test.js b/packages/react-reconciler/src/__tests__/StrictEffectsMode-test.js index af35defe2325c..62ff0e19e6230 100644 --- a/packages/react-reconciler/src/__tests__/StrictEffectsMode-test.js +++ b/packages/react-reconciler/src/__tests__/StrictEffectsMode-test.js @@ -27,15 +27,6 @@ describe('StrictEffectsMode', () => { assertLog = InternalTestUtils.assertLog; }); - function supportsDoubleInvokeEffects() { - return gate( - flags => - flags.build === 'development' && - flags.createRootStrictEffectsByDefault && - flags.dfsEffectsRefactor, - ); - } - it('should not double invoke effects in legacy mode', async () => { function App({text}) { React.useEffect(() => { @@ -52,7 +43,11 @@ describe('StrictEffectsMode', () => { } await act(() => { - ReactTestRenderer.create(); + ReactTestRenderer.create( + + + , + ); }); assertLog(['useLayoutEffect mount', 'useEffect mount']); @@ -75,12 +70,17 @@ describe('StrictEffectsMode', () => { let renderer; await act(() => { - renderer = ReactTestRenderer.create(, { - isConcurrent: true, - }); + renderer = ReactTestRenderer.create( + + + , + { + isConcurrent: true, + }, + ); }); - if (supportsDoubleInvokeEffects()) { + if (__DEV__) { assertLog([ 'useLayoutEffect mount', 'useEffect mount', @@ -94,7 +94,11 @@ describe('StrictEffectsMode', () => { } await act(() => { - renderer.update(); + renderer.update( + + + , + ); }); assertLog([ @@ -128,12 +132,17 @@ describe('StrictEffectsMode', () => { let renderer; await act(() => { - renderer = ReactTestRenderer.create(, { - isConcurrent: true, - }); + renderer = ReactTestRenderer.create( + + + , + { + isConcurrent: true, + }, + ); }); - if (supportsDoubleInvokeEffects()) { + if (__DEV__) { assertLog([ 'useEffect One mount', 'useEffect Two mount', @@ -147,7 +156,11 @@ describe('StrictEffectsMode', () => { } await act(() => { - renderer.update(); + renderer.update( + + + , + ); }); assertLog([ @@ -181,12 +194,17 @@ describe('StrictEffectsMode', () => { let renderer; await act(() => { - renderer = ReactTestRenderer.create(, { - isConcurrent: true, - }); + renderer = ReactTestRenderer.create( + + + , + { + isConcurrent: true, + }, + ); }); - if (supportsDoubleInvokeEffects()) { + if (__DEV__) { assertLog([ 'useLayoutEffect One mount', 'useLayoutEffect Two mount', @@ -200,7 +218,11 @@ describe('StrictEffectsMode', () => { } await act(() => { - renderer.update(); + renderer.update( + + + , + ); }); assertLog([ @@ -232,12 +254,17 @@ describe('StrictEffectsMode', () => { let renderer; await act(() => { - renderer = ReactTestRenderer.create(, { - isConcurrent: true, - }); + renderer = ReactTestRenderer.create( + + + , + { + isConcurrent: true, + }, + ); }); - if (supportsDoubleInvokeEffects()) { + if (__DEV__) { assertLog([ 'useLayoutEffect mount', 'useEffect mount', @@ -249,7 +276,11 @@ describe('StrictEffectsMode', () => { } await act(() => { - renderer.update(); + renderer.update( + + + , + ); }); assertLog(['useLayoutEffect mount', 'useEffect mount']); @@ -286,10 +317,15 @@ describe('StrictEffectsMode', () => { } await act(() => { - ReactTestRenderer.create(, {isConcurrent: true}); + ReactTestRenderer.create( + + + , + {isConcurrent: true}, + ); }); - if (supportsDoubleInvokeEffects()) { + if (__DEV__) { assertLog([ 'componentDidMount', 'componentWillUnmount', @@ -321,12 +357,17 @@ describe('StrictEffectsMode', () => { let renderer; await act(() => { - renderer = ReactTestRenderer.create(, { - isConcurrent: true, - }); + renderer = ReactTestRenderer.create( + + + , + { + isConcurrent: true, + }, + ); }); - if (supportsDoubleInvokeEffects()) { + if (__DEV__) { assertLog([ 'componentDidMount', 'componentWillUnmount', @@ -337,7 +378,11 @@ describe('StrictEffectsMode', () => { } await act(() => { - renderer.update(); + renderer.update( + + + , + ); }); assertLog(['componentDidUpdate']); @@ -366,19 +411,28 @@ describe('StrictEffectsMode', () => { let renderer; await act(() => { - renderer = ReactTestRenderer.create(, { - isConcurrent: true, - }); + renderer = ReactTestRenderer.create( + + + , + { + isConcurrent: true, + }, + ); }); - if (supportsDoubleInvokeEffects()) { + if (__DEV__) { assertLog(['componentWillUnmount']); } else { assertLog([]); } await act(() => { - renderer.update(); + renderer.update( + + + , + ); }); assertLog(['componentDidUpdate']); @@ -410,7 +464,11 @@ describe('StrictEffectsMode', () => { } await act(() => { - ReactTestRenderer.create(); + ReactTestRenderer.create( + + + , + ); }); assertLog(['componentDidMount']); @@ -437,12 +495,17 @@ describe('StrictEffectsMode', () => { } await act(() => { - ReactTestRenderer.create(, { - isConcurrent: true, - }); + ReactTestRenderer.create( + + + , + { + isConcurrent: true, + }, + ); }); - if (supportsDoubleInvokeEffects()) { + if (__DEV__) { assertLog([ 'mount', 'useLayoutEffect mount', @@ -502,10 +565,15 @@ describe('StrictEffectsMode', () => { } await act(() => { - ReactTestRenderer.create(, {isConcurrent: true}); + ReactTestRenderer.create( + + + , + {isConcurrent: true}, + ); }); - if (supportsDoubleInvokeEffects()) { + if (__DEV__) { assertLog([ 'App useLayoutEffect mount', 'App useEffect mount', @@ -522,7 +590,7 @@ describe('StrictEffectsMode', () => { _setShowChild(true); }); - if (supportsDoubleInvokeEffects()) { + if (__DEV__) { assertLog([ 'App useLayoutEffect unmount', 'Child useLayoutEffect mount', @@ -585,12 +653,17 @@ describe('StrictEffectsMode', () => { let renderer; await act(() => { - renderer = ReactTestRenderer.create(, { - isConcurrent: true, - }); + renderer = ReactTestRenderer.create( + + + , + { + isConcurrent: true, + }, + ); }); - if (supportsDoubleInvokeEffects()) { + if (__DEV__) { assertLog([ 'componentDidMount', 'useLayoutEffect mount', @@ -611,7 +684,11 @@ describe('StrictEffectsMode', () => { } await act(() => { - renderer.update(); + renderer.update( + + + , + ); }); assertLog([ @@ -666,12 +743,17 @@ describe('StrictEffectsMode', () => { let renderer; await act(() => { - renderer = ReactTestRenderer.create(, { - isConcurrent: true, - }); + renderer = ReactTestRenderer.create( + + + , + { + isConcurrent: true, + }, + ); }); - if (supportsDoubleInvokeEffects()) { + if (__DEV__) { assertLog([ 'useLayoutEffect mount', 'useEffect mount', @@ -686,7 +768,11 @@ describe('StrictEffectsMode', () => { } await act(() => { - renderer.update(); + renderer.update( + + + , + ); }); assertLog([ diff --git a/packages/react-reconciler/src/__tests__/StrictEffectsModeDefaults-test.internal.js b/packages/react-reconciler/src/__tests__/StrictEffectsModeDefaults-test.internal.js index fa72a610ab9a8..880b77a27abe7 100644 --- a/packages/react-reconciler/src/__tests__/StrictEffectsModeDefaults-test.internal.js +++ b/packages/react-reconciler/src/__tests__/StrictEffectsModeDefaults-test.internal.js @@ -32,9 +32,6 @@ describe('StrictEffectsMode defaults', () => { waitForAll = InternalTestUtils.waitForAll; waitForPaint = InternalTestUtils.waitForPaint; assertLog = InternalTestUtils.assertLog; - - const ReactFeatureFlags = require('shared/ReactFeatureFlags'); - ReactFeatureFlags.createRootStrictEffectsByDefault = __DEV__; }); it('should not double invoke effects in legacy mode', async () => { @@ -53,7 +50,11 @@ describe('StrictEffectsMode defaults', () => { } await act(() => { - ReactNoop.renderLegacySyncRoot(); + ReactNoop.renderLegacySyncRoot( + + + , + ); }); assertLog(['useLayoutEffect mount', 'useEffect mount']); @@ -79,7 +80,11 @@ describe('StrictEffectsMode defaults', () => { } await act(() => { - ReactNoop.renderLegacySyncRoot(); + ReactNoop.renderLegacySyncRoot( + + + , + ); }); assertLog(['componentDidMount']); @@ -98,9 +103,9 @@ describe('StrictEffectsMode defaults', () => { await act(async () => { ReactNoop.render( - <> + - , + , ); await waitForPaint([ @@ -112,10 +117,10 @@ describe('StrictEffectsMode defaults', () => { await act(async () => { ReactNoop.render( - <> + - , + , ); assertLog([]); @@ -151,9 +156,9 @@ describe('StrictEffectsMode defaults', () => { await act(async () => { ReactNoop.render( - <> + - , + , ); await waitForAll([ @@ -168,10 +173,10 @@ describe('StrictEffectsMode defaults', () => { await act(async () => { ReactNoop.render( - <> + - , + , ); await waitFor([ @@ -209,7 +214,11 @@ describe('StrictEffectsMode defaults', () => { return text; } await act(() => { - ReactNoop.render(); + ReactNoop.render( + + + , + ); }); assertLog([ @@ -222,7 +231,11 @@ describe('StrictEffectsMode defaults', () => { ]); await act(() => { - ReactNoop.render(); + ReactNoop.render( + + + , + ); }); assertLog([ @@ -255,7 +268,11 @@ describe('StrictEffectsMode defaults', () => { } await act(() => { - ReactNoop.render(); + ReactNoop.render( + + + , + ); }); assertLog([ @@ -268,7 +285,11 @@ describe('StrictEffectsMode defaults', () => { ]); await act(() => { - ReactNoop.render(); + ReactNoop.render( + + + , + ); }); assertLog([ @@ -301,7 +322,11 @@ describe('StrictEffectsMode defaults', () => { } await act(() => { - ReactNoop.render(); + ReactNoop.render( + + + , + ); }); assertLog([ @@ -314,7 +339,11 @@ describe('StrictEffectsMode defaults', () => { ]); await act(() => { - ReactNoop.render(); + ReactNoop.render( + + + , + ); }); assertLog([ @@ -345,7 +374,11 @@ describe('StrictEffectsMode defaults', () => { } await act(() => { - ReactNoop.render(); + ReactNoop.render( + + + , + ); }); assertLog([ @@ -356,7 +389,11 @@ describe('StrictEffectsMode defaults', () => { ]); await act(() => { - ReactNoop.render(); + ReactNoop.render( + + + , + ); }); assertLog(['useLayoutEffect mount', 'useEffect mount']); @@ -383,7 +420,11 @@ describe('StrictEffectsMode defaults', () => { } await act(() => { - ReactNoop.render(); + ReactNoop.render( + + + , + ); }); expect(onRefMock.mock.calls.length).toBe(3); @@ -417,7 +458,11 @@ describe('StrictEffectsMode defaults', () => { } await act(() => { - ReactNoop.render(); + ReactNoop.render( + + + , + ); }); assertLog([ @@ -447,7 +492,11 @@ describe('StrictEffectsMode defaults', () => { } await act(() => { - ReactNoop.render(); + ReactNoop.render( + + + , + ); }); assertLog([ @@ -457,7 +506,11 @@ describe('StrictEffectsMode defaults', () => { ]); await act(() => { - ReactNoop.render(); + ReactNoop.render( + + + , + ); }); assertLog(['componentDidUpdate']); @@ -490,7 +543,11 @@ describe('StrictEffectsMode defaults', () => { } await act(() => { - ReactNoop.render(); + ReactNoop.render( + + + , + ); }); assertLog([ @@ -540,7 +597,11 @@ describe('StrictEffectsMode defaults', () => { } await act(() => { - ReactNoop.render(); + ReactNoop.render( + + + , + ); }); assertLog([ @@ -599,15 +660,19 @@ describe('StrictEffectsMode defaults', () => { function App({text}) { return ( - <> + - + ); } await act(() => { - ReactNoop.render(); + ReactNoop.render( + + + , + ); }); assertLog([ @@ -623,7 +688,11 @@ describe('StrictEffectsMode defaults', () => { ]); await act(() => { - ReactNoop.render(); + ReactNoop.render( + + + , + ); }); assertLog([ diff --git a/packages/shared/ReactFeatureFlags.js b/packages/shared/ReactFeatureFlags.js index 2645259e21244..845ff9645a838 100644 --- a/packages/shared/ReactFeatureFlags.js +++ b/packages/shared/ReactFeatureFlags.js @@ -171,13 +171,6 @@ export const enableFilterEmptyStringAttributesDOM = __NEXT_MAJOR__; // when we plan to enable them. // ----------------------------------------------------------------------------- -// This flag enables Strict Effects by default. We're not turning this on until -// after 18 because it requires migration work. Recommendation is to use -// to gradually upgrade components. -// If TRUE, trees rendered with createRoot will be StrictEffectsMode. -// If FALSE, these trees will be StrictLegacyMode. -export const createRootStrictEffectsByDefault = false; - export const disableModulePatternComponents = false; export const enableUseRefAccessWarning = false; diff --git a/packages/shared/forks/ReactFeatureFlags.native-fb.js b/packages/shared/forks/ReactFeatureFlags.native-fb.js index a755367778cf1..d98e4e508101f 100644 --- a/packages/shared/forks/ReactFeatureFlags.native-fb.js +++ b/packages/shared/forks/ReactFeatureFlags.native-fb.js @@ -72,8 +72,6 @@ export const retryLaneExpirationMs = 5000; export const syncLaneExpirationMs = 250; export const transitionLaneExpirationMs = 5000; -export const createRootStrictEffectsByDefault = false; - export const disableSchedulerTimeoutInWorkLoop = false; export const enableLazyContextPropagation = false; export const enableLegacyHidden = true; diff --git a/packages/shared/forks/ReactFeatureFlags.native-oss.js b/packages/shared/forks/ReactFeatureFlags.native-oss.js index bbf13e845205d..a8fb8c9ad740e 100644 --- a/packages/shared/forks/ReactFeatureFlags.native-oss.js +++ b/packages/shared/forks/ReactFeatureFlags.native-oss.js @@ -55,7 +55,6 @@ export const retryLaneExpirationMs = 5000; export const syncLaneExpirationMs = 250; export const transitionLaneExpirationMs = 5000; -export const createRootStrictEffectsByDefault = false; export const enableUseRefAccessWarning = false; export const disableSchedulerTimeoutInWorkLoop = false; diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.js index 3d38a4d24795f..fa019f07600d3 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.js @@ -55,7 +55,6 @@ export const retryLaneExpirationMs = 5000; export const syncLaneExpirationMs = 250; export const transitionLaneExpirationMs = 5000; -export const createRootStrictEffectsByDefault = false; export const enableUseRefAccessWarning = false; export const disableSchedulerTimeoutInWorkLoop = false; diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js index d3c65d1679607..347ff62abf9af 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js @@ -49,7 +49,6 @@ export const enableCPUSuspense = false; export const enableUseMemoCacheHook = true; export const enableUseEffectEventHook = false; export const enableClientRenderFallbackOnTextMismatch = true; -export const createRootStrictEffectsByDefault = false; export const enableUseRefAccessWarning = false; export const enableRetryLaneExpiration = false; diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js index e5c1d418c80a1..236d46b4a5756 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js @@ -55,7 +55,6 @@ export const retryLaneExpirationMs = 5000; export const syncLaneExpirationMs = 250; export const transitionLaneExpirationMs = 5000; -export const createRootStrictEffectsByDefault = false; export const enableUseRefAccessWarning = false; export const disableSchedulerTimeoutInWorkLoop = false; diff --git a/packages/shared/forks/ReactFeatureFlags.www.js b/packages/shared/forks/ReactFeatureFlags.www.js index 8d5c0ed009fbb..15f5b993c8254 100644 --- a/packages/shared/forks/ReactFeatureFlags.www.js +++ b/packages/shared/forks/ReactFeatureFlags.www.js @@ -49,7 +49,6 @@ export const enableProfilerNestedUpdateScheduledHook: boolean = __PROFILE__ && dynamicFeatureFlags.enableProfilerNestedUpdateScheduledHook; export const enableUpdaterTracking = __PROFILE__; -export const createRootStrictEffectsByDefault = false; export const enableSuspenseAvoidThisFallback = true; export const enableSuspenseAvoidThisFallbackFizz = false; diff --git a/scripts/jest/TestFlags.js b/scripts/jest/TestFlags.js index 78908d91eb169..80b9efe4faac7 100644 --- a/scripts/jest/TestFlags.js +++ b/scripts/jest/TestFlags.js @@ -50,9 +50,6 @@ const environmentFlags = { FIXME: false, TODO: false, - // Turn these flags back on (or delete) once the effect list is removed in - // favor of a depth-first traversal using `subtreeTags`. - dfsEffectsRefactor: true, enableUseJSStackToTrackPassiveDurations: false, };