diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationAttributes-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationAttributes-test.js index 31e4e94ac8c4a..7d1a94f578e1a 100644 --- a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationAttributes-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationAttributes-test.js @@ -15,6 +15,7 @@ const ReactFeatureFlags = require('shared/ReactFeatureFlags'); let React; let ReactDOM; +let ReactDOMClient; let ReactTestUtils; let ReactDOMServer; @@ -23,12 +24,13 @@ function initModules() { jest.resetModules(); React = require('react'); ReactDOM = require('react-dom'); + ReactDOMClient = require('react-dom/client'); ReactDOMServer = require('react-dom/server'); ReactTestUtils = require('react-dom/test-utils'); // Make them available to the helpers. return { - ReactDOM, + ReactDOMClient, ReactDOMServer, ReactTestUtils, }; @@ -606,7 +608,12 @@ describe('ReactDOMServerIntegration', () => { // DOM nodes on the client side. We force it to fire early // so that it gets deduplicated later, and doesn't fail the test. expect(() => { - ReactDOM.render(, document.createElement('div')); + ReactDOM.flushSync(() => { + const root = ReactDOMClient.createRoot( + document.createElement('div'), + ); + root.render(); + }); }).toErrorDev('The tag is unrecognized in this browser.'); const e = await render(); diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationUntrustedURL-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationUntrustedURL-test.js index ef232d76610cd..d682b0fe758e1 100644 --- a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationUntrustedURL-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationUntrustedURL-test.js @@ -16,6 +16,7 @@ const ReactDOMServerIntegrationUtils = require('./utils/ReactDOMServerIntegratio let React; let ReactDOM; +let ReactDOMClient; let ReactDOMServer; let ReactTestUtils; @@ -34,12 +35,13 @@ describe('ReactDOMServerIntegration - Untrusted URLs', () => { jest.resetModules(); React = require('react'); ReactDOM = require('react-dom'); + ReactDOMClient = require('react-dom/client'); ReactDOMServer = require('react-dom/server'); ReactTestUtils = require('react-dom/test-utils'); // Make them available to the helpers. return { - ReactDOM, + ReactDOMClient, ReactDOMServer, ReactTestUtils, }; @@ -169,9 +171,14 @@ describe('ReactDOMServerIntegration - Untrusted URLs', () => { it('rejects a javascript protocol href if it is added during an update', () => { const container = document.createElement('div'); - ReactDOM.render(click me, container); + const root = ReactDOMClient.createRoot(container); + ReactDOM.flushSync(() => { + root.render(click me); + }); expect(() => { - ReactDOM.render(click me, container); + ReactDOM.flushSync(() => { + root.render(click me); + }); }).toErrorDev( 'Warning: A future version of React will block javascript: URLs as a security precaution. ' + 'Use event handlers instead if you can. If you need to generate unsafe HTML try using ' + @@ -196,12 +203,13 @@ describe('ReactDOMServerIntegration - Untrusted URLs - disableJavaScriptURLs', ( React = require('react'); ReactDOM = require('react-dom'); + ReactDOMClient = require('react-dom/client'); ReactDOMServer = require('react-dom/server'); ReactTestUtils = require('react-dom/test-utils'); // Make them available to the helpers. return { - ReactDOM, + ReactDOMClient, ReactDOMServer, ReactTestUtils, }; @@ -327,9 +335,14 @@ describe('ReactDOMServerIntegration - Untrusted URLs - disableJavaScriptURLs', ( it('rejects a javascript protocol href if it is added during an update', () => { const container = document.createElement('div'); - ReactDOM.render(click me, container); + const root = ReactDOMClient.createRoot(container); + ReactDOM.flushSync(() => { + root.render(click me); + }); expect(container.firstChild.href).toBe('http://thisisfine/'); - ReactDOM.render(click me, container); + ReactDOM.flushSync(() => { + root.render(click me); + }); expect(container.firstChild.href).toBe(EXPECTED_SAFE_URL); }); @@ -371,13 +384,20 @@ describe('ReactDOMServerIntegration - Untrusted URLs - disableJavaScriptURLs', ( it('rejects a javascript protocol href if it is added during an update twice', () => { const container = document.createElement('div'); - ReactDOM.render(click me, container); + const root = ReactDOMClient.createRoot(container); + ReactDOM.flushSync(() => { + root.render(click me); + }); expect(container.firstChild.href).toBe('http://thisisfine/'); - ReactDOM.render(click me, container); + ReactDOM.flushSync(() => { + root.render(click me); + }); expect(container.firstChild.href).toBe(EXPECTED_SAFE_URL); // The second update ensures that a global flag hasn't been added to the regex // which would fail to match the second time it is called. - ReactDOM.render(click me, container); + ReactDOM.flushSync(() => { + root.render(click me); + }); expect(container.firstChild.href).toBe(EXPECTED_SAFE_URL); }); });