Skip to content

Commit

Permalink
Put modern StrictMode behind a feature flag
Browse files Browse the repository at this point in the history
  • Loading branch information
sammy-SC committed Sep 30, 2022
1 parent 3517bd9 commit 0f3b59f
Show file tree
Hide file tree
Showing 21 changed files with 636 additions and 90 deletions.
51 changes: 45 additions & 6 deletions packages/react-reconciler/src/ReactFiberClassComponent.new.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,14 +13,20 @@ import type {UpdateQueue} from './ReactFiberClassUpdateQueue.new';
import type {Flags} from './ReactFiberFlags';

import * as React from 'react';
import {LayoutStatic, Update, Snapshot} from './ReactFiberFlags';
import {
LayoutStatic,
Update,
Snapshot,
MountLayoutDev,
} from './ReactFiberFlags';
import {
debugRenderPhaseSideEffectsForStrictMode,
disableLegacyContext,
enableDebugTracing,
enableSchedulingProfiler,
warnAboutDeprecatedLifecycles,
enableLazyContextPropagation,
enableStrictEffects,
} from 'shared/ReactFeatureFlags';
import ReactStrictModeWarnings from './ReactStrictModeWarnings.new';
import {isMounted} from './ReactFiberTreeReflection';
Expand All @@ -33,7 +39,12 @@ import isArray from 'shared/isArray';
import {REACT_CONTEXT_TYPE, REACT_PROVIDER_TYPE} from 'shared/ReactSymbols';

import {resolveDefaultProps} from './ReactFiberLazyComponent.new';
import {DebugTracingMode, StrictLegacyMode} from './ReactTypeOfMode';
import {
DebugTracingMode,
NoMode,
StrictLegacyMode,
StrictEffectsMode,
} from './ReactTypeOfMode';

import {
enqueueUpdate,
Expand Down Expand Up @@ -896,7 +907,14 @@ function mountClassInstance(
}

if (typeof instance.componentDidMount === 'function') {
const fiberFlags: Flags = Update | LayoutStatic;
let fiberFlags: Flags = Update | LayoutStatic;
if (
__DEV__ &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
fiberFlags |= MountLayoutDev;
}
workInProgress.flags |= fiberFlags;
}
}
Expand Down Expand Up @@ -967,7 +985,14 @@ function resumeMountClassInstance(
// If an update was already in progress, we should schedule an Update
// effect even though we're bailing out, so that cWU/cDU are called.
if (typeof instance.componentDidMount === 'function') {
const fiberFlags: Flags = Update | LayoutStatic;
let fiberFlags: Flags = Update | LayoutStatic;
if (
__DEV__ &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
fiberFlags |= MountLayoutDev;
}
workInProgress.flags |= fiberFlags;
}
return false;
Expand Down Expand Up @@ -1011,14 +1036,28 @@ function resumeMountClassInstance(
}
}
if (typeof instance.componentDidMount === 'function') {
const fiberFlags: Flags = Update | LayoutStatic;
let fiberFlags: Flags = Update | LayoutStatic;
if (
__DEV__ &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
fiberFlags |= MountLayoutDev;
}
workInProgress.flags |= fiberFlags;
}
} else {
// If an update was already in progress, we should schedule an Update
// effect even though we're bailing out, so that cWU/cDU are called.
if (typeof instance.componentDidMount === 'function') {
const fiberFlags: Flags = Update | LayoutStatic;
let fiberFlags: Flags = Update | LayoutStatic;
if (
__DEV__ &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
fiberFlags |= MountLayoutDev;
}
workInProgress.flags |= fiberFlags;
}

Expand Down
51 changes: 45 additions & 6 deletions packages/react-reconciler/src/ReactFiberClassComponent.old.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,14 +13,20 @@ import type {UpdateQueue} from './ReactFiberClassUpdateQueue.old';
import type {Flags} from './ReactFiberFlags';

import * as React from 'react';
import {LayoutStatic, Update, Snapshot} from './ReactFiberFlags';
import {
LayoutStatic,
Update,
Snapshot,
MountLayoutDev,
} from './ReactFiberFlags';
import {
debugRenderPhaseSideEffectsForStrictMode,
disableLegacyContext,
enableDebugTracing,
enableSchedulingProfiler,
warnAboutDeprecatedLifecycles,
enableLazyContextPropagation,
enableStrictEffects,
} from 'shared/ReactFeatureFlags';
import ReactStrictModeWarnings from './ReactStrictModeWarnings.old';
import {isMounted} from './ReactFiberTreeReflection';
Expand All @@ -33,7 +39,12 @@ import isArray from 'shared/isArray';
import {REACT_CONTEXT_TYPE, REACT_PROVIDER_TYPE} from 'shared/ReactSymbols';

import {resolveDefaultProps} from './ReactFiberLazyComponent.old';
import {DebugTracingMode, StrictLegacyMode} from './ReactTypeOfMode';
import {
DebugTracingMode,
NoMode,
StrictLegacyMode,
StrictEffectsMode,
} from './ReactTypeOfMode';

import {
enqueueUpdate,
Expand Down Expand Up @@ -896,7 +907,14 @@ function mountClassInstance(
}

if (typeof instance.componentDidMount === 'function') {
const fiberFlags: Flags = Update | LayoutStatic;
let fiberFlags: Flags = Update | LayoutStatic;
if (
__DEV__ &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
fiberFlags |= MountLayoutDev;
}
workInProgress.flags |= fiberFlags;
}
}
Expand Down Expand Up @@ -967,7 +985,14 @@ function resumeMountClassInstance(
// If an update was already in progress, we should schedule an Update
// effect even though we're bailing out, so that cWU/cDU are called.
if (typeof instance.componentDidMount === 'function') {
const fiberFlags: Flags = Update | LayoutStatic;
let fiberFlags: Flags = Update | LayoutStatic;
if (
__DEV__ &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
fiberFlags |= MountLayoutDev;
}
workInProgress.flags |= fiberFlags;
}
return false;
Expand Down Expand Up @@ -1011,14 +1036,28 @@ function resumeMountClassInstance(
}
}
if (typeof instance.componentDidMount === 'function') {
const fiberFlags: Flags = Update | LayoutStatic;
let fiberFlags: Flags = Update | LayoutStatic;
if (
__DEV__ &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
fiberFlags |= MountLayoutDev;
}
workInProgress.flags |= fiberFlags;
}
} else {
// If an update was already in progress, we should schedule an Update
// effect even though we're bailing out, so that cWU/cDU are called.
if (typeof instance.componentDidMount === 'function') {
const fiberFlags: Flags = Update | LayoutStatic;
let fiberFlags: Flags = Update | LayoutStatic;
if (
__DEV__ &&
enableStrictEffects &&
(workInProgress.mode & StrictEffectsMode) !== NoMode
) {
fiberFlags |= MountLayoutDev;
}
workInProgress.flags |= fiberFlags;
}

Expand Down
110 changes: 109 additions & 1 deletion packages/react-reconciler/src/ReactFiberCommitWork.new.js
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,7 @@ import {
enableCache,
enableTransitionTracing,
enableUseEventHook,
enableStrictEffects,
} from 'shared/ReactFeatureFlags';
import {
FunctionComponent,
Expand Down Expand Up @@ -4109,4 +4110,111 @@ function commitPassiveUnmountInsideDeletedTreeOnFiber(
}
}

export {commitPlacement, commitAttachRef, commitDetachRef};
function invokeLayoutEffectMountInDEV(fiber: Fiber): void {
if (__DEV__ && enableStrictEffects) {
// We don't need to re-check StrictEffectsMode here.
// This function is only called if that check has already passed.
switch (fiber.tag) {
case FunctionComponent:
case ForwardRef:
case SimpleMemoComponent: {
try {
commitHookEffectListMount(HookLayout | HookHasEffect, fiber);
} catch (error) {
captureCommitPhaseError(fiber, fiber.return, error);
}
break;
}
case ClassComponent: {
const instance = fiber.stateNode;
try {
instance.componentDidMount();
} catch (error) {
captureCommitPhaseError(fiber, fiber.return, error);
}
break;
}
}
}
}

function invokePassiveEffectMountInDEV(fiber: Fiber): void {
if (__DEV__ && enableStrictEffects) {
// We don't need to re-check StrictEffectsMode here.
// This function is only called if that check has already passed.
switch (fiber.tag) {
case FunctionComponent:
case ForwardRef:
case SimpleMemoComponent: {
try {
commitHookEffectListMount(HookPassive | HookHasEffect, fiber);
} catch (error) {
captureCommitPhaseError(fiber, fiber.return, error);
}
break;
}
}
}
}

function invokeLayoutEffectUnmountInDEV(fiber: Fiber): void {
if (__DEV__ && enableStrictEffects) {
// We don't need to re-check StrictEffectsMode here.
// This function is only called if that check has already passed.
switch (fiber.tag) {
case FunctionComponent:
case ForwardRef:
case SimpleMemoComponent: {
try {
commitHookEffectListUnmount(
HookLayout | HookHasEffect,
fiber,
fiber.return,
);
} catch (error) {
captureCommitPhaseError(fiber, fiber.return, error);
}
break;
}
case ClassComponent: {
const instance = fiber.stateNode;
if (typeof instance.componentWillUnmount === 'function') {
safelyCallComponentWillUnmount(fiber, fiber.return, instance);
}
break;
}
}
}
}

function invokePassiveEffectUnmountInDEV(fiber: Fiber): void {
if (__DEV__ && enableStrictEffects) {
// We don't need to re-check StrictEffectsMode here.
// This function is only called if that check has already passed.
switch (fiber.tag) {
case FunctionComponent:
case ForwardRef:
case SimpleMemoComponent: {
try {
commitHookEffectListUnmount(
HookPassive | HookHasEffect,
fiber,
fiber.return,
);
} catch (error) {
captureCommitPhaseError(fiber, fiber.return, error);
}
}
}
}
}

export {
commitPlacement,
commitAttachRef,
commitDetachRef,
invokeLayoutEffectMountInDEV,
invokeLayoutEffectUnmountInDEV,
invokePassiveEffectMountInDEV,
invokePassiveEffectUnmountInDEV,
};
Loading

0 comments on commit 0f3b59f

Please sign in to comment.