diff --git a/packages/react-dom/src/__tests__/ReactServerRenderingHydration-test.js b/packages/react-dom/src/__tests__/ReactServerRenderingHydration-test.js
index 33e56bba260ef..1707f9f1dbdc5 100644
--- a/packages/react-dom/src/__tests__/ReactServerRenderingHydration-test.js
+++ b/packages/react-dom/src/__tests__/ReactServerRenderingHydration-test.js
@@ -659,4 +659,15 @@ describe('ReactDOMServerHydration', () => {
document.body.removeChild(parentContainer);
});
+
+ it('regression test: Suspense + hydration in legacy mode ', () => {
+ const element = document.createElement('div');
+ element.innerHTML = '
Hello World
';
+ ReactDOM.hydrate(
+
+ Hello World
+ ,
+ element,
+ );
+ });
});
diff --git a/packages/react-reconciler/src/ReactFiberHydrationContext.js b/packages/react-reconciler/src/ReactFiberHydrationContext.js
index 8ae0f7b851647..781335b901463 100644
--- a/packages/react-reconciler/src/ReactFiberHydrationContext.js
+++ b/packages/react-reconciler/src/ReactFiberHydrationContext.js
@@ -404,11 +404,10 @@ function skipPastDehydratedSuspenseInstance(
let suspenseState: null | SuspenseState = fiber.memoizedState;
let suspenseInstance: null | SuspenseInstance =
suspenseState !== null ? suspenseState.dehydrated : null;
- invariant(
- suspenseInstance,
- 'Expected to have a hydrated suspense instance. ' +
- 'This error is likely caused by a bug in React. Please file an issue.',
- );
+ if (suspenseInstance === null) {
+ // This Suspense boundary was hydrated without a match.
+ return nextHydratableInstance;
+ }
return getNextHydratableInstanceAfterSuspenseInstance(suspenseInstance);
}