Skip to content

Commit 4dd475c

Browse files
authored
convert ReactElement-test from renderIntoDocument (#28161)
## Summary refactors ReactElement-test to use `createRoot` instead of `renderIntoDocument`, which uses `ReactDOM.render` under the hood ## How did you test this change? `yarn test ReactElement`
1 parent 94259cd commit 4dd475c

File tree

1 file changed

+29
-17
lines changed

1 file changed

+29
-17
lines changed

packages/react/src/__tests__/ReactElement-test.js

Lines changed: 29 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,6 @@ let act;
1313

1414
let React;
1515
let ReactDOMClient;
16-
let ReactTestUtils;
1716

1817
describe('ReactElement', () => {
1918
let ComponentClass;
@@ -25,7 +24,6 @@ describe('ReactElement', () => {
2524

2625
React = require('react');
2726
ReactDOMClient = require('react-dom/client');
28-
ReactTestUtils = require('react-dom/test-utils');
2927
// NOTE: We're explicitly not using JSX here. This is intended to test
3028
// classic JS without JSX.
3129
ComponentClass = class extends React.Component {
@@ -223,19 +221,21 @@ describe('ReactElement', () => {
223221
expect(element.props).toEqual({foo: '56'});
224222
});
225223

226-
it('preserves the owner on the element', () => {
224+
it('preserves the owner on the element', async () => {
227225
let element;
226+
let instance;
228227

229228
class Wrapper extends React.Component {
229+
componentDidMount() {
230+
instance = this;
231+
}
230232
render() {
231233
element = React.createElement(ComponentClass);
232234
return element;
233235
}
234236
}
235-
236-
const instance = ReactTestUtils.renderIntoDocument(
237-
React.createElement(Wrapper),
238-
);
237+
const root = ReactDOMClient.createRoot(document.createElement('div'));
238+
await act(() => root.render(React.createElement(Wrapper)));
239239
expect(element._owner.stateNode).toBe(instance);
240240
});
241241

@@ -327,23 +327,28 @@ describe('ReactElement', () => {
327327

328328
// NOTE: We're explicitly not using JSX here. This is intended to test
329329
// classic JS without JSX.
330-
it('should normalize props with default values', () => {
330+
it('should normalize props with default values', async () => {
331+
let instance;
331332
class Component extends React.Component {
333+
componentDidMount() {
334+
instance = this;
335+
}
332336
render() {
333337
return React.createElement('span', null, this.props.prop);
334338
}
335339
}
336340
Component.defaultProps = {prop: 'testKey'};
337341

338-
const instance = ReactTestUtils.renderIntoDocument(
339-
React.createElement(Component),
340-
);
342+
const root = ReactDOMClient.createRoot(document.createElement('div'));
343+
await act(() => {
344+
root.render(React.createElement(Component));
345+
});
341346
expect(instance.props.prop).toBe('testKey');
342347

343-
const inst2 = ReactTestUtils.renderIntoDocument(
344-
React.createElement(Component, {prop: null}),
345-
);
346-
expect(inst2.props.prop).toBe(null);
348+
await act(() => {
349+
root.render(React.createElement(Component, {prop: null}));
350+
});
351+
expect(instance.props.prop).toBe(null);
347352
});
348353

349354
it('throws when changing a prop (in dev) after element creation', async () => {
@@ -410,13 +415,20 @@ describe('ReactElement', () => {
410415
}
411416
});
412417

413-
it('does not warn for NaN props', () => {
418+
it('does not warn for NaN props', async () => {
419+
let test;
414420
class Test extends React.Component {
421+
componentDidMount() {
422+
test = this;
423+
}
415424
render() {
416425
return <div />;
417426
}
418427
}
419-
const test = ReactTestUtils.renderIntoDocument(<Test value={+undefined} />);
428+
const root = ReactDOMClient.createRoot(document.createElement('div'));
429+
await act(() => {
430+
root.render(<Test value={+undefined} />);
431+
});
420432
expect(test.props.value).toBeNaN();
421433
});
422434
});

0 commit comments

Comments
 (0)