{"body":"","patch":"diff --git a\/packages\/react-dom\/src\/__tests__\/ReactFunctionComponent-test.js b\/packages\/react-dom\/src\/__tests__\/ReactFunctionComponent-test.js\nindex 2d04c4af90..08406bdd72 100644\n--- a\/packages\/react-dom\/src\/__tests__\/ReactFunctionComponent-test.js\n+++ b\/packages\/react-dom\/src\/__tests__\/ReactFunctionComponent-test.js\n@@ -12,7 +12,6 @@\n let PropTypes;\n let React;\n let ReactDOMClient;\n-let ReactTestUtils;\n let act;\n \n function FunctionComponent(props) {\n@@ -26,7 +25,6 @@ describe('ReactFunctionComponent', () => {\n React = require('react');\n ReactDOMClient = require('react-dom\/client');\n act = require('internal-test-utils').act;\n- ReactTestUtils = require('react-dom\/test-utils');\n });\n \n it('should render stateless component', async () => {\n@@ -161,25 +159,33 @@ describe('ReactFunctionComponent', () => {\n );\n });\n \n- it('should not throw when stateless component returns undefined', () => {\n+ it('should not throw when stateless component returns undefined', async () => {\n function NotAComponent() {}\n- expect(function () {\n- ReactTestUtils.renderIntoDocument(\n-

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

\n+ \n+ <\/div>,\n+ );\n+ }),\n+ ).resolves.not.toThrowError();\n });\n \n- it('should throw on string refs in pure functions', () => {\n+ it('should throw on string refs in pure functions', async () => {\n function Child() {\n return

;\n }\n \n- expect(function () {\n- ReactTestUtils.renderIntoDocument();\n- }).toThrowError(\n+ const container = document.createElement('div');\n+ const root = ReactDOMClient.createRoot(container);\n+ await expect(\n+ act(() => {\n+ root.render();\n+ }),\n+ ).rejects.toThrowError(\n __DEV__\n ? 'Function components cannot have string refs. We recommend using useRef() instead.'\n : \/\/ It happens because we don't save _owner in production for\n@@ -193,7 +199,7 @@ describe('ReactFunctionComponent', () => {\n );\n });\n \n- it('should warn when given a string ref', () => {\n+ it('should warn when given a string ref', async () => {\n function Indirection(props) {\n return

{props.children}<\/div>;\n }\n@@ -208,9 +214,13 @@ describe('ReactFunctionComponent', () => {\n }\n }\n \n- expect(() =>\n- ReactTestUtils.renderIntoDocument(),\n- ).toErrorDev(\n+ await expect(async () => {\n+ const container = document.createElement('div');\n+ const root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render();\n+ });\n+ }).toErrorDev(\n 'Warning: Function components cannot be given refs. ' +\n 'Attempts to access this ref will fail. ' +\n 'Did you mean to use React.forwardRef()?\\n\\n' +\n@@ -223,32 +233,36 @@ describe('ReactFunctionComponent', () => {\n );\n \n \/\/ No additional warnings should be logged\n- ReactTestUtils.renderIntoDocument();\n+ const container = document.createElement('div');\n+ const root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render();\n+ });\n });\n \n- it('should warn when given a function ref', () => {\n+ it('should warn when given a function ref and ignore them', async () => {\n function Indirection(props) {\n return

{props.children}<\/div>;\n }\n \n+ const ref = jest.fn();\n class ParentUsingFunctionRef extends React.Component {\n render() {\n return (\n \n- {\n- expect(arg).toBe(null);\n- }}\n- \/>\n+ \n <\/Indirection>\n );\n }\n }\n \n- expect(() =>\n- ReactTestUtils.renderIntoDocument(),\n- ).toErrorDev(\n+ await expect(async () => {\n+ const container = document.createElement('div');\n+ const root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render();\n+ });\n+ }).toErrorDev(\n 'Warning: Function components cannot be given refs. ' +\n 'Attempts to access this ref will fail. ' +\n 'Did you mean to use React.forwardRef()?\\n\\n' +\n@@ -259,12 +273,17 @@ describe('ReactFunctionComponent', () => {\n ' in Indirection (at **)\\n' +\n ' in ParentUsingFunctionRef (at **)',\n );\n+ expect(ref).not.toHaveBeenCalled();\n \n \/\/ No additional warnings should be logged\n- ReactTestUtils.renderIntoDocument();\n+ const container = document.createElement('div');\n+ const root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render();\n+ });\n });\n \n- it('deduplicates ref warnings based on element or owner', () => {\n+ it('deduplicates ref warnings based on element or owner', async () => {\n \/\/ When owner uses JSX, we can use exact line location to dedupe warnings\n class AnonymousParentUsingJSX extends React.Component {\n render() {\n@@ -274,15 +293,24 @@ describe('ReactFunctionComponent', () => {\n \n let instance1;\n \n- expect(() => {\n- instance1 = ReactTestUtils.renderIntoDocument(\n- ,\n- );\n+ await expect(async () => {\n+ const container = document.createElement('div');\n+ const root = ReactDOMClient.createRoot(container);\n+\n+ await act(() => {\n+ root.render(\n+ (instance1 = current)} \/>,\n+ );\n+ });\n }).toErrorDev('Warning: Function components cannot be given refs.');\n \/\/ Should be deduped (offending element is on the same line):\n instance1.forceUpdate();\n \/\/ Should also be deduped (offending element is on the same line):\n- ReactTestUtils.renderIntoDocument();\n+ let container = document.createElement('div');\n+ let root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render();\n+ });\n \n \/\/ When owner doesn't use JSX, and is anonymous, we warn once per internal instance.\n class AnonymousParentNotUsingJSX extends React.Component {\n@@ -295,15 +323,23 @@ describe('ReactFunctionComponent', () => {\n }\n \n let instance2;\n- expect(() => {\n- instance2 = ReactTestUtils.renderIntoDocument(\n- ,\n- );\n+ await expect(async () => {\n+ container = document.createElement('div');\n+ root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render(\n+ (instance2 = current)} \/>,\n+ );\n+ });\n }).toErrorDev('Warning: Function components cannot be given refs.');\n \/\/ Should be deduped (same internal instance, no additional warnings)\n instance2.forceUpdate();\n \/\/ Could not be differentiated (since owner is anonymous and no source location)\n- ReactTestUtils.renderIntoDocument();\n+ container = document.createElement('div');\n+ root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render();\n+ });\n \n \/\/ When owner doesn't use JSX, but is named, we warn once per owner name\n class NamedParentNotUsingJSX extends React.Component {\n@@ -315,19 +351,29 @@ describe('ReactFunctionComponent', () => {\n }\n }\n let instance3;\n- expect(() => {\n- instance3 = ReactTestUtils.renderIntoDocument();\n+ await expect(async () => {\n+ container = document.createElement('div');\n+ root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render(\n+ (instance3 = current)} \/>,\n+ );\n+ });\n }).toErrorDev('Warning: Function components cannot be given refs.');\n \/\/ Should be deduped (same owner name, no additional warnings):\n instance3.forceUpdate();\n \/\/ Should also be deduped (same owner name, no additional warnings):\n- ReactTestUtils.renderIntoDocument();\n+ container = document.createElement('div');\n+ root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render();\n+ });\n });\n \n \/\/ This guards against a regression caused by clearing the current debug fiber.\n \/\/ https:\/\/github.com\/facebook\/react\/issues\/10831\n \/\/ @gate !disableLegacyContext || !__DEV__\n- it('should warn when giving a function ref with context', () => {\n+ it('should warn when giving a function ref with context', async () => {\n function Child() {\n return null;\n }\n@@ -349,7 +395,13 @@ describe('ReactFunctionComponent', () => {\n }\n }\n \n- expect(() => ReactTestUtils.renderIntoDocument()).toErrorDev(\n+ await expect(async () => {\n+ const container = document.createElement('div');\n+ const root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render();\n+ });\n+ }).toErrorDev(\n 'Warning: Function components cannot be given refs. ' +\n 'Attempts to access this ref will fail. ' +\n 'Did you mean to use React.forwardRef()?\\n\\n' +\n@@ -360,21 +412,18 @@ describe('ReactFunctionComponent', () => {\n );\n });\n \n- it('should provide a null ref', () => {\n- function Child() {\n- return

;\n- }\n-\n- const comp = ReactTestUtils.renderIntoDocument();\n- expect(comp).toBe(null);\n- });\n-\n- it('should use correct name in key warning', () => {\n+ it('should use correct name in key warning', async () => {\n function Child() {\n return

{[]}<\/div>;\n }\n \n- expect(() => ReactTestUtils.renderIntoDocument()).toErrorDev(\n+ await expect(async () => {\n+ const container = document.createElement('div');\n+ const root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render();\n+ });\n+ }).toErrorDev(\n 'Each child in a list should have a unique \"key\" prop.\\n\\n' +\n 'Check the render method of `Child`.',\n );\n@@ -382,14 +431,21 @@ describe('ReactFunctionComponent', () => {\n \n \/\/ TODO: change this test after we deprecate default props support\n \/\/ for function components\n- it('should support default props and prop types', () => {\n+ it('should support default props and prop types', async () => {\n function Child(props) {\n return

{props.test}<\/div>;\n }\n Child.defaultProps = {test: 2};\n Child.propTypes = {test: PropTypes.string};\n \n- expect(() => ReactTestUtils.renderIntoDocument()).toErrorDev([\n+ await expect(async () => {\n+ const container = document.createElement('div');\n+ const root = ReactDOMClient.createRoot(container);\n+\n+ await act(() => {\n+ root.render();\n+ });\n+ }).toErrorDev([\n 'Warning: Child: Support for defaultProps will be removed from function components in a future major release. Use JavaScript default parameters instead.',\n 'Warning: Failed prop type: Invalid prop `test` of type `number` ' +\n 'supplied to `Child`, expected `string`.\\n' +\n@@ -427,7 +483,7 @@ describe('ReactFunctionComponent', () => {\n expect(el.textContent).toBe('en');\n });\n \n- it('should work with arrow functions', () => {\n+ it('should work with arrow functions', async () => {\n let Child = function () {\n return

;\n };\n@@ -435,20 +491,38 @@ describe('ReactFunctionComponent', () => {\n \/\/ arrow function.\n Child = Child.bind(this);\n \n- expect(() => ReactTestUtils.renderIntoDocument()).not.toThrow();\n+ await expect(async () => {\n+ const container = document.createElement('div');\n+ const root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render();\n+ });\n+ }).not.toThrow();\n });\n \n- it('should allow simple functions to return null', () => {\n+ it('should allow simple functions to return null', async () => {\n const Child = function () {\n return null;\n };\n- expect(() => ReactTestUtils.renderIntoDocument()).not.toThrow();\n+ await expect(async () => {\n+ const container = document.createElement('div');\n+ const root = ReactDOMClient.createRoot(container);\n+ await act(() => {\n+ root.render();\n+ });\n+ }).not.toThrow();\n });\n \n- it('should allow simple functions to return false', () => {\n+ it('should allow simple functions to return false', async () => {\n function Child() {\n return false;\n }\n- expect(() => ReactTestUtils.renderIntoDocument()).not.toThrow();\n+ const container = document.createElement('div');\n+ const root = ReactDOMClient.createRoot(container);\n+ await expect(\n+ act(() => {\n+ root.render();\n+ }),\n+ ).resolves.not.toThrow();\n });\n });\n","files":[{"status":"M","path":"packages\/react-dom\/src\/__tests__\/ReactFunctionComponent-test.js"}],"parents":["b559f5fefed48a7e95afe3bece9e625d4b4b82a2"],"commit":{"shortRevision":"7ab84fb116","authorEmail":"silbermann.sebastian@gmail.com","revision":"7ab84fb1168d14b895fc9569b6b6899a10bfdc78","authoredAt":"2024-02-20T16:50:34+01:00","subject":"Remove usage of ReactTestUtils from ReactFunctionComponent (#28331)","authorName":"Sebastian Silbermann"}}

dillon1000/react

Files changed