Skip to content

Commit ec1a045

Browse files
tyao1tyao1
committed
Add a temporary internal option to disable double useEffect in legacy strict mode (#26914)
<!-- Thanks for submitting a pull request! We appreciate you spending the time to work on these changes. Please provide enough information so that others can review your pull request. The three fields below are mandatory. Before submitting a pull request, please make sure the following is done: 1. Fork [the repository](https://github.com/facebook/react) and create your branch from `main`. 2. Run `yarn` in the repository root. 3. If you've fixed a bug or added code that should be tested, add tests! 4. Ensure the test suite passes (`yarn test`). Tip: `yarn test --watch TestName` is helpful in development. 5. Run `yarn test --prod` to test in the production environment. It supports the same options as `yarn test`. 6. If you need a debugger, run `yarn test --debug --watch TestName`, open `chrome://inspect`, and press "Inspect". 7. Format your code with [prettier](https://github.com/prettier/prettier) (`yarn prettier`). 8. Make sure your code lints (`yarn lint`). Tip: `yarn linc` to only check changed files. 9. Run the [Flow](https://flowtype.org/) type checks (`yarn flow`). 10. If you haven't already, complete the CLA. Learn more about contributing: https://reactjs.org/docs/how-to-contribute.html --> ## Summary <!-- Explain the **motivation** for making this change. What existing problem does the pull request solve? --> We are upgrading React 17 codebase to React18, and `StrictMode` has been great for surfacing potential production bugs on React18 for class components. There are non-trivial number of test failures caused by double `useEffect` in StrictMode. To prioritize surfacing and fixing issues that will break in production now, we need a flag to turn off double `useEffect` for now in StrictMode temporarily. This is a Meta-only hack for rolling out `createRoot` and we will fast follow to remove it and use full strict mode. ## How did you test this change? <!-- Demonstrate the code is solid. Example: The exact commands you ran and their output, screenshots / videos if the pull request changes the user interface. How exactly did you verify that your PR solves the issue you wanted to solve? If you leave this empty, your PR will very likely be closed. --> jest DiffTrain build for [254cbdb](254cbdb)
1 parent 4a74dd5 commit ec1a045

20 files changed

+246
-56
lines changed

‎compiled/facebook-www/REVISION

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
d1c8cdae3b20a670ee91b684e8e0ad0c400ae51c
1+
254cbdbd6d851a30bf3b649a6cb7c52786766fa4

‎compiled/facebook-www/React-dev.classic.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ if (
2727
}
2828
"use strict";
2929

30-
var ReactVersion = "18.3.0-www-classic-f2045cca";
30+
var ReactVersion = "18.3.0-www-classic-3cdb3aa3";
3131

3232
// ATTENTION
3333
// When adding new symbols to this file,

‎compiled/facebook-www/React-dev.modern.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ if (
2727
}
2828
"use strict";
2929

30-
var ReactVersion = "18.3.0-www-modern-20bf6d53";
30+
var ReactVersion = "18.3.0-www-modern-df20a6fc";
3131

3232
// ATTENTION
3333
// When adding new symbols to this file,

‎compiled/facebook-www/React-prod.modern.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -641,4 +641,4 @@ exports.useSyncExternalStore = function (
641641
);
642642
};
643643
exports.useTransition = useTransition;
644-
exports.version = "18.3.0-www-modern-b29a6ec1";
644+
exports.version = "18.3.0-www-modern-f829eef9";

‎compiled/facebook-www/ReactART-dev.classic.js

Lines changed: 23 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,7 @@ function _assertThisInitialized(self) {
6969
return self;
7070
}
7171

72-
var ReactVersion = "18.3.0-www-classic-5d5433b2";
72+
var ReactVersion = "18.3.0-www-classic-786512bb";
7373

7474
var LegacyRoot = 0;
7575
var ConcurrentRoot = 1;
@@ -177,7 +177,9 @@ var replayFailedUnitOfWorkWithInvokeGuardedCallback =
177177
dynamicFeatureFlags.enableDeferRootSchedulingToMicrotask,
178178
diffInCommitPhase = dynamicFeatureFlags.diffInCommitPhase,
179179
enableAsyncActions = dynamicFeatureFlags.enableAsyncActions,
180-
alwaysThrottleRetries = dynamicFeatureFlags.alwaysThrottleRetries; // On WWW, false is used for a new modern build.
180+
alwaysThrottleRetries = dynamicFeatureFlags.alwaysThrottleRetries,
181+
enableDO_NOT_USE_disableStrictPassiveEffect =
182+
dynamicFeatureFlags.enableDO_NOT_USE_disableStrictPassiveEffect; // On WWW, false is used for a new modern build.
181183
var enableProfilerTimer = true;
182184
var enableProfilerCommitHooks = true;
183185
var enableProfilerNestedUpdatePhase = true;
@@ -1536,6 +1538,9 @@ var StrictEffectsMode =
15361538
var ConcurrentUpdatesByDefaultMode =
15371539
/* */
15381540
32;
1541+
var NoStrictPassiveEffectsMode =
1542+
/* */
1543+
64;
15391544

15401545
// TODO: This is pretty well supported by browsers. Maybe we can drop it.
15411546
var clz32 = Math.clz32 ? Math.clz32 : clz32Fallback; // Count leading zeros.
@@ -9671,7 +9676,10 @@ function updateEffectImpl(fiberFlags, hookFlags, create, deps) {
96719676
}
96729677

96739678
function mountEffect(create, deps) {
9674-
if ((currentlyRenderingFiber$1.mode & StrictEffectsMode) !== NoMode) {
9679+
if (
9680+
(currentlyRenderingFiber$1.mode & StrictEffectsMode) !== NoMode &&
9681+
(currentlyRenderingFiber$1.mode & NoStrictPassiveEffectsMode) === NoMode
9682+
) {
96759683
mountEffectImpl(
96769684
MountPassiveDev | Passive$1 | PassiveStatic,
96779685
Passive,
@@ -28076,6 +28084,13 @@ function createFiberFromTypeAndProps(
2807628084
if ((mode & ConcurrentMode) !== NoMode) {
2807728085
// Strict effects should never run on legacy roots
2807828086
mode |= StrictEffectsMode;
28087+
28088+
if (
28089+
enableDO_NOT_USE_disableStrictPassiveEffect &&
28090+
pendingProps.DO_NOT_USE_disableStrictPassiveEffect
28091+
) {
28092+
mode |= NoStrictPassiveEffectsMode;
28093+
}
2807928094
}
2808028095

2808128096
break;
@@ -28277,6 +28292,11 @@ function createFiberFromSuspenseList(pendingProps, mode, lanes, key) {
2827728292
return fiber;
2827828293
}
2827928294
function createFiberFromOffscreen(pendingProps, mode, lanes, key) {
28295+
{
28296+
// StrictMode in Offscreen should always run double passive effects
28297+
mode &= ~NoStrictPassiveEffectsMode;
28298+
}
28299+
2828028300
var fiber = createFiber(OffscreenComponent, pendingProps, key, mode);
2828128301
fiber.elementType = REACT_OFFSCREEN_TYPE;
2828228302
fiber.lanes = lanes;

‎compiled/facebook-www/ReactART-dev.modern.js

Lines changed: 23 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,7 @@ function _assertThisInitialized(self) {
6969
return self;
7070
}
7171

72-
var ReactVersion = "18.3.0-www-modern-b9ce8919";
72+
var ReactVersion = "18.3.0-www-modern-34b19309";
7373

7474
var LegacyRoot = 0;
7575
var ConcurrentRoot = 1;
@@ -177,7 +177,9 @@ var replayFailedUnitOfWorkWithInvokeGuardedCallback =
177177
dynamicFeatureFlags.enableDeferRootSchedulingToMicrotask,
178178
diffInCommitPhase = dynamicFeatureFlags.diffInCommitPhase,
179179
enableAsyncActions = dynamicFeatureFlags.enableAsyncActions,
180-
alwaysThrottleRetries = dynamicFeatureFlags.alwaysThrottleRetries; // On WWW, true is used for a new modern build.
180+
alwaysThrottleRetries = dynamicFeatureFlags.alwaysThrottleRetries,
181+
enableDO_NOT_USE_disableStrictPassiveEffect =
182+
dynamicFeatureFlags.enableDO_NOT_USE_disableStrictPassiveEffect; // On WWW, true is used for a new modern build.
181183
var enableProfilerTimer = true;
182184
var enableProfilerCommitHooks = true;
183185
var enableProfilerNestedUpdatePhase = true;
@@ -1533,6 +1535,9 @@ var StrictEffectsMode =
15331535
var ConcurrentUpdatesByDefaultMode =
15341536
/* */
15351537
32;
1538+
var NoStrictPassiveEffectsMode =
1539+
/* */
1540+
64;
15361541

15371542
// TODO: This is pretty well supported by browsers. Maybe we can drop it.
15381543
var clz32 = Math.clz32 ? Math.clz32 : clz32Fallback; // Count leading zeros.
@@ -9427,7 +9432,10 @@ function updateEffectImpl(fiberFlags, hookFlags, create, deps) {
94279432
}
94289433

94299434
function mountEffect(create, deps) {
9430-
if ((currentlyRenderingFiber$1.mode & StrictEffectsMode) !== NoMode) {
9435+
if (
9436+
(currentlyRenderingFiber$1.mode & StrictEffectsMode) !== NoMode &&
9437+
(currentlyRenderingFiber$1.mode & NoStrictPassiveEffectsMode) === NoMode
9438+
) {
94319439
mountEffectImpl(
94329440
MountPassiveDev | Passive$1 | PassiveStatic,
94339441
Passive,
@@ -27736,6 +27744,13 @@ function createFiberFromTypeAndProps(
2773627744
if ((mode & ConcurrentMode) !== NoMode) {
2773727745
// Strict effects should never run on legacy roots
2773827746
mode |= StrictEffectsMode;
27747+
27748+
if (
27749+
enableDO_NOT_USE_disableStrictPassiveEffect &&
27750+
pendingProps.DO_NOT_USE_disableStrictPassiveEffect
27751+
) {
27752+
mode |= NoStrictPassiveEffectsMode;
27753+
}
2773927754
}
2774027755

2774127756
break;
@@ -27937,6 +27952,11 @@ function createFiberFromSuspenseList(pendingProps, mode, lanes, key) {
2793727952
return fiber;
2793827953
}
2793927954
function createFiberFromOffscreen(pendingProps, mode, lanes, key) {
27955+
{
27956+
// StrictMode in Offscreen should always run double passive effects
27957+
mode &= ~NoStrictPassiveEffectsMode;
27958+
}
27959+
2794027960
var fiber = createFiber(OffscreenComponent, pendingProps, key, mode);
2794127961
fiber.elementType = REACT_OFFSCREEN_TYPE;
2794227962
fiber.lanes = lanes;

‎compiled/facebook-www/ReactART-prod.classic.js

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -74,6 +74,8 @@ var ReactSharedInternals =
7474
diffInCommitPhase = dynamicFeatureFlags.diffInCommitPhase,
7575
enableAsyncActions = dynamicFeatureFlags.enableAsyncActions,
7676
alwaysThrottleRetries = dynamicFeatureFlags.alwaysThrottleRetries,
77+
enableDO_NOT_USE_disableStrictPassiveEffect =
78+
dynamicFeatureFlags.enableDO_NOT_USE_disableStrictPassiveEffect,
7779
REACT_ELEMENT_TYPE = Symbol.for("react.element"),
7880
REACT_PORTAL_TYPE = Symbol.for("react.portal"),
7981
REACT_FRAGMENT_TYPE = Symbol.for("react.fragment"),
@@ -9803,7 +9805,11 @@ function createFiberFromTypeAndProps(
98039805
case REACT_STRICT_MODE_TYPE:
98049806
fiberTag = 8;
98059807
mode |= 8;
9806-
0 !== (mode & 1) && (mode |= 16);
9808+
0 !== (mode & 1) &&
9809+
((mode |= 16),
9810+
enableDO_NOT_USE_disableStrictPassiveEffect &&
9811+
pendingProps.DO_NOT_USE_disableStrictPassiveEffect &&
9812+
(mode |= 64));
98079813
break;
98089814
case REACT_PROFILER_TYPE:
98099815
return (
@@ -10193,7 +10199,7 @@ var slice = Array.prototype.slice,
1019310199
return null;
1019410200
},
1019510201
bundleType: 0,
10196-
version: "18.3.0-www-classic-f2045cca",
10202+
version: "18.3.0-www-classic-3cdb3aa3",
1019710203
rendererPackageName: "react-art"
1019810204
};
1019910205
var internals$jscomp$inline_1318 = {
@@ -10224,7 +10230,7 @@ var internals$jscomp$inline_1318 = {
1022410230
scheduleRoot: null,
1022510231
setRefreshHandler: null,
1022610232
getCurrentFiber: null,
10227-
reconcilerVersion: "18.3.0-www-classic-f2045cca"
10233+
reconcilerVersion: "18.3.0-www-classic-3cdb3aa3"
1022810234
};
1022910235
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
1023010236
var hook$jscomp$inline_1319 = __REACT_DEVTOOLS_GLOBAL_HOOK__;

‎compiled/facebook-www/ReactART-prod.modern.js

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -74,6 +74,8 @@ var ReactSharedInternals =
7474
diffInCommitPhase = dynamicFeatureFlags.diffInCommitPhase,
7575
enableAsyncActions = dynamicFeatureFlags.enableAsyncActions,
7676
alwaysThrottleRetries = dynamicFeatureFlags.alwaysThrottleRetries,
77+
enableDO_NOT_USE_disableStrictPassiveEffect =
78+
dynamicFeatureFlags.enableDO_NOT_USE_disableStrictPassiveEffect,
7779
REACT_ELEMENT_TYPE = Symbol.for("react.element"),
7880
REACT_PORTAL_TYPE = Symbol.for("react.portal"),
7981
REACT_FRAGMENT_TYPE = Symbol.for("react.fragment"),
@@ -9508,7 +9510,11 @@ function createFiberFromTypeAndProps(
95089510
case REACT_STRICT_MODE_TYPE:
95099511
fiberTag = 8;
95109512
mode |= 8;
9511-
0 !== (mode & 1) && (mode |= 16);
9513+
0 !== (mode & 1) &&
9514+
((mode |= 16),
9515+
enableDO_NOT_USE_disableStrictPassiveEffect &&
9516+
pendingProps.DO_NOT_USE_disableStrictPassiveEffect &&
9517+
(mode |= 64));
95129518
break;
95139519
case REACT_PROFILER_TYPE:
95149520
return (
@@ -9858,7 +9864,7 @@ var slice = Array.prototype.slice,
98589864
return null;
98599865
},
98609866
bundleType: 0,
9861-
version: "18.3.0-www-modern-a3ef0062",
9867+
version: "18.3.0-www-modern-2245721b",
98629868
rendererPackageName: "react-art"
98639869
};
98649870
var internals$jscomp$inline_1298 = {
@@ -9889,7 +9895,7 @@ var internals$jscomp$inline_1298 = {
98899895
scheduleRoot: null,
98909896
setRefreshHandler: null,
98919897
getCurrentFiber: null,
9892-
reconcilerVersion: "18.3.0-www-modern-a3ef0062"
9898+
reconcilerVersion: "18.3.0-www-modern-2245721b"
98939899
};
98949900
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
98959901
var hook$jscomp$inline_1299 = __REACT_DEVTOOLS_GLOBAL_HOOK__;

‎compiled/facebook-www/ReactDOM-dev.classic.js

Lines changed: 23 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -144,7 +144,9 @@ var disableInputAttributeSyncing =
144144
dynamicFeatureFlags.enableDeferRootSchedulingToMicrotask,
145145
diffInCommitPhase = dynamicFeatureFlags.diffInCommitPhase,
146146
enableAsyncActions = dynamicFeatureFlags.enableAsyncActions,
147-
alwaysThrottleRetries = dynamicFeatureFlags.alwaysThrottleRetries; // On WWW, false is used for a new modern build.
147+
alwaysThrottleRetries = dynamicFeatureFlags.alwaysThrottleRetries,
148+
enableDO_NOT_USE_disableStrictPassiveEffect =
149+
dynamicFeatureFlags.enableDO_NOT_USE_disableStrictPassiveEffect; // On WWW, false is used for a new modern build.
148150
var enableProfilerTimer = true;
149151
var enableProfilerCommitHooks = true;
150152
var enableProfilerNestedUpdatePhase = true;
@@ -1700,6 +1702,9 @@ var StrictEffectsMode =
17001702
var ConcurrentUpdatesByDefaultMode =
17011703
/* */
17021704
32;
1705+
var NoStrictPassiveEffectsMode =
1706+
/* */
1707+
64;
17031708

17041709
// TODO: This is pretty well supported by browsers. Maybe we can drop it.
17051710
var clz32 = Math.clz32 ? Math.clz32 : clz32Fallback; // Count leading zeros.
@@ -14221,7 +14226,10 @@ function updateEffectImpl(fiberFlags, hookFlags, create, deps) {
1422114226
}
1422214227

1422314228
function mountEffect(create, deps) {
14224-
if ((currentlyRenderingFiber$1.mode & StrictEffectsMode) !== NoMode) {
14229+
if (
14230+
(currentlyRenderingFiber$1.mode & StrictEffectsMode) !== NoMode &&
14231+
(currentlyRenderingFiber$1.mode & NoStrictPassiveEffectsMode) === NoMode
14232+
) {
1422514233
mountEffectImpl(
1422614234
MountPassiveDev | Passive$1 | PassiveStatic,
1422714235
Passive,
@@ -33703,6 +33711,13 @@ function createFiberFromTypeAndProps(
3370333711
if ((mode & ConcurrentMode) !== NoMode) {
3370433712
// Strict effects should never run on legacy roots
3370533713
mode |= StrictEffectsMode;
33714+
33715+
if (
33716+
enableDO_NOT_USE_disableStrictPassiveEffect &&
33717+
pendingProps.DO_NOT_USE_disableStrictPassiveEffect
33718+
) {
33719+
mode |= NoStrictPassiveEffectsMode;
33720+
}
3370633721
}
3370733722

3370833723
break;
@@ -33904,6 +33919,11 @@ function createFiberFromSuspenseList(pendingProps, mode, lanes, key) {
3390433919
return fiber;
3390533920
}
3390633921
function createFiberFromOffscreen(pendingProps, mode, lanes, key) {
33922+
{
33923+
// StrictMode in Offscreen should always run double passive effects
33924+
mode &= ~NoStrictPassiveEffectsMode;
33925+
}
33926+
3390733927
var fiber = createFiber(OffscreenComponent, pendingProps, key, mode);
3390833928
fiber.elementType = REACT_OFFSCREEN_TYPE;
3390933929
fiber.lanes = lanes;
@@ -34194,7 +34214,7 @@ function createFiberRoot(
3419434214
return root;
3419534215
}
3419634216

34197-
var ReactVersion = "18.3.0-www-classic-ee7ec006";
34217+
var ReactVersion = "18.3.0-www-classic-0b2d04c1";
3419834218

3419934219
function createPortal$1(
3420034220
children,

‎compiled/facebook-www/ReactDOM-dev.modern.js

Lines changed: 23 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -130,7 +130,9 @@ var disableInputAttributeSyncing =
130130
dynamicFeatureFlags.enableDeferRootSchedulingToMicrotask,
131131
diffInCommitPhase = dynamicFeatureFlags.diffInCommitPhase,
132132
enableAsyncActions = dynamicFeatureFlags.enableAsyncActions,
133-
alwaysThrottleRetries = dynamicFeatureFlags.alwaysThrottleRetries; // On WWW, true is used for a new modern build.
133+
alwaysThrottleRetries = dynamicFeatureFlags.alwaysThrottleRetries,
134+
enableDO_NOT_USE_disableStrictPassiveEffect =
135+
dynamicFeatureFlags.enableDO_NOT_USE_disableStrictPassiveEffect; // On WWW, true is used for a new modern build.
134136
var enableProfilerTimer = true;
135137
var enableProfilerCommitHooks = true;
136138
var enableProfilerNestedUpdatePhase = true;
@@ -1052,6 +1054,9 @@ var StrictEffectsMode =
10521054
var ConcurrentUpdatesByDefaultMode =
10531055
/* */
10541056
32;
1057+
var NoStrictPassiveEffectsMode =
1058+
/* */
1059+
64;
10551060

10561061
// TODO: This is pretty well supported by browsers. Maybe we can drop it.
10571062
var clz32 = Math.clz32 ? Math.clz32 : clz32Fallback; // Count leading zeros.
@@ -14162,7 +14167,10 @@ function updateEffectImpl(fiberFlags, hookFlags, create, deps) {
1416214167
}
1416314168

1416414169
function mountEffect(create, deps) {
14165-
if ((currentlyRenderingFiber$1.mode & StrictEffectsMode) !== NoMode) {
14170+
if (
14171+
(currentlyRenderingFiber$1.mode & StrictEffectsMode) !== NoMode &&
14172+
(currentlyRenderingFiber$1.mode & NoStrictPassiveEffectsMode) === NoMode
14173+
) {
1416614174
mountEffectImpl(
1416714175
MountPassiveDev | Passive$1 | PassiveStatic,
1416814176
Passive,
@@ -33548,6 +33556,13 @@ function createFiberFromTypeAndProps(
3354833556
if ((mode & ConcurrentMode) !== NoMode) {
3354933557
// Strict effects should never run on legacy roots
3355033558
mode |= StrictEffectsMode;
33559+
33560+
if (
33561+
enableDO_NOT_USE_disableStrictPassiveEffect &&
33562+
pendingProps.DO_NOT_USE_disableStrictPassiveEffect
33563+
) {
33564+
mode |= NoStrictPassiveEffectsMode;
33565+
}
3355133566
}
3355233567

3355333568
break;
@@ -33749,6 +33764,11 @@ function createFiberFromSuspenseList(pendingProps, mode, lanes, key) {
3374933764
return fiber;
3375033765
}
3375133766
function createFiberFromOffscreen(pendingProps, mode, lanes, key) {
33767+
{
33768+
// StrictMode in Offscreen should always run double passive effects
33769+
mode &= ~NoStrictPassiveEffectsMode;
33770+
}
33771+
3375233772
var fiber = createFiber(OffscreenComponent, pendingProps, key, mode);
3375333773
fiber.elementType = REACT_OFFSCREEN_TYPE;
3375433774
fiber.lanes = lanes;
@@ -34039,7 +34059,7 @@ function createFiberRoot(
3403934059
return root;
3404034060
}
3404134061

34042-
var ReactVersion = "18.3.0-www-modern-b9ce8919";
34062+
var ReactVersion = "18.3.0-www-modern-34b19309";
3404334063

3404434064
function createPortal$1(
3404534065
children,

0 commit comments

Comments
 (0)