13
13
// of dynamic errors when using JSX with Flow.
14
14
let React ;
15
15
let ReactDOM ;
16
+ let ReactDOMClient ;
16
17
let ReactTestUtils ;
17
18
let PropTypes ;
19
+ let act ;
18
20
19
21
describe ( 'ReactJSXElementValidator' , ( ) => {
20
22
let Component ;
@@ -26,7 +28,9 @@ describe('ReactJSXElementValidator', () => {
26
28
PropTypes = require ( 'prop-types' ) ;
27
29
React = require ( 'react' ) ;
28
30
ReactDOM = require ( 'react-dom' ) ;
31
+ ReactDOMClient = require ( 'react-dom/client' ) ;
29
32
ReactTestUtils = require ( 'react-dom/test-utils' ) ;
33
+ act = require ( 'internal-test-utils' ) . act ;
30
34
31
35
Component = class extends React . Component {
32
36
render ( ) {
@@ -172,7 +176,7 @@ describe('ReactJSXElementValidator', () => {
172
176
) ;
173
177
} ) ;
174
178
175
- it ( 'should update component stack after receiving next element' , ( ) => {
179
+ it ( 'should update component stack after receiving next element' , async ( ) => {
176
180
function MyComp ( ) {
177
181
return null ;
178
182
}
@@ -192,9 +196,14 @@ describe('ReactJSXElementValidator', () => {
192
196
}
193
197
194
198
const container = document . createElement ( 'div' ) ;
195
- ReactDOM . render ( < ParentComp warn = { false } /> , container ) ;
199
+ const root = ReactDOMClient . createRoot ( container ) ;
200
+ await act ( ( ) => {
201
+ root . render ( < ParentComp warn = { false } /> ) ;
202
+ } ) ;
196
203
expect ( ( ) =>
197
- ReactDOM . render ( < ParentComp warn = { true } /> , container ) ,
204
+ ReactDOM . flushSync ( ( ) => {
205
+ root . render ( < ParentComp warn = { true } /> ) ;
206
+ } ) ,
198
207
) . toErrorDev (
199
208
'Warning: Failed prop type: ' +
200
209
'Invalid prop `color` of type `number` supplied to `MyComp`, ' +
0 commit comments