{"commit":{"authorName":"Ricky","revision":"a10a9a6b5b891dd3ce238bf39a6147bb0f3a1d2a","shortRevision":"a10a9a6b5b","authorEmail":"rickhanlonii@gmail.com","authoredAt":"2022-05-03T14:24:23-04:00","subject":"Add test for hiding children after layout destroy (#24483)"},"body":"","parents":["b4eb0ad71fb365cb760a5b9ab1a1e2dd6193fac7"],"files":[{"status":"M","path":"packages\/react-reconciler\/src\/__tests__\/ReactOffscreen-test.js"},{"status":"M","path":"packages\/shared\/ReactFeatureFlags.js"}],"patch":"diff --git a\/packages\/react-reconciler\/src\/__tests__\/ReactOffscreen-test.js b\/packages\/react-reconciler\/src\/__tests__\/ReactOffscreen-test.js\nindex 3125fcc29e..13257a82b8 100644\n--- a\/packages\/react-reconciler\/src\/__tests__\/ReactOffscreen-test.js\n+++ b\/packages\/react-reconciler\/src\/__tests__\/ReactOffscreen-test.js\n@@ -310,6 +310,47 @@ describe('ReactOffscreen', () => {\n expect(root).toMatchRenderedOutput();\n });\n \n+ \/\/ @gate experimental || www\n+ \/\/ @gate enableSuspenseLayoutEffectSemantics\n+ \/\/ @gate enableFlipOffscreenUnhideOrder\n+ it('hides children of offscreen after layout effects are destroyed', async () => {\n+ const root = ReactNoop.createRoot();\n+ function Child({text}) {\n+ useLayoutEffect(() => {\n+ Scheduler.unstable_yieldValue('Mount layout');\n+ return () => {\n+ \/\/ The child should not be hidden yet.\n+ expect(root).toMatchRenderedOutput();\n+ Scheduler.unstable_yieldValue('Unmount layout');\n+ };\n+ }, []);\n+ return ;\n+ }\n+\n+ await act(async () => {\n+ root.render(\n+ \n+ \n+ <\/Offscreen>,\n+ );\n+ });\n+ expect(Scheduler).toHaveYielded(['Child', 'Mount layout']);\n+ expect(root).toMatchRenderedOutput();\n+\n+ \/\/ Hide the tree. The layout effect is unmounted.\n+ await act(async () => {\n+ root.render(\n+ \n+ \n+ <\/Offscreen>,\n+ );\n+ });\n+ expect(Scheduler).toHaveYielded(['Unmount layout', 'Child']);\n+\n+ \/\/ After the layout effect is unmounted, the child is hidden.\n+ expect(root).toMatchRenderedOutput(

dillon1000/react

Files changed