diff --git a/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js b/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js index 0838371bef92c..d0e1c4a670c7e 100644 --- a/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js @@ -4438,6 +4438,70 @@ describe('ReactDOMFizzServer', () => { }); }); + it('should correctly handle different promises in React.use() across lazy components', async () => { + const promise1 = Promise.resolve('value1'); + const promise2 = Promise.resolve('value2'); + + let component1Rendered = false; + let component2Rendered = false; + + function Component1() { + const data = React.use(promise1); + component1Rendered = true; + return ( +
+ Component1: {data} + + + +
+ ); + } + + function Component2() { + const data = React.use(promise2); + component2Rendered = true; + return
Component2: {data}
; + } + + const Component2Lazy = React.lazy(async () => ({default: Component2})); + + function App() { + return ( +
+ + + +
+ ); + } + + await act(async () => { + const {pipe} = renderToPipeableStream(); + pipe(writable); + }); + + // Wait for the stream to complete + await act(() => {}); + + expect(component1Rendered).toBe(true); + expect(component2Rendered).toBe(true); + + // Verify both components received the correct values + expect(getVisibleChildren(container)).toEqual( +
+
+ Component1: + value1 +
+ Component2: + value2 +
+
+
, + ); + }); + describe('