fix(router): handle errors from view transition finished promise

arturovt · pkozlowski-opensource · commit b74a0693f240 · 2025-12-03T12:16:57.000+01:00
This commit adds a `.catch()` handler to `transition.finished` from `document.startViewTransition` to prevent unhandled promise rejections. The finished promise can reject with `TimeoutError` or `InvalidStateError` when transitions fail during or after the animation phase.

Based on the Blink source code, the `finished` promise can reject with:
* `TimeoutError`: "Transition was aborted because of timeout in DOM update"
* `InvalidStateError`: "Transition was aborted because of invalid state"

This may happen when the DOM update phase exceeds the browser's internal timeout threshold.
diff --git a/packages/router/src/utils/view_transition.ts b/packages/router/src/utils/view_transition.ts
@@ -99,6 +99,11 @@ export function createViewTransition(
       console.error(error);
     }
   });
+  transition.finished.catch((error) => {
+    if (typeof ngDevMode === 'undefined' || ngDevMode) {
+      console.error(error);
+    }
+  });
   const {onViewTransitionCreated} = transitionOptions;
   if (onViewTransitionCreated) {
     runInInjectionContext(injector, () => onViewTransitionCreated({transition, from, to}));
