Run ReactFabric-test.internal.js in xplat variant (#30101)
The explicit mock override in this test was causing it to always run as native-oss instead of also as xplat. This moves the test to use `// @gate persistent` instead to run it in all persistent configs.
Jan Kassens committed
Jun 26, 2024 at 12:51 UTC
7045700a6db5edaf8427310de09ce0f113e781dc
2 files changed
+105
-145
packages/react-native-renderer/src/__tests__/ReactFabric-test.internal.js
+105
-23
@@ -25,14 +25,13 @@ const SEND_ACCESSIBILITY_EVENT_REQUIRES_HOST_COMPONENT =
25
"sendAccessibilityEvent was called with a ref that isn't a " +
26
'native component. Use React.forwardRef to get access to the underlying native component';
27
28
-jest.mock('shared/ReactFeatureFlags', () =>
29
- require('shared/forks/ReactFeatureFlags.native-oss'),
30
-);
31
-
28
describe('ReactFabric', () => {
29
beforeEach(() => {
30
jest.resetModules();
31
32
+ // TODO: migrate these tests off of the legacy API
33
+ require('shared/ReactFeatureFlags').disableLegacyMode = false;
34
+
35
require('react-native/Libraries/ReactPrivate/InitializeNativeFabricUIManager');
36
37
React = require('react');
@@ -198,9 +197,9 @@ describe('ReactFabric', () => {
197
).toEqual({
198
bar: 'b',
199
});
201
- expect(
202
- nativeFabricUIManager.__dumpHierarchyForJestTestsOnly(),
203
- ).toMatchSnapshot();
200
+ expect(nativeFabricUIManager.__dumpHierarchyForJestTestsOnly()).toBe(`11
201
+ RCTText {"foo":"a","bar":"b"}
202
+ RCTRawText {"text":"1"}`);
203
204
await act(() => {
205
ReactFabric.render(
@@ -220,9 +219,9 @@ describe('ReactFabric', () => {
219
).toEqual({
220
foo: 'b',
221
});
223
- expect(
224
- nativeFabricUIManager.__dumpHierarchyForJestTestsOnly(),
225
- ).toMatchSnapshot();
222
+ expect(nativeFabricUIManager.__dumpHierarchyForJestTestsOnly()).toBe(`11
223
+ RCTText {"foo":"b","bar":"b"}
224
+ RCTRawText {"text":"2"}`);
225
});
226
227
it('should not clone nodes without children when updating props', async () => {
@@ -443,16 +442,54 @@ describe('ReactFabric', () => {
442
await act(() => {
443
ReactFabric.render(<Component chars={before} />, 11);
444
});
446
- expect(
447
- nativeFabricUIManager.__dumpHierarchyForJestTestsOnly(),
448
- ).toMatchSnapshot();
445
+ expect(nativeFabricUIManager.__dumpHierarchyForJestTestsOnly()).toBe(`11
446
+ RCTView null
447
+ RCTView {"title":"a"}
448
+ RCTView {"title":"b"}
449
+ RCTView {"title":"c"}
450
+ RCTView {"title":"d"}
451
+ RCTView {"title":"e"}
452
+ RCTView {"title":"f"}
453
+ RCTView {"title":"g"}
454
+ RCTView {"title":"h"}
455
+ RCTView {"title":"i"}
456
+ RCTView {"title":"j"}
457
+ RCTView {"title":"k"}
458
+ RCTView {"title":"l"}
459
+ RCTView {"title":"m"}
460
+ RCTView {"title":"n"}
461
+ RCTView {"title":"o"}
462
+ RCTView {"title":"p"}
463
+ RCTView {"title":"q"}
464
+ RCTView {"title":"r"}
465
+ RCTView {"title":"s"}
466
+ RCTView {"title":"t"}`);
467
468
await act(() => {
469
ReactFabric.render(<Component chars={after} />, 11);
470
});
453
- expect(
454
- nativeFabricUIManager.__dumpHierarchyForJestTestsOnly(),
455
- ).toMatchSnapshot();
471
+ expect(nativeFabricUIManager.__dumpHierarchyForJestTestsOnly()).toBe(`11
472
+ RCTView null
473
+ RCTView {"title":"m"}
474
+ RCTView {"title":"x"}
475
+ RCTView {"title":"h"}
476
+ RCTView {"title":"p"}
477
+ RCTView {"title":"g"}
478
+ RCTView {"title":"w"}
479
+ RCTView {"title":"f"}
480
+ RCTView {"title":"r"}
481
+ RCTView {"title":"a"}
482
+ RCTView {"title":"l"}
483
+ RCTView {"title":"k"}
484
+ RCTView {"title":"e"}
485
+ RCTView {"title":"o"}
486
+ RCTView {"title":"i"}
487
+ RCTView {"title":"v"}
488
+ RCTView {"title":"c"}
489
+ RCTView {"title":"s"}
490
+ RCTView {"title":"t"}
491
+ RCTView {"title":"z"}
492
+ RCTView {"title":"y"}`);
493
});
494
495
it('recreates host parents even if only children changed', async () => {
@@ -490,18 +527,60 @@ describe('ReactFabric', () => {
527
11,
528
);
529
});
493
- expect(
494
- nativeFabricUIManager.__dumpHierarchyForJestTestsOnly(),
495
- ).toMatchSnapshot();
530
+ expect(nativeFabricUIManager.__dumpHierarchyForJestTestsOnly()).toBe(
531
+ `11
532
+ RCTView null
533
+ RCTView null
534
+ RCTView {"title":"a"}
535
+ RCTView {"title":"b"}
536
+ RCTView {"title":"c"}
537
+ RCTView {"title":"d"}
538
+ RCTView {"title":"e"}
539
+ RCTView {"title":"f"}
540
+ RCTView {"title":"g"}
541
+ RCTView {"title":"h"}
542
+ RCTView {"title":"i"}
543
+ RCTView {"title":"j"}
544
+ RCTView {"title":"k"}
545
+ RCTView {"title":"l"}
546
+ RCTView {"title":"m"}
547
+ RCTView {"title":"n"}
548
+ RCTView {"title":"o"}
549
+ RCTView {"title":"p"}
550
+ RCTView {"title":"q"}
551
+ RCTView {"title":"r"}
552
+ RCTView {"title":"s"}
553
+ RCTView {"title":"t"}`,
554
+ );
555
556
// Call setState() so that we skip over the top-level host node.
557
// It should still get recreated despite a bailout.
558
ref.current.setState({
559
chars: after,
560
});
502
- expect(
503
- nativeFabricUIManager.__dumpHierarchyForJestTestsOnly(),
504
- ).toMatchSnapshot();
561
+ expect(nativeFabricUIManager.__dumpHierarchyForJestTestsOnly()).toBe(`11
562
+ RCTView null
563
+ RCTView null
564
+ RCTView {"title":"m"}
565
+ RCTView {"title":"x"}
566
+ RCTView {"title":"h"}
567
+ RCTView {"title":"p"}
568
+ RCTView {"title":"g"}
569
+ RCTView {"title":"w"}
570
+ RCTView {"title":"f"}
571
+ RCTView {"title":"r"}
572
+ RCTView {"title":"a"}
573
+ RCTView {"title":"l"}
574
+ RCTView {"title":"k"}
575
+ RCTView {"title":"e"}
576
+ RCTView {"title":"o"}
577
+ RCTView {"title":"i"}
578
+ RCTView {"title":"v"}
579
+ RCTView {"title":"c"}
580
+ RCTView {"title":"s"}
581
+ RCTView {"title":"t"}
582
+ RCTView {"title":"z"}
583
+ RCTView {"title":"y"}`);
584
});
585
586
it('calls setState with no arguments', async () => {
@@ -544,7 +623,10 @@ describe('ReactFabric', () => {
623
22,
624
);
625
});
547
- expect(snapshots).toMatchSnapshot();
626
+ expect(snapshots).toEqual([
627
+ `RCTView {"foo":"a"}
628
+ RCTView {"foo":"b"}`,
629
+ ]);
630
});
631
632
it('should not throw when <View> is used inside of a <Text> ancestor', async () => {
packages/react-native-renderer/src/__tests__/__snapshots__/ReactFabric-test.internal.js.snap
deleted
-122
@@ -1,122 +0,0 @@
1
-// Jest Snapshot v1, https://goo.gl/fbAQLP
2
-
3
-exports[`ReactFabric recreates host parents even if only children changed 1`] = `
4
-"11
5
- RCTView null
6
- RCTView null
7
- RCTView {"title":"a"}
8
- RCTView {"title":"b"}
9
- RCTView {"title":"c"}
10
- RCTView {"title":"d"}
11
- RCTView {"title":"e"}
12
- RCTView {"title":"f"}
13
- RCTView {"title":"g"}
14
- RCTView {"title":"h"}
15
- RCTView {"title":"i"}
16
- RCTView {"title":"j"}
17
- RCTView {"title":"k"}
18
- RCTView {"title":"l"}
19
- RCTView {"title":"m"}
20
- RCTView {"title":"n"}
21
- RCTView {"title":"o"}
22
- RCTView {"title":"p"}
23
- RCTView {"title":"q"}
24
- RCTView {"title":"r"}
25
- RCTView {"title":"s"}
26
- RCTView {"title":"t"}"
27
-`;
28
-
29
-exports[`ReactFabric recreates host parents even if only children changed 2`] = `
30
-"11
31
- RCTView null
32
- RCTView null
33
- RCTView {"title":"m"}
34
- RCTView {"title":"x"}
35
- RCTView {"title":"h"}
36
- RCTView {"title":"p"}
37
- RCTView {"title":"g"}
38
- RCTView {"title":"w"}
39
- RCTView {"title":"f"}
40
- RCTView {"title":"r"}
41
- RCTView {"title":"a"}
42
- RCTView {"title":"l"}
43
- RCTView {"title":"k"}
44
- RCTView {"title":"e"}
45
- RCTView {"title":"o"}
46
- RCTView {"title":"i"}
47
- RCTView {"title":"v"}
48
- RCTView {"title":"c"}
49
- RCTView {"title":"s"}
50
- RCTView {"title":"t"}
51
- RCTView {"title":"z"}
52
- RCTView {"title":"y"}"
53
-`;
54
-
55
-exports[`ReactFabric renders and reorders children 1`] = `
56
-"11
57
- RCTView null
58
- RCTView {"title":"a"}
59
- RCTView {"title":"b"}
60
- RCTView {"title":"c"}
61
- RCTView {"title":"d"}
62
- RCTView {"title":"e"}
63
- RCTView {"title":"f"}
64
- RCTView {"title":"g"}
65
- RCTView {"title":"h"}
66
- RCTView {"title":"i"}
67
- RCTView {"title":"j"}
68
- RCTView {"title":"k"}
69
- RCTView {"title":"l"}
70
- RCTView {"title":"m"}
71
- RCTView {"title":"n"}
72
- RCTView {"title":"o"}
73
- RCTView {"title":"p"}
74
- RCTView {"title":"q"}
75
- RCTView {"title":"r"}
76
- RCTView {"title":"s"}
77
- RCTView {"title":"t"}"
78
-`;
79
-
80
-exports[`ReactFabric renders and reorders children 2`] = `
81
-"11
82
- RCTView null
83
- RCTView {"title":"m"}
84
- RCTView {"title":"x"}
85
- RCTView {"title":"h"}
86
- RCTView {"title":"p"}
87
- RCTView {"title":"g"}
88
- RCTView {"title":"w"}
89
- RCTView {"title":"f"}
90
- RCTView {"title":"r"}
91
- RCTView {"title":"a"}
92
- RCTView {"title":"l"}
93
- RCTView {"title":"k"}
94
- RCTView {"title":"e"}
95
- RCTView {"title":"o"}
96
- RCTView {"title":"i"}
97
- RCTView {"title":"v"}
98
- RCTView {"title":"c"}
99
- RCTView {"title":"s"}
100
- RCTView {"title":"t"}
101
- RCTView {"title":"z"}
102
- RCTView {"title":"y"}"
103
-`;
104
-
105
-exports[`ReactFabric should call complete after inserting children 1`] = `
106
-[
107
- "RCTView {"foo":"a"}
108
- RCTView {"foo":"b"}",
109
-]
110
-`;
111
-
112
-exports[`ReactFabric should only pass props diffs to FabricUIManager.cloneNode 1`] = `
113
-"11
114
- RCTText {"foo":"a","bar":"b"}
115
- RCTRawText {"text":"1"}"
116
-`;
117
-
118
-exports[`ReactFabric should only pass props diffs to FabricUIManager.cloneNode 2`] = `
119
-"11
120
- RCTText {"foo":"b","bar":"b"}
121
- RCTRawText {"text":"2"}"
122
-`;