From 90de7ff80aadea7dc850d459998b83e666d3cac6 Mon Sep 17 00:00:00 2001 From: Jan Kassens Date: Wed, 26 Jun 2024 12:52:38 -0400 Subject: [PATCH] Update ReactFabric-test.internal to concurrent root --- .../__tests__/ReactFabric-test.internal.js | 130 ++++++++++++++---- 1 file changed, 103 insertions(+), 27 deletions(-) diff --git a/packages/react-native-renderer/src/__tests__/ReactFabric-test.internal.js b/packages/react-native-renderer/src/__tests__/ReactFabric-test.internal.js index 8639e77f43772..99d21ea933ecd 100644 --- a/packages/react-native-renderer/src/__tests__/ReactFabric-test.internal.js +++ b/packages/react-native-renderer/src/__tests__/ReactFabric-test.internal.js @@ -29,9 +29,6 @@ describe('ReactFabric', () => { beforeEach(() => { jest.resetModules(); - // TODO: migrate these tests off of the legacy API - require('shared/ReactFeatureFlags').disableLegacyMode = false; - require('react-native/Libraries/ReactPrivate/InitializeNativeFabricUIManager'); React = require('react'); @@ -51,7 +48,7 @@ describe('ReactFabric', () => { })); await act(() => { - ReactFabric.render(, 1); + ReactFabric.render(, 1, null, true); }); expect(nativeFabricUIManager.createNode).toBeCalled(); expect(nativeFabricUIManager.appendChild).not.toBeCalled(); @@ -69,13 +66,13 @@ describe('ReactFabric', () => { nativeFabricUIManager.createNode.mockReturnValue(firstNode); await act(() => { - ReactFabric.render(, 11); + ReactFabric.render(, 11, null, true); }); expect(nativeFabricUIManager.createNode).toHaveBeenCalledTimes(1); await act(() => { - ReactFabric.render(, 11); + ReactFabric.render(, 11, null, true); }); expect(nativeFabricUIManager.createNode).toHaveBeenCalledTimes(1); @@ -99,7 +96,7 @@ describe('ReactFabric', () => { })); await act(() => { - ReactFabric.render(1, 11); + ReactFabric.render(1, 11, null, true); }); expect(nativeFabricUIManager.cloneNode).not.toBeCalled(); expect(nativeFabricUIManager.cloneNodeWithNewChildren).not.toBeCalled(); @@ -110,7 +107,7 @@ describe('ReactFabric', () => { // If no properties have changed, we shouldn't call cloneNode. await act(() => { - ReactFabric.render(1, 11); + ReactFabric.render(1, 11, null, true); }); expect(nativeFabricUIManager.cloneNode).not.toBeCalled(); expect(nativeFabricUIManager.cloneNodeWithNewChildren).not.toBeCalled(); @@ -121,7 +118,7 @@ describe('ReactFabric', () => { // Only call cloneNode for the changed property (and not for text). await act(() => { - ReactFabric.render(1, 11); + ReactFabric.render(1, 11, null, true); }); expect(nativeFabricUIManager.cloneNode).not.toBeCalled(); expect(nativeFabricUIManager.cloneNodeWithNewChildren).not.toBeCalled(); @@ -134,7 +131,7 @@ describe('ReactFabric', () => { // Only call cloneNode for the changed text (and no other properties). await act(() => { - ReactFabric.render(2, 11); + ReactFabric.render(2, 11, null, true); }); expect(nativeFabricUIManager.cloneNode).not.toBeCalled(); expect( @@ -149,7 +146,7 @@ describe('ReactFabric', () => { // Call cloneNode for both changed text and properties. await act(() => { - ReactFabric.render(3, 11); + ReactFabric.render(3, 11, null, true); }); expect(nativeFabricUIManager.cloneNode).not.toBeCalled(); expect( @@ -175,6 +172,8 @@ describe('ReactFabric', () => { 1 , 11, + null, + true, ); }); expect(nativeFabricUIManager.cloneNode).not.toBeCalled(); @@ -190,6 +189,8 @@ describe('ReactFabric', () => { 1 , 11, + null, + true, ); }); expect( @@ -207,6 +208,8 @@ describe('ReactFabric', () => { 2 , 11, + null, + true, ); }); const argIndex = gate(flags => flags.passChildrenWhenCloningPersistedNodes) @@ -236,11 +239,15 @@ describe('ReactFabric', () => { ); - await act(() => ReactFabric.render(, 11)); + await act(() => + ReactFabric.render(, 11, null, true), + ); expect(nativeFabricUIManager.completeRoot).toBeCalled(); jest.clearAllMocks(); - await act(() => ReactFabric.render(, 11)); + await act(() => + ReactFabric.render(, 11, null, true), + ); expect(nativeFabricUIManager.cloneNode).not.toBeCalled(); expect(nativeFabricUIManager.cloneNodeWithNewProps).toHaveBeenCalledTimes( 1, @@ -289,6 +296,8 @@ describe('ReactFabric', () => { }} />, 11, + null, + true, ); }); @@ -320,6 +329,8 @@ describe('ReactFabric', () => { }} />, 11, + null, + true, ); }); @@ -350,6 +361,8 @@ describe('ReactFabric', () => { }} />, 11, + null, + true, ); }); @@ -382,6 +395,8 @@ describe('ReactFabric', () => { }} />, 11, + null, + true, ); }); @@ -395,7 +410,33 @@ describe('ReactFabric', () => { expect(nativeFabricUIManager.sendAccessibilityEvent).not.toBeCalled(); }); - it('returns the correct instance and calls it in the callback', () => { + it('calls the callback with the correct instance and returns null', async () => { + const View = createReactNativeComponentClass('RCTView', () => ({ + validAttributes: {foo: true}, + uiViewClassName: 'RCTView', + })); + + let a; + let b; + let c; + await act(() => { + c = ReactFabric.render( + (a = v)} />, + 11, + function () { + b = this; + }, + true, + ); + }); + + expect(a).toBeTruthy(); + expect(a).toBe(b); + expect(c).toBe(null); + }); + + // @gate !disableLegacyMode + it('returns the instance in legacy mode and calls the callback with it', () => { const View = createReactNativeComponentClass('RCTView', () => ({ validAttributes: {foo: true}, uiViewClassName: 'RCTView', @@ -404,7 +445,12 @@ describe('ReactFabric', () => { let a; let b; const c = ReactFabric.render( - (a = v)} />, + { + a = v; + }} + />, 11, function () { b = this; @@ -440,7 +486,7 @@ describe('ReactFabric', () => { const after = 'mxhpgwfralkeoivcstzy'; await act(() => { - ReactFabric.render(, 11); + ReactFabric.render(, 11, null, true); }); expect(nativeFabricUIManager.__dumpHierarchyForJestTestsOnly()).toBe(`11 RCTView null @@ -466,7 +512,7 @@ describe('ReactFabric', () => { RCTView {"title":"t"}`); await act(() => { - ReactFabric.render(, 11); + ReactFabric.render(, 11, null, true); }); expect(nativeFabricUIManager.__dumpHierarchyForJestTestsOnly()).toBe(`11 RCTView null @@ -525,6 +571,8 @@ describe('ReactFabric', () => { , 11, + null, + true, ); }); expect(nativeFabricUIManager.__dumpHierarchyForJestTestsOnly()).toBe( @@ -555,8 +603,10 @@ describe('ReactFabric', () => { // Call setState() so that we skip over the top-level host node. // It should still get recreated despite a bailout. - ref.current.setState({ - chars: after, + await act(() => { + ref.current.setState({ + chars: after, + }); }); expect(nativeFabricUIManager.__dumpHierarchyForJestTestsOnly()).toBe(`11 RCTView null @@ -595,7 +645,7 @@ describe('ReactFabric', () => { } await act(() => { - ReactFabric.render(, 11); + ReactFabric.render(, 11, null, true); }); expect(mockArgs.length).toEqual(0); }); @@ -621,6 +671,8 @@ describe('ReactFabric', () => { , 22, + null, + true, ); }); expect(snapshots).toEqual([ @@ -649,6 +701,8 @@ describe('ReactFabric', () => { , 11, + null, + true, ); }); @@ -658,6 +712,8 @@ describe('ReactFabric', () => { , 11, + null, + true, ); }); }); @@ -678,7 +734,7 @@ describe('ReactFabric', () => { await expect(async () => { await act(() => { - ReactFabric.render(this should warn, 11); + ReactFabric.render(this should warn, 11, null, true); }); }).toErrorDev(['Text strings must be rendered within a component.']); @@ -689,6 +745,8 @@ describe('ReactFabric', () => { hi hello hi , 11, + null, + true, ); }); }).toErrorDev(['Text strings must be rendered within a component.']); @@ -708,6 +766,8 @@ describe('ReactFabric', () => { , 11, + null, + true, ); }); }); @@ -727,7 +787,7 @@ describe('ReactFabric', () => { const touchStart2 = jest.fn(); await act(() => { - ReactFabric.render(, 11); + ReactFabric.render(, 11, null, true); }); expect(nativeFabricUIManager.createNode.mock.calls.length).toBe(1); @@ -753,7 +813,7 @@ describe('ReactFabric', () => { expect(touchStart2).not.toBeCalled(); await act(() => { - ReactFabric.render(, 11); + ReactFabric.render(, 11, null, true); }); // Intentionally dispatch to the same instanceHandle again. @@ -819,6 +879,8 @@ describe('ReactFabric', () => { /> , 11, + null, + true, ); }); @@ -914,6 +976,8 @@ describe('ReactFabric', () => { /> , 1, + null, + true, ); }); @@ -973,6 +1037,8 @@ describe('ReactFabric', () => { ReactFabric.render( (parent = n)} />, 11, + null, + true, ); }); @@ -1012,6 +1078,8 @@ describe('ReactFabric', () => { (parent = n)} /> , 11, + null, + true, ); }); @@ -1053,6 +1121,8 @@ describe('ReactFabric', () => { ReactFabric.render( (parent = n)} />, 11, + null, + true, ); }); @@ -1092,6 +1162,8 @@ describe('ReactFabric', () => { (parent = n)} /> , 11, + null, + true, ); }); @@ -1127,6 +1199,8 @@ describe('ReactFabric', () => { }} />, 11, + null, + true, ); }); const dangerouslyRetainedViewRef = viewRef; @@ -1149,7 +1223,7 @@ describe('ReactFabric', () => { })); await act(() => { - ReactFabric.render(, 1); + ReactFabric.render(, 1, null, true); }); const internalInstanceHandle = @@ -1182,6 +1256,8 @@ describe('ReactFabric', () => { }} />, 1, + null, + true, ); }); @@ -1196,7 +1272,7 @@ describe('ReactFabric', () => { expect(publicInstance).toBe(viewRef); await act(() => { - ReactFabric.render(null, 1); + ReactFabric.render(null, 1, null, true); }); const publicInstanceAfterUnmount = @@ -1215,7 +1291,7 @@ describe('ReactFabric', () => { })); await act(() => { - ReactFabric.render(Text content, 1); + ReactFabric.render(Text content, 1, null, true); }); // Access the internal instance handle used to create the text node. @@ -1247,7 +1323,7 @@ describe('ReactFabric', () => { expect(publicInstance).toBe(expectedPublicInstance); await act(() => { - ReactFabric.render(null, 1); + ReactFabric.render(null, 1, null, true); }); const publicInstanceAfterUnmount =