chore: use versioned render in profilingHostRoot test and gate some f…

…or legacy rendering (facebook#28237)

packages/react-devtools-shared/src/__tests__/profilingHostRoot-test.js

@@ -7,11 +7,14 @@
  * @flow
  */
 
+import {
+  getLegacyRenderImplementation,
+  getModernRenderImplementation,
+} from './utils';
+
 describe('profiling HostRoot', () => {
   let React;
-  let ReactDOMClient;
   let Scheduler;
-  let legacyRender;
   let store;
   let utils;
   let getEffectDurations;
@@ -22,14 +25,11 @@ describe('profiling HostRoot', () => {
     utils = require('./utils');
     utils.beforeEachProfiling();
 
-    legacyRender = utils.legacyRender;
-
     getEffectDurations = require('../backend/utils').getEffectDurations;
 
     store = global.store;
 
     React = require('react');
-    ReactDOMClient = require('react-dom/client');
     Scheduler = require('scheduler');
 
     effectDurations = [];
@@ -49,7 +49,11 @@ describe('profiling HostRoot', () => {
     };
   });
 
-  // @reactVersion >=18.0
+  const {render: legacyRender} = getLegacyRenderImplementation();
+  const {render: modernRender} = getModernRenderImplementation();
+
+  // @reactVersion >= 18.0
+  // @reactVersion <= 18.2
   it('should expose passive and layout effect durations for render()', () => {
     function App() {
       React.useEffect(() => {
@@ -63,8 +67,7 @@ describe('profiling HostRoot', () => {
 
     utils.act(() => store.profilerStore.startProfiling());
     utils.act(() => {
-      const container = document.createElement('div');
-      legacyRender(<App />, container);
+      legacyRender(<App />);
     });
     utils.act(() => store.profilerStore.stopProfiling());
 
@@ -92,9 +95,7 @@ describe('profiling HostRoot', () => {
 
     utils.act(() => store.profilerStore.startProfiling());
     utils.act(() => {
-      const container = document.createElement('div');
-      const root = ReactDOMClient.createRoot(container);
-      root.render(<App />);
+      modernRender(<App />);
     });
     utils.act(() => store.profilerStore.stopProfiling());
 
@@ -126,12 +127,9 @@ describe('profiling HostRoot', () => {
       return null;
     }
 
-    const container = document.createElement('div');
-    const root = ReactDOMClient.createRoot(container);
-
     utils.act(() => store.profilerStore.startProfiling());
-    utils.act(() => root.render(<App />));
-    utils.act(() => root.render(<App shouldCascade={true} />));
+    utils.act(() => modernRender(<App />));
+    utils.act(() => modernRender(<App shouldCascade={true} />));
     utils.act(() => store.profilerStore.stopProfiling());
 
     expect(effectDurations).toHaveLength(3);