Make guarded callback more local for before mutation phase

facebook · Jun 10, 2021 · 161be62 · 161be62
1 parent 45ba73b
commit 161be62
Showing 1 changed file with 41 additions and 20 deletions.
diff --git a/packages/react-reconciler/src/ReactFiberCommitWork.new.js b/packages/react-reconciler/src/ReactFiberCommitWork.new.js
@@ -342,6 +342,24 @@ function safelyCallDestroy(
   }
 }
 
+function safelyCallBeforeInstanceBlur(fiber: Fiber) {
+  if (__DEV__) {
+    setCurrentDebugFiberInDEV(fiber);
+    invokeGuardedCallback(null, beforeActiveInstanceBlur, null, fiber);
+    if (hasCaughtError()) {
+      const error = clearCaughtError();
+      captureCommitPhaseError(fiber, fiber.return, error);
+    }
+    resetCurrentDebugFiberInDEV();
+  } else {
+    try {
+      beforeActiveInstanceBlur(fiber);
+    } catch (error) {
+      captureCommitPhaseError(fiber, fiber.return, error);
+    }
+  }
+}
+
 let focusedInstanceHandle: null | Fiber = null;
 let shouldFireAfterActiveInstanceBlur: boolean = false;
 
@@ -395,6 +413,27 @@ function commitBeforeMutationEffects_begin() {
 function commitBeforeMutationEffects_complete() {
   while (nextEffect !== null) {
     const fiber = nextEffect;
+    const flags = fiber.flags;
+
+    if (enableCreateEventHandleAPI) {
+      if (
+        !shouldFireAfterActiveInstanceBlur &&
+        focusedInstanceHandle !== null
+      ) {
+        // Check to see if the focused element was inside of a hidden (Suspense) subtree.
+        // TODO: Move this out of the hot path using a dedicated effect tag.
+        if (
+          fiber.tag === SuspenseComponent &&
+          isSuspenseBoundaryBeingHidden(fiber.alternate, fiber) &&
+          doesFiberContain(fiber, focusedInstanceHandle)
+        ) {
+          shouldFireAfterActiveInstanceBlur = true;
+          safelyCallBeforeInstanceBlur(fiber);
+        }
+      }
+    }
+
+    if ((flags & Snapshot) !== NoFlags) {
       if (__DEV__) {
         setCurrentDebugFiberInDEV(fiber);
         invokeGuardedCallback(
@@ -415,6 +454,7 @@ function commitBeforeMutationEffects_complete() {
           captureCommitPhaseError(fiber, fiber.return, error);
         }
       }
+    }
 
     const sibling = fiber.sibling;
     if (sibling !== null) {
@@ -428,25 +468,6 @@ function commitBeforeMutationEffects_complete() {
 }
 
 function commitBeforeMutationEffectsOnFiber(finishedWork: Fiber) {
-  const current = finishedWork.alternate;
-  const flags = finishedWork.flags;
-
-  if (enableCreateEventHandleAPI) {
-    if (!shouldFireAfterActiveInstanceBlur && focusedInstanceHandle !== null) {
-      // Check to see if the focused element was inside of a hidden (Suspense) subtree.
-      // TODO: Move this out of the hot path using a dedicated effect tag.
-      if (
-        finishedWork.tag === SuspenseComponent &&
-        isSuspenseBoundaryBeingHidden(current, finishedWork) &&
-        doesFiberContain(finishedWork, focusedInstanceHandle)
-      ) {
-        shouldFireAfterActiveInstanceBlur = true;
-        beforeActiveInstanceBlur(finishedWork);
-      }
-    }
-  }
-
-  if ((flags & Snapshot) !== NoFlags) {
   setCurrentDebugFiberInDEV(finishedWork);
 
   switch (finishedWork.tag) {
@@ -456,6 +477,7 @@ function commitBeforeMutationEffectsOnFiber(finishedWork: Fiber) {
       break;
     }
     case ClassComponent: {
+      const current = finishedWork.alternate;
       if (current !== null) {
         const prevProps = current.memoizedProps;
         const prevState = current.memoizedState;
@@ -535,7 +557,6 @@ function commitBeforeMutationEffectsOnFiber(finishedWork: Fiber) {
 
   resetCurrentDebugFiberInDEV();
 }
-}
 
 function commitBeforeMutationEffectsDeletion(deletion: Fiber) {
   if (enableCreateEventHandleAPI) {