@@ -81,6 +81,7 @@ import {
8181 supportsMicrotasks ,
8282 errorHydratingContainer ,
8383 scheduleMicrotask ,
84+ requestPostPaintCallback ,
8485} from './ReactFiberHostConfig' ;
8586
8687import {
@@ -344,6 +345,7 @@ export function getWorkInProgressTransitions() {
344345}
345346
346347let currentPendingTransitionCallbacks : PendingTransitionCallbacks | null = null ;
348+ let currentEndTime : number | null = null ;
347349
348350export function addTransitionStartCallbackToPendingTransition (
349351 transition : Transition ,
@@ -2508,6 +2510,24 @@ function commitRootImpl(
25082510 markCommitStopped ( ) ;
25092511 }
25102512
2513+ const prevRootTransitionCallbacks = root . transitionCallbacks ;
2514+ if ( prevRootTransitionCallbacks !== null ) {
2515+ requestPostPaintCallback ( endTime => {
2516+ const prevPendingTransitionCallbacks = currentPendingTransitionCallbacks ;
2517+ if ( prevPendingTransitionCallbacks !== null ) {
2518+ scheduleCallback ( IdleSchedulerPriority , ( ) => {
2519+ processTransitionCallbacks (
2520+ prevPendingTransitionCallbacks ,
2521+ endTime ,
2522+ prevRootTransitionCallbacks ,
2523+ ) ;
2524+ } ) ;
2525+ } else {
2526+ currentEndTime = endTime ;
2527+ }
2528+ } ) ;
2529+ }
2530+
25112531 return null ;
25122532}
25132533
@@ -2649,28 +2669,23 @@ function flushPassiveEffectsImpl() {
26492669 if ( enableTransitionTracing ) {
26502670 const prevPendingTransitionCallbacks = currentPendingTransitionCallbacks ;
26512671 const prevRootTransitionCallbacks = root . transitionCallbacks ;
2672+ const prevEndTime = currentEndTime ;
26522673 if (
26532674 prevPendingTransitionCallbacks !== null &&
26542675 prevRootTransitionCallbacks !== null
26552676 ) {
2656- // TODO(luna) Refactor this code into the Host Config
2657- // TODO(luna) The end time here is not necessarily accurate
2658- // because passive effects could be called before paint
2659- // (synchronously) or after paint (normally). We need
2660- // to come up with a way to get the correct end time for both cases.
2661- // One solution is in the host config, if the passive effects
2662- // have not yet been run, make a call to flush the passive effects
2663- // right after paint.
2664- const endTime = now ( ) ;
26652677 currentPendingTransitionCallbacks = null ;
2666-
2667- scheduleCallback ( IdleSchedulerPriority , ( ) =>
2668- processTransitionCallbacks (
2669- prevPendingTransitionCallbacks ,
2670- endTime ,
2671- prevRootTransitionCallbacks ,
2672- ) ,
2673- ) ;
2678+ currentEndTime = null ;
2679+
2680+ if ( prevEndTime !== null ) {
2681+ scheduleCallback ( IdleSchedulerPriority , ( ) =>
2682+ processTransitionCallbacks (
2683+ prevPendingTransitionCallbacks ,
2684+ prevEndTime ,
2685+ prevRootTransitionCallbacks ,
2686+ ) ,
2687+ ) ;
2688+ }
26742689 }
26752690 }
26762691
0 commit comments