[act] Wrap IsThisRendererActing in DEV check (#16259)
* [act] Wrap IsThisRendererActing in DEV check So that it doesn't leak into the production bundle. Follow-up to #16240. * Disable Suspense fallback test in prod
Andrew Clark committed
Jul 30, 2019 at 17:39 UTC
f939df402c074227014a85256cfe7c80ac30a0bc
2 files changed
+74
-56
packages/react-dom/src/__tests__/ReactTestUtilsAct-test.js
+59
-53
@@ -722,68 +722,74 @@ function runActTests(label, render, unmount, rerender) {
722
});
723
724
describe('suspense', () => {
725
- it('triggers fallbacks if available', async () => {
726
- let resolved = false;
727
- let resolve;
728
- const promise = new Promise(_resolve => {
729
- resolve = _resolve;
730
- });
725
+ if (__DEV__) {
726
+ it('triggers fallbacks if available', async () => {
727
+ let resolved = false;
728
+ let resolve;
729
+ const promise = new Promise(_resolve => {
730
+ resolve = _resolve;
731
+ });
732
732
- function Suspends() {
733
- if (resolved) {
734
- return 'was suspended';
733
+ function Suspends() {
734
+ if (resolved) {
735
+ return 'was suspended';
736
+ }
737
+ throw promise;
738
}
736
- throw promise;
737
- }
739
739
- function App(props) {
740
- return (
741
- <React.Suspense
742
- fallback={<span data-test-id="spinner">loading...</span>}>
743
- {props.suspend ? <Suspends /> : 'content'}
744
- </React.Suspense>
745
- );
746
- }
740
+ function App(props) {
741
+ return (
742
+ <React.Suspense
743
+ fallback={<span data-test-id="spinner">loading...</span>}>
744
+ {props.suspend ? <Suspends /> : 'content'}
745
+ </React.Suspense>
746
+ );
747
+ }
748
748
- // render something so there's content
749
- act(() => {
750
- render(<App suspend={false} />, container);
751
- });
749
+ // render something so there's content
750
+ act(() => {
751
+ render(<App suspend={false} />, container);
752
+ });
753
753
- // trigger a suspendy update
754
- act(() => {
755
- rerender(<App suspend={true} />);
756
- });
757
- expect(document.querySelector('[data-test-id=spinner]')).not.toBeNull();
754
+ // trigger a suspendy update
755
+ act(() => {
756
+ rerender(<App suspend={true} />);
757
+ });
758
+ expect(
759
+ document.querySelector('[data-test-id=spinner]'),
760
+ ).not.toBeNull();
761
759
- // now render regular content again
760
- act(() => {
761
- rerender(<App suspend={false} />);
762
- });
763
- expect(document.querySelector('[data-test-id=spinner]')).toBeNull();
762
+ // now render regular content again
763
+ act(() => {
764
+ rerender(<App suspend={false} />);
765
+ });
766
+ expect(document.querySelector('[data-test-id=spinner]')).toBeNull();
767
765
- // trigger a suspendy update with a delay
766
- React.unstable_withSuspenseConfig(
767
- () => {
768
- act(() => {
769
- rerender(<App suspend={true} />);
770
- });
771
- },
772
- {timeout: 5000},
773
- );
774
- // the spinner shows up regardless
775
- expect(document.querySelector('[data-test-id=spinner]')).not.toBeNull();
768
+ // trigger a suspendy update with a delay
769
+ React.unstable_withSuspenseConfig(
770
+ () => {
771
+ act(() => {
772
+ rerender(<App suspend={true} />);
773
+ });
774
+ },
775
+ {timeout: 5000},
776
+ );
777
+ // the spinner shows up regardless
778
+ expect(
779
+ document.querySelector('[data-test-id=spinner]'),
780
+ ).not.toBeNull();
781
777
- // resolve the promise
778
- await act(async () => {
779
- resolved = true;
780
- resolve();
781
- });
782
+ // resolve the promise
783
+ await act(async () => {
784
+ resolved = true;
785
+ resolve();
786
+ });
787
783
- // spinner gone, content showing
784
- expect(document.querySelector('[data-test-id=spinner]')).toBeNull();
785
- expect(container.textContent).toBe('was suspended');
786
- });
788
+ // spinner gone, content showing
789
+ expect(document.querySelector('[data-test-id=spinner]')).toBeNull();
790
+ expect(container.textContent).toBe('was suspended');
791
+ });
792
+ }
793
});
794
});
795
}
packages/react-reconciler/src/ReactFiberWorkLoop.js
+15
-3
@@ -1034,7 +1034,11 @@ function renderRoot(
1034
hasNotProcessedNewUpdates &&
1035
!isSync &&
1036
// do not delay if we're inside an act() scope
1037
- !(flushSuspenseFallbacksInTests && IsThisRendererActing.current)
1037
+ !(
1038
+ __DEV__ &&
1039
+ flushSuspenseFallbacksInTests &&
1040
+ IsThisRendererActing.current
1041
+ )
1042
) {
1043
// If we have not processed any new updates during this pass, then this is
1044
// either a retry of an existing fallback state or a hidden tree.
@@ -1075,7 +1079,11 @@ function renderRoot(
1079
if (
1080
!isSync &&
1081
// do not delay if we're inside an act() scope
1078
- !(flushSuspenseFallbacksInTests && IsThisRendererActing.current)
1082
+ !(
1083
+ __DEV__ &&
1084
+ flushSuspenseFallbacksInTests &&
1085
+ IsThisRendererActing.current
1086
+ )
1087
) {
1088
// We're suspended in a state that should be avoided. We'll try to avoid committing
1089
// it for as long as the timeouts let us.
@@ -1148,7 +1156,11 @@ function renderRoot(
1156
if (
1157
!isSync &&
1158
// do not delay if we're inside an act() scope
1151
- !(flushSuspenseFallbacksInTests && IsThisRendererActing.current) &&
1159
+ !(
1160
+ __DEV__ &&
1161
+ flushSuspenseFallbacksInTests &&
1162
+ IsThisRendererActing.current
1163
+ ) &&
1164
workInProgressRootLatestProcessedExpirationTime !== Sync &&
1165
workInProgressRootCanSuspendUsingConfig !== null
1166
) {