From d7fdb346325292c4c3cc64d3d5dd95a0b43e7cd6 Mon Sep 17 00:00:00 2001
From: Ricky Hanlon <rickhanlonii@gmail.com>
Date: Fri, 2 Feb 2024 12:33:02 -0500
Subject: [PATCH] Convert ReactJSXElementValidator to createRoot

---
 .../__tests__/ReactJSXElementValidator-test.js    | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/packages/react/src/__tests__/ReactJSXElementValidator-test.js b/packages/react/src/__tests__/ReactJSXElementValidator-test.js
index 71753ed0ace20..62d29ee68fefb 100644
--- a/packages/react/src/__tests__/ReactJSXElementValidator-test.js
+++ b/packages/react/src/__tests__/ReactJSXElementValidator-test.js
@@ -13,8 +13,10 @@
 // of dynamic errors when using JSX with Flow.
 let React;
 let ReactDOM;
+let ReactDOMClient;
 let ReactTestUtils;
 let PropTypes;
+let act;
 
 describe('ReactJSXElementValidator', () => {
   let Component;
@@ -26,7 +28,9 @@ describe('ReactJSXElementValidator', () => {
     PropTypes = require('prop-types');
     React = require('react');
     ReactDOM = require('react-dom');
+    ReactDOMClient = require('react-dom/client');
     ReactTestUtils = require('react-dom/test-utils');
+    act = require('internal-test-utils').act;
 
     Component = class extends React.Component {
       render() {
@@ -172,7 +176,7 @@ describe('ReactJSXElementValidator', () => {
     );
   });
 
-  it('should update component stack after receiving next element', () => {
+  it('should update component stack after receiving next element', async () => {
     function MyComp() {
       return null;
     }
@@ -192,9 +196,14 @@ describe('ReactJSXElementValidator', () => {
     }
 
     const container = document.createElement('div');
-    ReactDOM.render(<ParentComp warn={false} />, container);
+    const root = ReactDOMClient.createRoot(container);
+    await act(() => {
+      root.render(<ParentComp warn={false} />);
+    });
     expect(() =>
-      ReactDOM.render(<ParentComp warn={true} />, container),
+      ReactDOM.flushSync(() => {
+        root.render(<ParentComp warn={true} />);
+      }),
     ).toErrorDev(
       'Warning: Failed prop type: ' +
         'Invalid prop `color` of type `number` supplied to `MyComp`, ' +