Add try/catch to places used to be covered by commitDeletionEffects

Author: sebmarkbage

packages/react-reconciler/src/ReactFiberCommitHostEffects.js

@@ -45,6 +45,8 @@ import {
   unhideTextInstance,
   commitHydratedContainer,
   commitHydratedSuspenseInstance,
+  removeChildFromContainer,
+  removeChild,
 } from './ReactFiberConfig';
 import {captureCommitPhaseError} from './ReactFiberWorkLoop';
 
@@ -334,6 +336,32 @@ export function commitHostPlacement(finishedWork: Fiber) {
   }
 }
 
+export function commitHostRemoveChildFromContainer(
+  deletedFiber: Fiber,
+  nearestMountedAncestor: Fiber,
+  parentContainer: Container,
+  hostInstance: Instance | TextInstance,
+) {
+  try {
+    removeChildFromContainer(parentContainer, hostInstance);
+  } catch (error) {
+    captureCommitPhaseError(deletedFiber, nearestMountedAncestor, error);
+  }
+}
+
+export function commitHostRemoveChild(
+  deletedFiber: Fiber,
+  nearestMountedAncestor: Fiber,
+  parentInstance: Instance,
+  hostInstance: Instance | TextInstance,
+) {
+  try {
+    removeChild(parentInstance, hostInstance);
+  } catch (error) {
+    captureCommitPhaseError(deletedFiber, nearestMountedAncestor, error);
+  }
+}
+
 export function commitHostRootContainerChildren(
   root: FiberRoot,
   finishedWork: Fiber,

packages/react-reconciler/src/ReactFiberCommitWork.js

@@ -114,8 +114,6 @@ import {
   supportsHydration,
   supportsResources,
   supportsSingletons,
-  removeChild,
-  removeChildFromContainer,
   clearSuspenseBoundary,
   clearSuspenseBoundaryFromContainer,
   replaceContainerChildren,
@@ -212,6 +210,8 @@ import {
   commitHostPortalContainerChildren,
   commitHostHydratedContainer,
   commitHostHydratedSuspense,
+  commitHostRemoveChildFromContainer,
+  commitHostRemoveChild,
 } from './ReactFiberCommitHostEffects';
 
 // Used during the commit phase to track the state of the Offscreen component stack.
@@ -1249,12 +1249,16 @@ function commitDeletionEffectsOnFiber(
           // Now that all the child effects have unmounted, we can remove the
           // node from the tree.
           if (hostParentIsContainer) {
-            removeChildFromContainer(
+            commitHostRemoveChildFromContainer(
+              deletedFiber,
+              nearestMountedAncestor,
               ((hostParent: any): Container),
               (deletedFiber.stateNode: Instance | TextInstance),
             );
           } else {
-            removeChild(
+            commitHostRemoveChild(
+              deletedFiber,
+              nearestMountedAncestor,
               ((hostParent: any): Instance),
               (deletedFiber.stateNode: Instance | TextInstance),
             );
@@ -1273,9 +1277,17 @@ function commitDeletionEffectsOnFiber(
       if (enableSuspenseCallback) {
         const hydrationCallbacks = finishedRoot.hydrationCallbacks;
         if (hydrationCallbacks !== null) {
-          const onDeleted = hydrationCallbacks.onDeleted;
-          if (onDeleted) {
-            onDeleted((deletedFiber.stateNode: SuspenseInstance));
+          try {
+            const onDeleted = hydrationCallbacks.onDeleted;
+            if (onDeleted) {
+              onDeleted((deletedFiber.stateNode: SuspenseInstance));
+            }
+          } catch (error) {
+            captureCommitPhaseError(
+              deletedFiber,
+              nearestMountedAncestor,
+              error,
+            );
           }
         }
       }