diff --git a/packages/react-dom/src/client/__tests__/dangerouslySetInnerHTML-test.js b/packages/react-dom/src/client/__tests__/dangerouslySetInnerHTML-test.js index 71f9249a1e823..64b4c0b0f7c98 100644 --- a/packages/react-dom/src/client/__tests__/dangerouslySetInnerHTML-test.js +++ b/packages/react-dom/src/client/__tests__/dangerouslySetInnerHTML-test.js @@ -10,17 +10,21 @@ 'use strict'; const React = require('react'); -const ReactDOM = require('react-dom'); +const ReactDOMClient = require('react-dom/client'); + +const act = require('internal-test-utils').act; describe('dangerouslySetInnerHTML', () => { describe('when the node has innerHTML property', () => { - it('sets innerHTML on it', () => { + it('sets innerHTML on it', async () => { const container = document.createElement('div'); - const node = ReactDOM.render( -
Hello'}} />, - container, - ); - expect(node.innerHTML).toBe('

Hello

'); + const root = ReactDOMClient.createRoot(container); + await act(() => { + root.render( +
Hello'}} />, + ); + }); + expect(container.firstChild.innerHTML).toBe('

Hello

'); }); }); @@ -56,22 +60,22 @@ describe('dangerouslySetInnerHTML', () => { }); // @gate !disableIEWorkarounds - it('sets innerHTML on it', () => { + it('sets innerHTML on it', async () => { const html = ''; const container = document.createElementNS( 'http://www.w3.org/2000/svg', 'svg', ); - ReactDOM.render( - , - container, - ); + const root = ReactDOMClient.createRoot(container); + await act(() => { + root.render(); + }); const circle = container.firstChild.firstChild; expect(circle.tagName).toBe('circle'); }); // @gate !disableIEWorkarounds - it('clears previous children', () => { + it('clears previous children', async () => { const firstHtml = ''; const secondHtml = ''; @@ -79,16 +83,15 @@ describe('dangerouslySetInnerHTML', () => { 'http://www.w3.org/2000/svg', 'svg', ); - ReactDOM.render( - , - container, - ); + const root = ReactDOMClient.createRoot(container); + await act(() => { + root.render(); + }); const rect = container.firstChild.firstChild; expect(rect.tagName).toBe('rect'); - ReactDOM.render( - , - container, - ); + await act(() => { + root.render(); + }); const circle = container.firstChild.firstChild; expect(circle.tagName).toBe('circle'); });