{"files":[{"status":"M","path":"packages\/react-dom\/src\/__tests__\/ReactDOM-test.js"}],"commit":{"authorEmail":"silbermann.sebastian@gmail.com","authorName":"Sebastian Silbermann","authoredAt":"2024-02-20T16:51:44+01:00","shortRevision":"7b196be091","subject":"Remove ReactTestUtils from ReactDOM-test (#28377)","revision":"7b196be09167f8fe9091168dab1769a552263065"},"parents":["3c9560b29e77f11b2dc39ccb05a92361e9af2a1d"],"body":"","patch":"diff --git a\/packages\/react-dom\/src\/__tests__\/ReactDOM-test.js b\/packages\/react-dom\/src\/__tests__\/ReactDOM-test.js\nindex 00356cc725..169e82a2cf 100644\n--- a\/packages\/react-dom\/src\/__tests__\/ReactDOM-test.js\n+++ b\/packages\/react-dom\/src\/__tests__\/ReactDOM-test.js\n@@ -13,7 +13,6 @@ let React;\n let ReactDOM;\n let ReactDOMClient;\n let ReactDOMServer;\n-let ReactTestUtils;\n \n let act;\n \n@@ -24,7 +23,6 @@ describe('ReactDOM', () => {\n ReactDOM = require('react-dom');\n ReactDOMClient = require('react-dom\/client');\n ReactDOMServer = require('react-dom\/server');\n- ReactTestUtils = require('react-dom\/test-utils');\n \n act = require('internal-test-utils').act;\n });\n@@ -68,23 +66,37 @@ describe('ReactDOM', () => {\n }\n });\n \n- it('allows a DOM element to be used with a string', () => {\n+ it('allows a DOM element to be used with a string', async () => {\n const element = React.createElement('div', {className: 'foo'});\n- const node = ReactTestUtils.renderIntoDocument(element);\n+ const container = document.createElement('div');\n+ const root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render(element);\n+ });\n+\n+ const node = container.firstChild;\n expect(node.tagName).toBe('DIV');\n });\n \n- it('should allow children to be passed as an argument', () => {\n- const argNode = ReactTestUtils.renderIntoDocument(\n- React.createElement('div', null, 'child'),\n- );\n+ it('should allow children to be passed as an argument', async () => {\n+ const container = document.createElement('div');\n+ const root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render(React.createElement('div', null, 'child'));\n+ });\n+\n+ const argNode = container.firstChild;\n expect(argNode.innerHTML).toBe('child');\n });\n \n- it('should overwrite props.children with children argument', () => {\n- const conflictNode = ReactTestUtils.renderIntoDocument(\n- React.createElement('div', {children: 'fakechild'}, 'child'),\n- );\n+ it('should overwrite props.children with children argument', async () => {\n+ const container = document.createElement('div');\n+ const root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render(React.createElement('div', {children: 'fakechild'}, 'child'));\n+ });\n+\n+ const conflictNode = container.firstChild;\n expect(conflictNode.innerHTML).toBe('child');\n });\n \n@@ -92,45 +104,67 @@ describe('ReactDOM', () => {\n * We need to make sure that updates occur to the actual node that's in the\n * DOM, instead of a stale cache.\n *\/\n- it('should purge the DOM cache when removing nodes', () => {\n- let myDiv = ReactTestUtils.renderIntoDocument(\n-

\n-

,\n-

\n- <\/div>,\n- );\n+ it('should purge the DOM cache when removing nodes', async () => {\n+ let container = document.createElement('div');\n+ let root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render(\n+

\n+

,\n+

\n+ <\/div>,\n+ );\n+ });\n \/\/ Warm the cache with theDog\n- myDiv = ReactTestUtils.renderIntoDocument(\n-

\n-

,\n-

,\n- <\/div>,\n- );\n+ container = document.createElement('div');\n+ root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render(\n+

\n+

,\n+

,\n+ <\/div>,\n+ );\n+ });\n \/\/ Remove theDog - this should purge the cache\n- myDiv = ReactTestUtils.renderIntoDocument(\n-

\n-

,\n- <\/div>,\n- );\n+ container = document.createElement('div');\n+ root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render(\n+

\n+

,\n+ <\/div>,\n+ );\n+ });\n \/\/ Now, put theDog back. It's now a different DOM node.\n- myDiv = ReactTestUtils.renderIntoDocument(\n-

\n-

,\n-

,\n- <\/div>,\n- );\n+ container = document.createElement('div');\n+ root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render(\n+

\n+

,\n+

,\n+ <\/div>,\n+ );\n+ });\n \/\/ Change the className of theDog. It will use the same element\n- myDiv = ReactTestUtils.renderIntoDocument(\n-

\n-

,\n-

,\n- <\/div>,\n- );\n+ container = document.createElement('div');\n+ root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render(\n+

\n+

,\n+

,\n+ <\/div>,\n+ );\n+ });\n+\n+ const myDiv = container.firstChild;\n const dog = myDiv.childNodes[0];\n expect(dog.className).toBe('bigdog');\n });\n \n- it('throws in render() if the mount callback is not a function', () => {\n+ it('throws in render() if the mount callback in legacy roots is not a function', async () => {\n function Foo() {\n this.a = 1;\n this.b = 2;\n@@ -182,7 +216,7 @@ describe('ReactDOM', () => {\n );\n });\n \n- it('throws in render() if the update callback is not a function', () => {\n+ it('throws in render() if the update callback in legacy roots is not a function', async () => {\n function Foo() {\n this.a = 1;\n this.b = 2;\n@@ -411,21 +445,26 @@ describe('ReactDOM', () => {\n });\n \n it('should not crash calling findDOMNode inside a function component', async () => {\n- const root = ReactDOMClient.createRoot(document.createElement('div'));\n-\n class Component extends React.Component {\n render() {\n return

;\n }\n }\n \n- const instance = ReactTestUtils.renderIntoDocument();\n+ const container = document.createElement('div');\n+ let root = ReactDOMClient.createRoot(container);\n+ let instance;\n+ await act(() => {\n+ root.render( (instance = current)} \/>);\n+ });\n+\n const App = () => {\n ReactDOM.findDOMNode(instance);\n return

;\n };\n \n if (__DEV__) {\n+ root = ReactDOMClient.createRoot(document.createElement('div'));\n await act(() => {\n root.render();\n });\n"}

dillon1000/react

Files changed