From b1fbb1406541b0ff0b4373a7ac53dcd3bcafedc9 Mon Sep 17 00:00:00 2001
From: Josh Story <story@hey.com>
Date: Wed, 25 May 2022 12:36:55 -0700
Subject: [PATCH 1/2] Test to assert that hydration errors of an inner
 suspended boundary are not retained by an unsuspended outer boundary

---
 .../src/__tests__/ReactDOMFizzServer-test.js  | 46 +++++++++++++++++++
 1 file changed, 46 insertions(+)

diff --git a/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js b/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js
index 105fe10eef57..d1ccf6d8efd7 100644
--- a/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js
+++ b/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js
@@ -3531,4 +3531,50 @@ describe('ReactDOMFizzServer', () => {
       console.error = originalConsoleError;
     }
   });
+
+  // @gate experimental
+  it('#24578 Hydration errors caused by a suspending component should not become recoverable when nested in an ancestor Suspense that is showing primary content', async () => {
+    // this test failed before because hydration errors on the inner boundary were upgraded to recoverable by
+    // a codepath of the outer boundary
+    function App({isClient}) {
+      return (
+        <Suspense fallback={'outer'}>
+          <Suspense fallback={'inner'}>
+            <div>
+              {isClient ? <AsyncText text="A" /> : <Text text="A" />}
+              <b>B</b>
+            </div>
+          </Suspense>
+        </Suspense>
+      );
+    }
+    await act(async () => {
+      const {pipe} = ReactDOMFizzServer.renderToPipeableStream(<App />);
+      pipe(writable);
+    });
+
+    let errors = [];
+    ReactDOMClient.hydrateRoot(container, <App isClient />, {
+      onRecoverableError(error) {
+        errors.push(error.message);
+      },
+    });
+
+    expect(Scheduler).toFlushAndYield([]);
+    expect(errors).toEqual([]);
+    expect(getVisibleChildren(container)).toEqual(
+      <div>
+        A<b>B</b>
+      </div>,
+    );
+
+    resolveText('A');
+    expect(Scheduler).toFlushAndYield([]);
+    expect(errors).toEqual([]);
+    expect(getVisibleChildren(container)).toEqual(
+      <div>
+        A<b>B</b>
+      </div>,
+    );
+  });
 });

From cf2accf9a2b7e9aa9985f8c53c7d29b42ecf9b0f Mon Sep 17 00:00:00 2001
From: Josh Story <story@hey.com>
Date: Wed, 25 May 2022 12:48:37 -0700
Subject: [PATCH 2/2] lints

---
 packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js b/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js
index d1ccf6d8efd7..9a6cfd457c8d 100644
--- a/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js
+++ b/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js
@@ -3553,8 +3553,8 @@ describe('ReactDOMFizzServer', () => {
       pipe(writable);
     });
 
-    let errors = [];
-    ReactDOMClient.hydrateRoot(container, <App isClient />, {
+    const errors = [];
+    ReactDOMClient.hydrateRoot(container, <App isClient={true} />, {
       onRecoverableError(error) {
         errors.push(error.message);
       },