Use concurrent root in RTR (#28498)

Based on - #28497 - #28419 Reusing the disableLegacyMode flag, we set ReactTestRenderer to always render with concurrent root where legacy APIs are no longer available. If disableLegacyMode is false, we continue to allow the unstable_isConcurrent option determine the root type. Also checking a global `IS_REACT_NATIVE_TEST_ENVIRONMENT` so we can maintain the existing behavior for RN until we remove legacy root support there.
facebook · Mar 26, 2024 · bb66aa3 · bb66aa3
1 parent 1f9befe
commit bb66aa3
Show file tree

Hide file tree

Showing 8 changed files with 536 additions and 274 deletions.
diff --git a/packages/react-reconciler/src/__tests__/ErrorBoundaryReconciliation-test.internal.js b/packages/react-reconciler/src/__tests__/ErrorBoundaryReconciliation-test.internal.js
@@ -46,45 +46,40 @@ describe('ErrorBoundaryReconciliation', () => {
       fail ? <InvalidType /> : <span prop="BrokenRender" />;
   });
 
-  [true, false].forEach(isConcurrent => {
-    async function sharedTest(ErrorBoundary, fallbackTagName) {
-      let renderer;
+  async function sharedTest(ErrorBoundary, fallbackTagName) {
+    let renderer;
 
+    await act(() => {
+      renderer = ReactTestRenderer.create(
+        <ErrorBoundary fallbackTagName={fallbackTagName}>
+          <BrokenRender fail={false} />
+        </ErrorBoundary>,
+        {unstable_isConcurrent: true},
+      );
+    });
+    expect(renderer).toMatchRenderedOutput(<span prop="BrokenRender" />);
+    await expect(async () => {
       await act(() => {
-        renderer = ReactTestRenderer.create(
+        renderer.update(
           <ErrorBoundary fallbackTagName={fallbackTagName}>
-            <BrokenRender fail={false} />
+            <BrokenRender fail={true} />
           </ErrorBoundary>,
-          {unstable_isConcurrent: isConcurrent},
         );
       });
-      expect(renderer).toMatchRenderedOutput(<span prop="BrokenRender" />);
-
-      await expect(async () => {
-        await act(() => {
-          renderer.update(
-            <ErrorBoundary fallbackTagName={fallbackTagName}>
-              <BrokenRender fail={true} />
-            </ErrorBoundary>,
-          );
-        });
-      }).toErrorDev(isConcurrent ? ['invalid', 'invalid'] : ['invalid']);
-      const Fallback = fallbackTagName;
-      expect(renderer).toMatchRenderedOutput(<Fallback prop="ErrorBoundary" />);
-    }
+    }).toErrorDev(['invalid', 'invalid']);
+    const Fallback = fallbackTagName;
+    expect(renderer).toMatchRenderedOutput(<Fallback prop="ErrorBoundary" />);
+  }
 
-    describe(isConcurrent ? 'concurrent' : 'sync', () => {
-      it('componentDidCatch can recover by rendering an element of the same type', () =>
-        sharedTest(DidCatchErrorBoundary, 'span'));
+  it('componentDidCatch can recover by rendering an element of the same type', () =>
+    sharedTest(DidCatchErrorBoundary, 'span'));
 
-      it('componentDidCatch can recover by rendering an element of a different type', () =>
-        sharedTest(DidCatchErrorBoundary, 'div'));
+  it('componentDidCatch can recover by rendering an element of a different type', () =>
+    sharedTest(DidCatchErrorBoundary, 'div'));
 
-      it('getDerivedStateFromError can recover by rendering an element of the same type', () =>
-        sharedTest(GetDerivedErrorBoundary, 'span'));
+  it('getDerivedStateFromError can recover by rendering an element of the same type', () =>
+    sharedTest(GetDerivedErrorBoundary, 'span'));
 
-      it('getDerivedStateFromError can recover by rendering an element of a different type', () =>
-        sharedTest(GetDerivedErrorBoundary, 'div'));
-    });
-  });
+  it('getDerivedStateFromError can recover by rendering an element of a different type', () =>
+    sharedTest(GetDerivedErrorBoundary, 'div'));
 });
diff --git a/packages/react-reconciler/src/__tests__/ReactLazy-test.internal.js b/packages/react-reconciler/src/__tests__/ReactLazy-test.internal.js
@@ -1451,6 +1451,7 @@ describe('ReactLazy', () => {
   });
 
   describe('legacy mode', () => {
+    // @gate !disableLegacyMode
     it('mount and reorder lazy elements (legacy mode)', async () => {
       class Child extends React.Component {
         componentDidMount() {
@@ -1520,6 +1521,7 @@ describe('ReactLazy', () => {
       expect(root).toMatchRenderedOutput('ba');
     });
 
+    // @gate !disableLegacyMode
     it('mount and reorder lazy types (legacy mode)', async () => {
       class Child extends React.Component {
         componentDidMount() {

diff --git a/packages/react-test-renderer/src/ReactTestRenderer.js b/packages/react-test-renderer/src/ReactTestRenderer.js
@@ -55,6 +55,7 @@ import {ConcurrentRoot, LegacyRoot} from 'react-reconciler/src/ReactRootTags';
 import {
   allowConcurrentByDefault,
   enableReactTestRendererWarning,
+  disableLegacyMode,
 } from 'shared/ReactFeatureFlags';
 
 const act = React.act;
@@ -485,16 +486,19 @@ function create(
   }
 
   let createNodeMock = defaultTestOptions.createNodeMock;
-  let isConcurrent = false;
+  const isConcurrentOnly =
+    disableLegacyMode === true &&
+    global.IS_REACT_NATIVE_TEST_ENVIRONMENT !== true;
+  let isConcurrent = isConcurrentOnly;
   let isStrictMode = false;
   let concurrentUpdatesByDefault = null;
   if (typeof options === 'object' && options !== null) {
     if (typeof options.createNodeMock === 'function') {
       // $FlowFixMe[incompatible-type] found when upgrading Flow
       createNodeMock = options.createNodeMock;
     }
-    if (options.unstable_isConcurrent === true) {
-      isConcurrent = true;
+    if (isConcurrentOnly === false) {
+      isConcurrent = options.unstable_isConcurrent;
     }
     if (options.unstable_strictMode === true) {
       isStrictMode = true;