Convert ReactChildren to createRoot (#28191)
Sebastian Silbermann committed
Feb 2, 2024 at 09:15 UTC
457ea7b9d67b7b6ef32021a7a0ab7834d2d9dbbf
1 file changed
+26
-12
packages/react/src/__tests__/ReactChildren-test.js
+26
-12
@@ -11,12 +11,14 @@
11
12
describe('ReactChildren', () => {
13
let React;
14
- let ReactTestUtils;
14
+ let ReactDOMClient;
15
+ let act;
16
17
beforeEach(() => {
18
jest.resetModules();
19
React = require('react');
19
- ReactTestUtils = require('react-dom/test-utils');
20
+ ReactDOMClient = require('react-dom/client');
21
+ act = require('internal-test-utils').act;
22
});
23
24
it('should support identity for simple', () => {
@@ -962,16 +964,20 @@ describe('ReactChildren', () => {
964
});
965
966
describe('with fragments enabled', () => {
965
- it('warns for keys for arrays of elements in a fragment', () => {
967
+ it('warns for keys for arrays of elements in a fragment', async () => {
968
class ComponentReturningArray extends React.Component {
969
render() {
970
return [<div />, <div />];
971
}
972
}
973
972
- expect(() =>
973
- ReactTestUtils.renderIntoDocument(<ComponentReturningArray />),
974
- ).toErrorDev(
974
+ const container = document.createElement('div');
975
+ const root = ReactDOMClient.createRoot(container);
976
+ await expect(async () => {
977
+ await act(() => {
978
+ root.render(<ComponentReturningArray />);
979
+ });
980
+ }).toErrorDev(
981
'Warning: ' +
982
'Each child in a list should have a unique "key" prop.' +
983
' See https://reactjs.org/link/warning-keys for more information.' +
@@ -979,20 +985,28 @@ describe('ReactChildren', () => {
985
);
986
});
987
982
- it('does not warn when there are keys on elements in a fragment', () => {
988
+ it('does not warn when there are keys on elements in a fragment', async () => {
989
class ComponentReturningArray extends React.Component {
990
render() {
991
return [<div key="foo" />, <div key="bar" />];
992
}
993
}
994
989
- ReactTestUtils.renderIntoDocument(<ComponentReturningArray />);
995
+ const container = document.createElement('div');
996
+ const root = ReactDOMClient.createRoot(container);
997
+ await act(() => {
998
+ root.render(<ComponentReturningArray />);
999
+ });
1000
});
1001
992
- it('warns for keys for arrays at the top level', () => {
993
- expect(() =>
994
- ReactTestUtils.renderIntoDocument([<div />, <div />]),
995
- ).toErrorDev(
1002
+ it('warns for keys for arrays at the top level', async () => {
1003
+ const container = document.createElement('div');
1004
+ const root = ReactDOMClient.createRoot(container);
1005
+ await expect(async () => {
1006
+ await act(() => {
1007
+ root.render([<div />, <div />]);
1008
+ });
1009
+ }).toErrorDev(
1010
'Warning: ' +
1011
'Each child in a list should have a unique "key" prop.' +
1012
' See https://reactjs.org/link/warning-keys for more information.',