Skip to content

Commit b9134ae

Browse files
committed
Don't consider Portals animating unless they're wrapped in a ViewTransition
And that doesn't disable with update="none"
1 parent 3a5b326 commit b9134ae

File tree

1 file changed

+11
-1
lines changed

1 file changed

+11
-1
lines changed

packages/react-reconciler/src/ReactFiberCommitWork.js

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -210,6 +210,7 @@ import {
210210
TransitionRoot,
211211
TransitionTracingMarker,
212212
} from './ReactFiberTracingMarkerComponent';
213+
import {getViewTransitionClassName} from './ReactFiberViewTransitionComponent';
213214
import {
214215
commitHookLayoutEffects,
215216
commitHookLayoutUnmountEffects,
@@ -303,6 +304,7 @@ export let shouldFireAfterActiveInstanceBlur: boolean = false;
303304
// Used during the commit phase to track whether a parent ViewTransition component
304305
// might have been affected by any mutations / relayouts below.
305306
let viewTransitionContextChanged: boolean = false;
307+
let inUpdateViewTransition: boolean = false;
306308
let rootViewTransitionAffected: boolean = false;
307309

308310
function isHydratingParent(current: Fiber, finishedWork: Fiber): boolean {
@@ -1937,6 +1939,7 @@ export function commitMutationEffects(
19371939
inProgressRoot = root;
19381940

19391941
rootViewTransitionAffected = false;
1942+
inUpdateViewTransition = false;
19401943

19411944
resetComponentEffectTimers();
19421945

@@ -2299,7 +2302,7 @@ function commitMutationEffectsOnFiber(
22992302
recursivelyTraverseMutationEffects(root, finishedWork, lanes);
23002303
commitReconciliationEffects(finishedWork, lanes);
23012304
}
2302-
if (viewTransitionMutationContext) {
2305+
if (viewTransitionMutationContext && inUpdateViewTransition) {
23032306
// A Portal doesn't necessarily exist within the context of this subtree.
23042307
// Ideally we would track which React ViewTransition component nests the container
23052308
// but that's costly. Instead, we treat each Portal as if it's a new React root.
@@ -2534,6 +2537,10 @@ function commitMutationEffectsOnFiber(
25342537
}
25352538
}
25362539
const prevMutationContext = pushMutationContext();
2540+
const prevUpdate = inUpdateViewTransition;
2541+
const props = finishedWork.memoizedProps;
2542+
inUpdateViewTransition =
2543+
getViewTransitionClassName(props.default, props.update) !== 'none';
25372544
recursivelyTraverseMutationEffects(root, finishedWork, lanes);
25382545
commitReconciliationEffects(finishedWork, lanes);
25392546
const isViewTransitionEligible =
@@ -2551,6 +2558,7 @@ function commitMutationEffectsOnFiber(
25512558
finishedWork.flags |= Update;
25522559
}
25532560
}
2561+
inUpdateViewTransition = prevUpdate;
25542562
popMutationContext(prevMutationContext);
25552563
break;
25562564
}
@@ -2763,6 +2771,8 @@ function commitAfterMutationEffectsOnFiber(
27632771
// Ideally we would track which React ViewTransition component nests the container
27642772
// but that's costly. Instead, we treat each Portal as if it's a new React root.
27652773
// Therefore any leaked resize of a child could affect the root so the root should animate.
2774+
// We only do this if the Portal is inside a ViewTransition and it is not disabled
2775+
// with update="none". Otherwise the Portal is considered not animating.
27662776
rootViewTransitionAffected = true;
27672777
}
27682778
viewTransitionContextChanged = prevContextChanged;

0 commit comments

Comments
 (0)