chore: use versioned render in useEditableValue test

Author: hoxyq

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

@@ -7,22 +7,24 @@
  * @flow
  */
 
+import {getVersionedRenderImplementation} from './utils';
+
 describe('useEditableValue', () => {
   let act;
   let React;
-  let legacyRender;
   let useEditableValue;
 
   beforeEach(() => {
     const utils = require('./utils');
     act = utils.act;
-    legacyRender = utils.legacyRender;
 
     React = require('react');
 
     useEditableValue = require('../devtools/views/hooks').useEditableValue;
   });
 
+  const {render} = getVersionedRenderImplementation();
+
   it('should not cause a loop with values like NaN', () => {
     let state;
 
@@ -32,8 +34,8 @@ describe('useEditableValue', () => {
       return null;
     }
 
-    const container = document.createElement('div');
-    legacyRender(<Example />, container);
+    act(() => render(<Example />));
+
     expect(state.editableValue).toEqual('NaN');
     expect(state.externalValue).toEqual(NaN);
     expect(state.parsedValue).toEqual(NaN);
@@ -50,8 +52,8 @@ describe('useEditableValue', () => {
       return null;
     }
 
-    const container = document.createElement('div');
-    legacyRender(<Example value={1} />, container);
+    act(() => render(<Example value={1} />));
+
     expect(state.editableValue).toEqual('1');
     expect(state.externalValue).toEqual(1);
     expect(state.parsedValue).toEqual(1);
@@ -60,7 +62,8 @@ describe('useEditableValue', () => {
 
     // If there are NO pending changes,
     // an update to the external prop value should override the local/pending value.
-    legacyRender(<Example value={2} />, container);
+    act(() => render(<Example value={2} />));
+
     expect(state.editableValue).toEqual('2');
     expect(state.externalValue).toEqual(2);
     expect(state.parsedValue).toEqual(2);
@@ -78,8 +81,8 @@ describe('useEditableValue', () => {
       return null;
     }
 
-    const container = document.createElement('div');
-    legacyRender(<Example value={1} />, container);
+    act(() => render(<Example value={1} />));
+
     expect(state.editableValue).toEqual('1');
     expect(state.externalValue).toEqual(1);
     expect(state.parsedValue).toEqual(1);
@@ -102,7 +105,8 @@ describe('useEditableValue', () => {
 
     // If there ARE pending changes,
     // an update to the external prop value should NOT override the local/pending value.
-    legacyRender(<Example value={3} />, container);
+    act(() => render(<Example value={3} />));
+
     expect(state.editableValue).toEqual('2');
     expect(state.externalValue).toEqual(3);
     expect(state.parsedValue).toEqual(2);
@@ -120,8 +124,8 @@ describe('useEditableValue', () => {
       return null;
     }
 
-    const container = document.createElement('div');
-    legacyRender(<Example value={1} />, container);
+    act(() => render(<Example value={1} />));
+
     expect(state.editableValue).toEqual('1');
     expect(state.externalValue).toEqual(1);
     expect(state.parsedValue).toEqual(1);
@@ -153,8 +157,8 @@ describe('useEditableValue', () => {
       return null;
     }
 
-    const container = document.createElement('div');
-    legacyRender(<Example value={1} />, container);
+    act(() => render(<Example value={1} />));
+
     expect(state.editableValue).toEqual('1');
     expect(state.externalValue).toEqual(1);
     expect(state.parsedValue).toEqual(1);