Skip to content

Commit 70e998a

Browse files
authored
Fix disableStrictPassiveEffect not working under Suspense (#26989)
In #26914 I added an extra logic to turn off double useEffect if there is an `Offscreen` tag. But `Suspense` uses `Offscreen` tag internally and that turns off `disableStrictPassiveEffect` for everything.
1 parent c8deb5d commit 70e998a

File tree

3 files changed

+26
-8
lines changed

3 files changed

+26
-8
lines changed

packages/react-reconciler/src/ReactFiber.js

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -760,10 +760,6 @@ export function createFiberFromOffscreen(
760760
lanes: Lanes,
761761
key: null | string,
762762
): Fiber {
763-
if (__DEV__) {
764-
// StrictMode in Offscreen should always run double passive effects
765-
mode &= ~NoStrictPassiveEffectsMode;
766-
}
767763
const fiber = createFiber(OffscreenComponent, pendingProps, key, mode);
768764
fiber.elementType = REACT_OFFSCREEN_TYPE;
769765
fiber.lanes = lanes;

packages/react-reconciler/src/__tests__/ReactOffscreenStrictMode-test.js

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -55,8 +55,8 @@ describe('ReactOffscreenStrictMode', () => {
5555
]);
5656
});
5757

58-
// @gate __DEV__ && enableOffscreen
59-
it('should trigger strict effects when disableStrictPassiveEffect is presented on StrictMode', async () => {
58+
// @gate __DEV__ && enableOffscreen && enableDO_NOT_USE_disableStrictPassiveEffect
59+
it('does not trigger strict effects when disableStrictPassiveEffect is presented on StrictMode', async () => {
6060
await act(() => {
6161
ReactNoop.render(
6262
<React.StrictMode DO_NOT_USE_disableStrictPassiveEffect={true}>
@@ -73,9 +73,7 @@ describe('ReactOffscreenStrictMode', () => {
7373
'A: useLayoutEffect mount',
7474
'A: useEffect mount',
7575
'A: useLayoutEffect unmount',
76-
'A: useEffect unmount',
7776
'A: useLayoutEffect mount',
78-
'A: useEffect mount',
7977
]);
8078
});
8179

packages/react/src/__tests__/ReactStrictMode-test.internal.js

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -126,6 +126,30 @@ describe('ReactStrictMode', () => {
126126
]);
127127
});
128128

129+
// @gate enableDO_NOT_USE_disableStrictPassiveEffect
130+
it('should include legacy + strict effects mode, but not strict passive effect with disableStrictPassiveEffect in Suspense', async () => {
131+
await act(() => {
132+
const container = document.createElement('div');
133+
const root = ReactDOMClient.createRoot(container);
134+
root.render(
135+
<React.StrictMode DO_NOT_USE_disableStrictPassiveEffect={true}>
136+
<React.Suspense>
137+
<Component label="A" />
138+
</React.Suspense>
139+
</React.StrictMode>,
140+
);
141+
});
142+
143+
expect(log).toEqual([
144+
'A: render',
145+
'A: render',
146+
'A: useLayoutEffect mount',
147+
'A: useEffect mount',
148+
'A: useLayoutEffect unmount',
149+
'A: useLayoutEffect mount',
150+
]);
151+
});
152+
129153
it('should allow level to be increased with nesting', async () => {
130154
await act(() => {
131155
const container = document.createElement('div');

0 commit comments

Comments
 (0)