Skip to content

Commit

Permalink
Call cleanup of insertion effects when hidden (#30954)
Browse files Browse the repository at this point in the history
Insertion effects do not unmount when a subtree is removed while
offscreen.

Current behavior for an insertion effect is if the component goes

- *visible -> removed:* calls insertion effect cleanup
- *visible -> offscreen -> removed:* insertion effect cleanup is never
called

This makes it so we always call insertion effect cleanup when removing
the component.

Likely also fixes #26670

---------

Co-authored-by: Rick Hanlon <rickhanlonii@fb.com>

DiffTrain build for [d3d4d3a](d3d4d3a)
  • Loading branch information
rickhanlonii committed Sep 13, 2024
1 parent 037b2e3 commit 9d3ed27
Show file tree
Hide file tree
Showing 34 changed files with 3,254 additions and 2,504 deletions.
2 changes: 1 addition & 1 deletion compiled/facebook-www/REVISION
Original file line number Diff line number Diff line change
@@ -1 +1 @@
94e4acaa1477e65cac02ba86058cde0afe4c8f1f
d3d4d3a46b014ab0f6edc443c19fcdba09105f20
2 changes: 1 addition & 1 deletion compiled/facebook-www/REVISION_TRANSFORMS
Original file line number Diff line number Diff line change
@@ -1 +1 @@
94e4acaa1477e65cac02ba86058cde0afe4c8f1f
d3d4d3a46b014ab0f6edc443c19fcdba09105f20
2 changes: 1 addition & 1 deletion compiled/facebook-www/React-dev.classic.js
Original file line number Diff line number Diff line change
Expand Up @@ -2001,7 +2001,7 @@ __DEV__ &&
exports.useTransition = function () {
return resolveDispatcher().useTransition();
};
exports.version = "19.0.0-www-classic-94e4acaa-20240913";
exports.version = "19.0.0-www-classic-d3d4d3a4-20240913";
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
"function" ===
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
Expand Down
2 changes: 1 addition & 1 deletion compiled/facebook-www/React-dev.modern.js
Original file line number Diff line number Diff line change
Expand Up @@ -1981,7 +1981,7 @@ __DEV__ &&
exports.useTransition = function () {
return resolveDispatcher().useTransition();
};
exports.version = "19.0.0-www-modern-94e4acaa-20240913";
exports.version = "19.0.0-www-modern-d3d4d3a4-20240913";
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
"function" ===
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
Expand Down
2 changes: 1 addition & 1 deletion compiled/facebook-www/React-prod.classic.js
Original file line number Diff line number Diff line change
Expand Up @@ -665,4 +665,4 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactSharedInternals.H.useTransition();
};
exports.version = "19.0.0-www-classic-94e4acaa-20240913";
exports.version = "19.0.0-www-classic-d3d4d3a4-20240913";
2 changes: 1 addition & 1 deletion compiled/facebook-www/React-prod.modern.js
Original file line number Diff line number Diff line change
Expand Up @@ -665,4 +665,4 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactSharedInternals.H.useTransition();
};
exports.version = "19.0.0-www-modern-94e4acaa-20240913";
exports.version = "19.0.0-www-modern-d3d4d3a4-20240913";
2 changes: 1 addition & 1 deletion compiled/facebook-www/React-profiling.classic.js
Original file line number Diff line number Diff line change
Expand Up @@ -669,7 +669,7 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactSharedInternals.H.useTransition();
};
exports.version = "19.0.0-www-classic-94e4acaa-20240913";
exports.version = "19.0.0-www-classic-d3d4d3a4-20240913";
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
"function" ===
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
Expand Down
2 changes: 1 addition & 1 deletion compiled/facebook-www/React-profiling.modern.js
Original file line number Diff line number Diff line change
Expand Up @@ -669,7 +669,7 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactSharedInternals.H.useTransition();
};
exports.version = "19.0.0-www-modern-94e4acaa-20240913";
exports.version = "19.0.0-www-modern-d3d4d3a4-20240913";
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
"function" ===
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
Expand Down
144 changes: 97 additions & 47 deletions compiled/facebook-www/ReactART-dev.classic.js
Original file line number Diff line number Diff line change
Expand Up @@ -9786,9 +9786,7 @@ __DEV__ &&
markComponentLayoutEffectUnmountStarted(finishedWork)),
(flags & Insertion) !== NoFlags &&
(isRunningInsertionEffect = !0),
runWithFiberInDEV(
finishedWork,
callDestroyInDEV,
safelyCallDestroy(
finishedWork,
nearestMountedAncestor,
destroy
Expand Down Expand Up @@ -10028,6 +10026,15 @@ __DEV__ &&
}
else ref.current = null;
}
function safelyCallDestroy(current, nearestMountedAncestor, destroy) {
runWithFiberInDEV(
current,
callDestroyInDEV,
current,
nearestMountedAncestor,
destroy
);
}
function commitProfiler(finishedWork, current, commitTime, effectDuration) {
var _finishedWork$memoize = finishedWork.memoizedProps,
onCommit = _finishedWork$memoize.onCommit;
Expand Down Expand Up @@ -10816,54 +10823,95 @@ __DEV__ &&
case 11:
case 14:
case 15:
if (
if (enableHiddenSubtreeInsertionEffectCleanup) {
if (
((_prevHostParent = deletedFiber.updateQueue),
null !== _prevHostParent &&
((_prevHostParent = _prevHostParent.lastEffect),
null !== _prevHostParent))
) {
_prevHostParentIsContainer = _prevHostParent =
_prevHostParent.next;
do {
var tag = _prevHostParentIsContainer.tag,
inst = _prevHostParentIsContainer.inst,
destroy = inst.destroy;
void 0 !== destroy &&
((tag & Insertion) !== NoFlags
? ((isRunningInsertionEffect = !0),
(inst.destroy = void 0),
safelyCallDestroy(
deletedFiber,
nearestMountedAncestor,
destroy
),
(isRunningInsertionEffect = !1))
: offscreenSubtreeWasHidden ||
(tag & Layout) === NoFlags ||
(enableSchedulingProfiler &&
markComponentLayoutEffectUnmountStarted(deletedFiber),
shouldProfile(deletedFiber)
? (startLayoutEffectTimer(),
(inst.destroy = void 0),
safelyCallDestroy(
deletedFiber,
nearestMountedAncestor,
destroy
),
recordLayoutEffectDuration(deletedFiber))
: ((inst.destroy = void 0),
safelyCallDestroy(
deletedFiber,
nearestMountedAncestor,
destroy
)),
enableSchedulingProfiler &&
markComponentLayoutEffectUnmountStopped()));
_prevHostParentIsContainer = _prevHostParentIsContainer.next;
} while (_prevHostParentIsContainer !== _prevHostParent);
}
} else if (
!offscreenSubtreeWasHidden &&
((_prevHostParent = deletedFiber.updateQueue),
null !== _prevHostParent &&
((_prevHostParent = _prevHostParent.lastEffect),
null !== _prevHostParent))
) {
_prevHostParentIsContainer = _prevHostParent = _prevHostParent.next;
do {
var tag = _prevHostParentIsContainer.tag,
inst = _prevHostParentIsContainer.inst,
destroy = inst.destroy;
void 0 !== destroy &&
((tag & Insertion) !== NoFlags
? ((inst.destroy = void 0),
runWithFiberInDEV(
deletedFiber,
callDestroyInDEV,
deletedFiber,
nearestMountedAncestor,
destroy
))
: (tag & Layout) !== NoFlags &&
(enableSchedulingProfiler &&
markComponentLayoutEffectUnmountStarted(deletedFiber),
shouldProfile(deletedFiber)
? (startLayoutEffectTimer(),
(inst.destroy = void 0),
runWithFiberInDEV(
deletedFiber,
callDestroyInDEV,
deletedFiber,
nearestMountedAncestor,
destroy
),
recordLayoutEffectDuration(deletedFiber))
: ((inst.destroy = void 0),
runWithFiberInDEV(
deletedFiber,
callDestroyInDEV,
deletedFiber,
nearestMountedAncestor,
destroy
)),
enableSchedulingProfiler &&
markComponentLayoutEffectUnmountStopped()));
_prevHostParentIsContainer = _prevHostParentIsContainer.next;
} while (_prevHostParentIsContainer !== _prevHostParent);
do
(tag = _prevHostParentIsContainer.tag),
(inst = _prevHostParentIsContainer.inst),
(destroy = inst.destroy),
void 0 !== destroy &&
((tag & Insertion) !== NoFlags
? ((inst.destroy = void 0),
safelyCallDestroy(
deletedFiber,
nearestMountedAncestor,
destroy
))
: (tag & Layout) !== NoFlags &&
(enableSchedulingProfiler &&
markComponentLayoutEffectUnmountStarted(deletedFiber),
shouldProfile(deletedFiber)
? (startLayoutEffectTimer(),
(inst.destroy = void 0),
safelyCallDestroy(
deletedFiber,
nearestMountedAncestor,
destroy
),
recordLayoutEffectDuration(deletedFiber))
: ((inst.destroy = void 0),
safelyCallDestroy(
deletedFiber,
nearestMountedAncestor,
destroy
)),
enableSchedulingProfiler &&
markComponentLayoutEffectUnmountStopped())),
(_prevHostParentIsContainer = _prevHostParentIsContainer.next);
while (_prevHostParentIsContainer !== _prevHostParent);
}
recursivelyTraverseDeletionEffects(
finishedRoot,
Expand Down Expand Up @@ -14863,6 +14911,8 @@ __DEV__ &&
enableRenderableContext = dynamicFeatureFlags.enableRenderableContext,
enableRetryLaneExpiration = dynamicFeatureFlags.enableRetryLaneExpiration,
enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing,
enableHiddenSubtreeInsertionEffectCleanup =
dynamicFeatureFlags.enableHiddenSubtreeInsertionEffectCleanup,
renameElementSymbol = dynamicFeatureFlags.renameElementSymbol,
retryLaneExpirationMs = dynamicFeatureFlags.retryLaneExpirationMs,
syncLaneExpirationMs = dynamicFeatureFlags.syncLaneExpirationMs,
Expand Down Expand Up @@ -17062,11 +17112,11 @@ __DEV__ &&
(function () {
var internals = {
bundleType: 1,
version: "19.0.0-www-classic-94e4acaa-20240913",
version: "19.0.0-www-classic-d3d4d3a4-20240913",
rendererPackageName: "react-art",
currentDispatcherRef: ReactSharedInternals,
findFiberByHostInstance: getInstanceFromNode,
reconcilerVersion: "19.0.0-www-classic-94e4acaa-20240913"
reconcilerVersion: "19.0.0-www-classic-d3d4d3a4-20240913"
};
internals.overrideHookState = overrideHookState;
internals.overrideHookStateDeletePath = overrideHookStateDeletePath;
Expand Down Expand Up @@ -17100,7 +17150,7 @@ __DEV__ &&
exports.Shape = Shape;
exports.Surface = Surface;
exports.Text = Text;
exports.version = "19.0.0-www-classic-94e4acaa-20240913";
exports.version = "19.0.0-www-classic-d3d4d3a4-20240913";
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
"function" ===
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
Expand Down
Loading

0 comments on commit 9d3ed27

Please sign in to comment.