{"parents":["44952dc9840d335fe76bf1501919ec36f54591e9"],"commit":{"subject":"Convert ReactScope to createRoot (#28172)","authorEmail":"silbermann.sebastian@gmail.com","shortRevision":"2dc428f746","revision":"2dc428f746c080bb5bfe478556a051e75eac6e05","authorName":"Sebastian Silbermann","authoredAt":"2024-02-02T00:51:10+01:00"},"files":[{"path":"packages\/react-reconciler\/src\/__tests__\/ReactScope-test.internal.js","status":"M"}],"body":"","patch":"diff --git a\/packages\/react-reconciler\/src\/__tests__\/ReactScope-test.internal.js b\/packages\/react-reconciler\/src\/__tests__\/ReactScope-test.internal.js\nindex 66ae53a757..4ad7bab561 100644\n--- a\/packages\/react-reconciler\/src\/__tests__\/ReactScope-test.internal.js\n+++ b\/packages\/react-reconciler\/src\/__tests__\/ReactScope-test.internal.js\n@@ -26,12 +26,10 @@ describe('ReactScope', () => {\n });\n \n describe('ReactDOM', () => {\n- let ReactDOM;\n let ReactDOMClient;\n let container;\n \n beforeEach(() => {\n- ReactDOM = require('react-dom');\n ReactDOMClient = require('react-dom\/client');\n ReactDOMServer = require('react-dom\/server');\n container = document.createElement('div');\n@@ -44,7 +42,7 @@ describe('ReactScope', () => {\n });\n \n \/\/ @gate www\n- it('DO_NOT_USE_queryAllNodes() works as intended', () => {\n+ it('DO_NOT_USE_queryAllNodes() works as intended', async () => {\n const testScopeQuery = (type, props) => true;\n const TestScope = React.unstable_Scope;\n const scopeRef = React.createRef();\n@@ -68,18 +66,28 @@ describe('ReactScope', () => {\n );\n }\n \n- ReactDOM.render(, container);\n+ const root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render();\n+ });\n+\n let nodes = scopeRef.current.DO_NOT_USE_queryAllNodes(testScopeQuery);\n expect(nodes).toEqual([divRef.current, spanRef.current, aRef.current]);\n- ReactDOM.render(, container);\n+ await act(() => {\n+ root.render();\n+ });\n+\n nodes = scopeRef.current.DO_NOT_USE_queryAllNodes(testScopeQuery);\n expect(nodes).toEqual([aRef.current, divRef.current, spanRef.current]);\n- ReactDOM.render(null, container);\n+ await act(() => {\n+ root.render(null);\n+ });\n+\n expect(scopeRef.current).toBe(null);\n });\n \n \/\/ @gate www\n- it('DO_NOT_USE_queryAllNodes() provides the correct host instance', () => {\n+ it('DO_NOT_USE_queryAllNodes() provides the correct host instance', async () => {\n const testScopeQuery = (type, props) => type === 'div';\n const TestScope = React.unstable_Scope;\n const scopeRef = React.createRef();\n@@ -103,7 +111,11 @@ describe('ReactScope', () => {\n );\n }\n \n- ReactDOM.render(, container);\n+ const root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render();\n+ });\n+\n let nodes = scopeRef.current.DO_NOT_USE_queryAllNodes(testScopeQuery);\n expect(nodes).toEqual([divRef.current]);\n let filterQuery = (type, props, instance) =>\n@@ -115,18 +127,24 @@ describe('ReactScope', () => {\n testScopeQuery(type, props);\n nodes = scopeRef.current.DO_NOT_USE_queryAllNodes(filterQuery);\n expect(nodes).toEqual([divRef.current, spanRef.current, aRef.current]);\n- ReactDOM.render(, container);\n+ await act(() => {\n+ root.render();\n+ });\n+\n filterQuery = (type, props, instance) =>\n [spanRef.current, aRef.current].includes(instance) ||\n testScopeQuery(type, props);\n nodes = scopeRef.current.DO_NOT_USE_queryAllNodes(filterQuery);\n expect(nodes).toEqual([aRef.current, divRef.current, spanRef.current]);\n- ReactDOM.render(null, container);\n+ await act(() => {\n+ root.render(null);\n+ });\n+\n expect(scopeRef.current).toBe(null);\n });\n \n \/\/ @gate www\n- it('DO_NOT_USE_queryFirstNode() works as intended', () => {\n+ it('DO_NOT_USE_queryFirstNode() works as intended', async () => {\n const testScopeQuery = (type, props) => true;\n const TestScope = React.unstable_Scope;\n const scopeRef = React.createRef();\n@@ -150,18 +168,28 @@ describe('ReactScope', () => {\n );\n }\n \n- ReactDOM.render(, container);\n+ const root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render();\n+ });\n+\n let node = scopeRef.current.DO_NOT_USE_queryFirstNode(testScopeQuery);\n expect(node).toEqual(divRef.current);\n- ReactDOM.render(, container);\n+ await act(() => {\n+ root.render();\n+ });\n+\n node = scopeRef.current.DO_NOT_USE_queryFirstNode(testScopeQuery);\n expect(node).toEqual(aRef.current);\n- ReactDOM.render(null, container);\n+ await act(() => {\n+ root.render(null);\n+ });\n+\n expect(scopeRef.current).toBe(null);\n });\n \n \/\/ @gate www\n- it('containsNode() works as intended', () => {\n+ it('containsNode() works as intended', async () => {\n const TestScope = React.unstable_Scope;\n const scopeRef = React.createRef();\n const divRef = React.createRef();\n@@ -194,24 +222,34 @@ describe('ReactScope', () => {\n );\n }\n \n- ReactDOM.render(, container);\n+ const root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render();\n+ });\n+\n expect(scopeRef.current.containsNode(divRef.current)).toBe(true);\n expect(scopeRef.current.containsNode(spanRef.current)).toBe(true);\n expect(scopeRef.current.containsNode(aRef.current)).toBe(true);\n expect(scopeRef.current.containsNode(outerSpan.current)).toBe(false);\n expect(scopeRef.current.containsNode(emRef.current)).toBe(false);\n- ReactDOM.render(, container);\n+ await act(() => {\n+ root.render();\n+ });\n+\n expect(scopeRef.current.containsNode(divRef.current)).toBe(true);\n expect(scopeRef.current.containsNode(spanRef.current)).toBe(true);\n expect(scopeRef.current.containsNode(aRef.current)).toBe(true);\n expect(scopeRef.current.containsNode(outerSpan.current)).toBe(false);\n expect(scopeRef.current.containsNode(emRef.current)).toBe(true);\n- ReactDOM.render(, container);\n+ await act(() => {\n+ root.render();\n+ });\n+\n expect(scopeRef.current.containsNode(emRef.current)).toBe(false);\n });\n \n \/\/ @gate www\n- it('scopes support server-side rendering and hydration', () => {\n+ it('scopes support server-side rendering and hydration', async () => {\n const TestScope = React.unstable_Scope;\n const scopeRef = React.createRef();\n const divRef = React.createRef();\n@@ -235,14 +273,16 @@ describe('ReactScope', () => {\n '

DIV<\/div>SPAN<\/span>A<\/a>

Outside content!<\/div><\/div>',\n );\n container.innerHTML = html;\n- ReactDOM.hydrate(, container);\n+ await act(() => {\n+ ReactDOMClient.hydrateRoot(container, );\n+ });\n const testScopeQuery = (type, props) => true;\n const nodes = scopeRef.current.DO_NOT_USE_queryAllNodes(testScopeQuery);\n expect(nodes).toEqual([divRef.current, spanRef.current, aRef.current]);\n });\n \n \/\/ @gate www\n- it('getChildContextValues() works as intended', () => {\n+ it('getChildContextValues() works as intended', async () => {\n const TestContext = React.createContext();\n const TestScope = React.unstable_Scope;\n const scopeRef = React.createRef();\n@@ -260,13 +300,23 @@ describe('ReactScope', () => {\n );\n }\n \n- ReactDOM.render(, container);\n+ const root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render();\n+ });\n+\n let nodes = scopeRef.current.getChildContextValues(TestContext);\n expect(nodes).toEqual([1]);\n- ReactDOM.render(, container);\n+ await act(() => {\n+ root.render();\n+ });\n+\n nodes = scopeRef.current.getChildContextValues(TestContext);\n expect(nodes).toEqual([1, 2]);\n- ReactDOM.render(null, container);\n+ await act(() => {\n+ root.render(null);\n+ });\n+\n expect(scopeRef.current).toBe(null);\n });\n \n"}

dillon1000/react

Files changed