diff --git a/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js b/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js index da59ac66faef5..410766217d86e 100644 --- a/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js @@ -2348,6 +2348,50 @@ describe('ReactDOMFizzServer', () => { }, ); + it('can hydrate uSES in StrictMode with different client and server snapshot', async () => { + function subscribe() { + return () => {}; + } + function getClientSnapshot() { + return 'Yay!'; + } + function getServerSnapshot() { + return 'Nay!'; + } + + function App() { + const value = useSyncExternalStore( + subscribe, + getClientSnapshot, + getServerSnapshot, + ); + Scheduler.log(value); + + return value; + } + + const element = ( + + + + ); + + await act(async () => { + const {pipe} = renderToPipeableStream(element); + pipe(writable); + }); + + assertLog(['Nay!']); + expect(getVisibleChildren(container)).toEqual('Nay!'); + + await clientAct(() => { + ReactDOMClient.hydrateRoot(container, element); + }); + + expect(getVisibleChildren(container)).toEqual('Yay!'); + assertLog(['Nay!', 'Yay!']); + }); + it( 'errors during hydration force a client render at the nearest Suspense ' + 'boundary, and during the client render it recovers',