{"body":"","parents":["cdfaae73c4768ddcce724872b1aa45130b39c85f"],"patch":"diff --git a\/packages\/react-interactions\/events\/src\/dom\/create-event-handle\/__tests__\/useFocusWithin-test.internal.js b\/packages\/react-interactions\/events\/src\/dom\/create-event-handle\/__tests__\/useFocusWithin-test.internal.js\nindex 4d2cd43041..f77dd5b779 100644\n--- a\/packages\/react-interactions\/events\/src\/dom\/create-event-handle\/__tests__\/useFocusWithin-test.internal.js\n+++ b\/packages\/react-interactions\/events\/src\/dom\/create-event-handle\/__tests__\/useFocusWithin-test.internal.js\n@@ -13,7 +13,6 @@ import {createEventTarget, setPointerEvent} from 'dom-event-testing-library';\n \n let React;\n let ReactFeatureFlags;\n-let ReactDOM;\n let ReactDOMClient;\n let useFocusWithin;\n let act;\n@@ -25,7 +24,6 @@ function initializeModules(hasPointerEvents) {\n ReactFeatureFlags.enableScopeAPI = true;\n ReactFeatureFlags.enableCreateEventHandleAPI = true;\n React = require('react');\n- ReactDOM = require('react-dom');\n ReactDOMClient = require('react-dom\/client');\n act = require('internal-test-utils').act;\n \n@@ -42,6 +40,7 @@ const table = [[forcePointerEvents], [!forcePointerEvents]];\n describe.each(table)(`useFocus`, hasPointerEvents => {\n let container;\n let container2;\n+ let root;\n \n beforeEach(() => {\n initializeModules(hasPointerEvents);\n@@ -49,10 +48,14 @@ describe.each(table)(`useFocus`, hasPointerEvents => {\n document.body.appendChild(container);\n container2 = document.createElement('div');\n document.body.appendChild(container2);\n+ root = ReactDOMClient.createRoot(container);\n });\n \n- afterEach(() => {\n- ReactDOM.render(null, container);\n+ afterEach(async () => {\n+ await act(() => {\n+ root.render(null);\n+ });\n+\n document.body.removeChild(container);\n document.body.removeChild(container2);\n container = null;\n@@ -75,7 +78,7 @@ describe.each(table)(`useFocus`, hasPointerEvents => {\n return

;\n };\n await act(() => {\n- ReactDOM.render(, container);\n+ root.render();\n });\n };\n \n@@ -111,7 +114,7 @@ describe.each(table)(`useFocus`, hasPointerEvents => {\n innerRef = React.createRef();\n innerRef2 = React.createRef();\n await act(() => {\n- ReactDOM.render(, container);\n+ root.render();\n });\n };\n \n@@ -188,7 +191,7 @@ describe.each(table)(`useFocus`, hasPointerEvents => {\n innerRef = React.createRef();\n innerRef2 = React.createRef();\n await act(() => {\n- ReactDOM.render(, container);\n+ root.render();\n });\n };\n \n@@ -314,7 +317,7 @@ describe.each(table)(`useFocus`, hasPointerEvents => {\n );\n };\n await act(() => {\n- ReactDOM.render(, container);\n+ root.render();\n });\n \n const target = createEventTarget(inputRef.current);\n@@ -354,7 +357,7 @@ describe.each(table)(`useFocus`, hasPointerEvents => {\n };\n \n await act(() => {\n- ReactDOM.render(, container);\n+ root.render();\n });\n \n const inner = innerRef.current;\n@@ -363,7 +366,10 @@ describe.each(table)(`useFocus`, hasPointerEvents => {\n target.focus();\n expect(onBeforeBlurWithin).toHaveBeenCalledTimes(0);\n expect(onAfterBlurWithin).toHaveBeenCalledTimes(0);\n- ReactDOM.render(, container);\n+ await act(() => {\n+ root.render();\n+ });\n+\n expect(onBeforeBlurWithin).toHaveBeenCalledTimes(1);\n expect(onAfterBlurWithin).toHaveBeenCalledTimes(1);\n expect(onAfterBlurWithin).toHaveBeenCalledWith(\n@@ -391,7 +397,7 @@ describe.each(table)(`useFocus`, hasPointerEvents => {\n };\n \n await act(() => {\n- ReactDOM.render(, container);\n+ root.render();\n });\n \n const inner = innerRef.current;\n@@ -400,7 +406,11 @@ describe.each(table)(`useFocus`, hasPointerEvents => {\n target.focus();\n expect(onBeforeBlurWithin).toHaveBeenCalledTimes(0);\n expect(onAfterBlurWithin).toHaveBeenCalledTimes(0);\n- ReactDOM.render(, container);\n+\n+ await act(() => {\n+ root.render();\n+ });\n+\n expect(onBeforeBlurWithin).toHaveBeenCalledTimes(1);\n expect(onAfterBlurWithin).toHaveBeenCalledTimes(1);\n expect(onAfterBlurWithin).toHaveBeenCalledWith(\n@@ -433,13 +443,16 @@ describe.each(table)(`useFocus`, hasPointerEvents => {\n };\n \n await act(() => {\n- ReactDOM.render(, container);\n+ root.render();\n });\n \n inputRef.current.focus();\n expect(onBeforeBlurWithin).toHaveBeenCalledTimes(0);\n expect(onAfterBlurWithin).toHaveBeenCalledTimes(0);\n- ReactDOM.render(, container);\n+ await act(() => {\n+ root.render();\n+ });\n+\n expect(onBeforeBlurWithin).toHaveBeenCalledTimes(1);\n expect(onAfterBlurWithin).toHaveBeenCalledTimes(1);\n });\n@@ -469,7 +482,7 @@ describe.each(table)(`useFocus`, hasPointerEvents => {\n };\n \n await act(() => {\n- ReactDOM.render(, container);\n+ root.render();\n });\n \n const inner = innerRef.current;\n@@ -477,7 +490,7 @@ describe.each(table)(`useFocus`, hasPointerEvents => {\n target.keydown({key: 'Tab'});\n target.focus();\n await act(() => {\n- ReactDOM.render(, container);\n+ root.render();\n });\n expect(targetNodes).toEqual([targetNode]);\n });\n@@ -512,10 +525,10 @@ describe.each(table)(`useFocus`, hasPointerEvents => {\n );\n };\n \n- const root = ReactDOMClient.createRoot(container2);\n+ const root2 = ReactDOMClient.createRoot(container2);\n \n await act(() => {\n- root.render();\n+ root2.render();\n });\n expect(container2.innerHTML).toBe('

<\/div>');\n \n@@ -528,14 +541,18 @@ describe.each(table)(`useFocus`, hasPointerEvents => {\n \n suspend = true;\n await act(() => {\n- root.render();\n+ root2.render();\n });\n expect(container2.innerHTML).toBe(\n '

Loading...<\/div>',\n );\n expect(onBeforeBlurWithin).toHaveBeenCalledTimes(1);\n expect(onAfterBlurWithin).toHaveBeenCalledTimes(1);\n- resolve();\n+ await act(() => {\n+ suspend = false;\n+ resolve();\n+ });\n+ expect(container2.innerHTML).toBe('

<\/div>');\n });\n \n \/\/ @gate www\n@@ -569,10 +586,10 @@ describe.each(table)(`useFocus`, hasPointerEvents => {\n );\n };\n \n- const root = ReactDOMClient.createRoot(container2);\n+ const root2 = ReactDOMClient.createRoot(container2);\n \n await act(() => {\n- root.render();\n+ root2.render();\n });\n \n expect(onBeforeBlurWithin).toHaveBeenCalledTimes(0);\n@@ -580,13 +597,13 @@ describe.each(table)(`useFocus`, hasPointerEvents => {\n \n suspend = true;\n await act(() => {\n- root.render();\n+ root2.render();\n });\n expect(onBeforeBlurWithin).toHaveBeenCalledTimes(0);\n expect(onAfterBlurWithin).toHaveBeenCalledTimes(0);\n \n await act(() => {\n- root.render();\n+ root2.render();\n });\n expect(onBeforeBlurWithin).toHaveBeenCalledTimes(0);\n expect(onAfterBlurWithin).toHaveBeenCalledTimes(0);\n@@ -594,12 +611,16 @@ describe.each(table)(`useFocus`, hasPointerEvents => {\n buttonRef.current.focus();\n suspend = false;\n await act(() => {\n- root.render();\n+ root2.render();\n });\n expect(onBeforeBlurWithin).toHaveBeenCalledTimes(1);\n expect(onAfterBlurWithin).toHaveBeenCalledTimes(1);\n \n- resolve();\n+ await act(() => {\n+ suspend = false;\n+ resolve();\n+ });\n+ expect(container2.innerHTML).toBe('

<\/div>');\n });\n });\n });\n","files":[{"status":"M","path":"packages\/react-interactions\/events\/src\/dom\/create-event-handle\/__tests__\/useFocusWithin-test.internal.js"}],"commit":{"shortRevision":"971b62f479","revision":"971b62f479a5dbd84688ba2b2c507de2a1d22dcc","authorEmail":"silbermann.sebastian@gmail.com","subject":"Convert useFocusWithin to createRoot (#28128)","authorName":"Sebastian Silbermann","authoredAt":"2024-01-29T17:02:49+01:00"}}

dillon1000/react

Files changed