@@ -83,6 +83,7 @@ import {
8383 supportsMicrotasks ,
8484 errorHydratingContainer ,
8585 scheduleMicrotask ,
86+ requestPostPaintCallback ,
8687} from './ReactFiberHostConfig' ;
8788
8889import {
@@ -360,6 +361,7 @@ export function getWorkInProgressTransitions() {
360361}
361362
362363let currentPendingTransitionCallbacks : PendingTransitionCallbacks | null = null ;
364+ let currentEndTime : number | null = null ;
363365
364366export function addTransitionStartCallbackToPendingTransition (
365367 transition : Transition ,
@@ -2639,6 +2641,26 @@ function commitRootImpl(
26392641 markCommitStopped ( ) ;
26402642 }
26412643
2644+ // if (enableTransitionTracing) {
2645+ const prevRootTransitionCallbacks = root . transitionCallbacks ;
2646+ if ( prevRootTransitionCallbacks !== null ) {
2647+ requestPostPaintCallback ( endTime => {
2648+ const prevPendingTransitionCallbacks = currentPendingTransitionCallbacks ;
2649+ if ( prevPendingTransitionCallbacks !== null ) {
2650+ scheduleCallback ( IdleSchedulerPriority , ( ) => {
2651+ processTransitionCallbacks (
2652+ prevPendingTransitionCallbacks ,
2653+ endTime ,
2654+ prevRootTransitionCallbacks ,
2655+ ) ;
2656+ } ) ;
2657+ } else {
2658+ currentEndTime = endTime ;
2659+ }
2660+ } ) ;
2661+ }
2662+ // }
2663+
26422664 return null ;
26432665}
26442666
@@ -2780,28 +2802,23 @@ function flushPassiveEffectsImpl() {
27802802 if ( enableTransitionTracing ) {
27812803 const prevPendingTransitionCallbacks = currentPendingTransitionCallbacks ;
27822804 const prevRootTransitionCallbacks = root . transitionCallbacks ;
2805+ const prevEndTime = currentEndTime ;
27832806 if (
27842807 prevPendingTransitionCallbacks !== null &&
27852808 prevRootTransitionCallbacks !== null
27862809 ) {
2787- // TODO(luna) Refactor this code into the Host Config
2788- // TODO(luna) The end time here is not necessarily accurate
2789- // because passive effects could be called before paint
2790- // (synchronously) or after paint (normally). We need
2791- // to come up with a way to get the correct end time for both cases.
2792- // One solution is in the host config, if the passive effects
2793- // have not yet been run, make a call to flush the passive effects
2794- // right after paint.
2795- const endTime = now ( ) ;
27962810 currentPendingTransitionCallbacks = null ;
2797-
2798- scheduleCallback ( IdleSchedulerPriority , ( ) =>
2799- processTransitionCallbacks (
2800- prevPendingTransitionCallbacks ,
2801- endTime ,
2802- prevRootTransitionCallbacks ,
2803- ) ,
2804- ) ;
2811+ currentEndTime = null ;
2812+
2813+ if ( prevEndTime !== null ) {
2814+ scheduleCallback ( IdleSchedulerPriority , ( ) =>
2815+ processTransitionCallbacks (
2816+ prevPendingTransitionCallbacks ,
2817+ prevEndTime ,
2818+ prevRootTransitionCallbacks ,
2819+ ) ,
2820+ ) ;
2821+ }
28052822 }
28062823 }
28072824
0 commit comments