99
1010import type Store from 'react-devtools-shared/src/devtools/store' ;
1111
12+ import { getVersionedRenderImplementation } from './utils' ;
13+
1214describe ( 'ProfilerStore' , ( ) => {
1315 let React ;
1416 let ReactDOM ;
15- let legacyRender ;
1617 let store : Store ;
1718 let utils ;
1819
1920 beforeEach ( ( ) => {
2021 utils = require ( './utils' ) ;
2122 utils . beforeEachProfiling ( ) ;
2223
23- legacyRender = utils . legacyRender ;
24-
2524 store = global . store ;
2625 store . collapseNodesByDefault = false ;
2726 store . recordChangeDescriptions = true ;
@@ -30,6 +29,10 @@ describe('ProfilerStore', () => {
3029 ReactDOM = require ( 'react-dom' ) ;
3130 } ) ;
3231
32+ const { render, unmount} = getVersionedRenderImplementation ( ) ;
33+ const { render : renderOther , unmount : unmountOther } =
34+ getVersionedRenderImplementation ( ) ;
35+
3336 // @reactVersion >= 16.9
3437 it ( 'should not remove profiling data when roots are unmounted' , async ( ) => {
3538 const Parent = ( { count} ) =>
@@ -38,32 +41,27 @@ describe('ProfilerStore', () => {
3841 . map ( ( _ , index ) => < Child key = { index } duration = { index } /> ) ;
3942 const Child = ( ) => < div > Hi!</ div > ;
4043
41- const containerA = document . createElement ( 'div' ) ;
42- const containerB = document . createElement ( 'div' ) ;
43-
4444 utils . act ( ( ) => {
45- legacyRender ( < Parent key = "A" count = { 3 } /> , containerA ) ;
46- legacyRender ( < Parent key = "B" count = { 2 } /> , containerB ) ;
45+ render ( < Parent key = "A" count = { 3 } /> ) ;
46+ renderOther ( < Parent key = "B" count = { 2 } /> ) ;
4747 } ) ;
4848
4949 utils . act ( ( ) => store . profilerStore . startProfiling ( ) ) ;
5050
5151 utils . act ( ( ) => {
52- legacyRender ( < Parent key = "A" count = { 4 } /> , containerA ) ;
53- legacyRender ( < Parent key = "B" count = { 1 } /> , containerB ) ;
52+ render ( < Parent key = "A" count = { 4 } /> ) ;
53+ renderOther ( < Parent key = "B" count = { 1 } /> ) ;
5454 } ) ;
5555
5656 utils . act ( ( ) => store . profilerStore . stopProfiling ( ) ) ;
5757
5858 const rootA = store . roots [ 0 ] ;
5959 const rootB = store . roots [ 1 ] ;
6060
61- utils . act ( ( ) => ReactDOM . unmountComponentAtNode ( containerB ) ) ;
62-
61+ utils . act ( ( ) => unmountOther ( ) ) ;
6362 expect ( store . profilerStore . getDataForRoot ( rootA ) ) . not . toBeNull ( ) ;
6463
65- utils . act ( ( ) => ReactDOM . unmountComponentAtNode ( containerA ) ) ;
66-
64+ utils . act ( ( ) => unmount ( ) ) ;
6765 expect ( store . profilerStore . getDataForRoot ( rootB ) ) . not . toBeNull ( ) ;
6866 } ) ;
6967
@@ -95,14 +93,9 @@ describe('ProfilerStore', () => {
9593 return < input ref = { inputRef } value = { name } onChange = { handleChange } /> ;
9694 } ;
9795
98- const container = document . createElement ( 'div' ) ;
99-
100- // This element has to be in the <body> for the event system to work.
101- document . body . appendChild ( container ) ;
102-
10396 // It's important that this test uses legacy sync mode.
10497 // The root API does not trigger this particular failing case.
105- legacyRender ( < ControlledInput /> , container ) ;
98+ utils . act ( ( ) => render ( < ControlledInput /> ) ) ;
10699
107100 utils . act ( ( ) => store . profilerStore . startProfiling ( ) ) ;
108101
@@ -148,14 +141,9 @@ describe('ProfilerStore', () => {
148141 return < input ref = { inputRef } onBlur = { handleBlur } /> ;
149142 } ;
150143
151- const container = document . createElement ( 'div' ) ;
152-
153- // This element has to be in the <body> for the event system to work.
154- document . body . appendChild ( container ) ;
155-
156144 // It's important that this test uses legacy sync mode.
157145 // The root API does not trigger this particular failing case.
158- legacyRender ( < Example /> , container ) ;
146+ utils . act ( ( ) => render ( < Example /> ) ) ;
159147
160148 expect ( commitCount ) . toBe ( 1 ) ;
161149 commitCount = 0 ;
@@ -164,10 +152,10 @@ describe('ProfilerStore', () => {
164152
165153 // Focus and blur.
166154 const target = inputRef . current ;
167- target . focus ( ) ;
168- target . blur ( ) ;
169- target . focus ( ) ;
170- target . blur ( ) ;
155+ utils . act ( ( ) => target . focus ( ) ) ;
156+ utils . act ( ( ) => target . blur ( ) ) ;
157+ utils . act ( ( ) => target . focus ( ) ) ;
158+ utils . act ( ( ) => target . blur ( ) ) ;
171159 expect ( commitCount ) . toBe ( 1 ) ;
172160
173161 utils . act ( ( ) => store . profilerStore . stopProfiling ( ) ) ;
@@ -204,14 +192,9 @@ describe('ProfilerStore', () => {
204192 return state . hasOwnProperty ;
205193 } ;
206194
207- const container = document . createElement ( 'div' ) ;
208-
209- // This element has to be in the <body> for the event system to work.
210- document . body . appendChild ( container ) ;
211-
212195 // It's important that this test uses legacy sync mode.
213196 // The root API does not trigger this particular failing case.
214- legacyRender ( < ControlledInput /> , container ) ;
197+ utils . act ( ( ) => render ( < ControlledInput /> ) ) ;
215198
216199 utils . act ( ( ) => store . profilerStore . startProfiling ( ) ) ;
217200 utils . act ( ( ) =>
@@ -243,9 +226,7 @@ describe('ProfilerStore', () => {
243226 ) ;
244227 } ;
245228
246- const container = document . createElement ( 'div' ) ;
247-
248- utils . act ( ( ) => legacyRender ( < App /> , container ) ) ;
229+ utils . act ( ( ) => render ( < App /> ) ) ;
249230 utils . act ( ( ) => store . profilerStore . startProfiling ( ) ) ;
250231 } ) ;
251232} ) ;
0 commit comments