fix(core): Surface errors from ApplicationRef.tick to callsite (#60102)

atscott · AndrewKushnir · commit 338818ce8992 · 2025-03-10T08:17:14.000-07:00
This commit ensures that errors during `ApplicationRef.tick` are surfaced to the callsite rather than being caught and reported to the `ErrorHandler`. The current catch and report approach was originally added in e263e19 with the goal of preventing automatic change detection crashes due to the error happening in the subscription. However, this results in hiding a public API that can hide errors. Callers cannot assume that the tick was successful and perform follow-up work. This change now surfaces errors and adds the error handling directly to the callsites. BREAKING CHANGE: `ApplicationRef.tick` will no longer catch and report errors to the appplication `ErrorHandler`. Errors will instead be thrown out of the method and will allow callers to determine how to handle these errors, such as aborting follow-up work or reporting the error and continuing. PR Close #60102
diff --git a/packages/core/src/application/application_ref.ts b/packages/core/src/application/application_ref.ts
@@ -23,8 +23,8 @@ import {Injectable} from '../di/injectable';
 import {InjectionToken} from '../di/injection_token';
 import {Injector} from '../di/injector';
 import {EnvironmentInjector, type R3Injector} from '../di/r3_injector';
-import {ErrorHandler, INTERNAL_APPLICATION_ERROR_HANDLER} from '../error_handler';
 import {formatRuntimeError, RuntimeError, RuntimeErrorCode} from '../errors';
+import {ErrorHandler, INTERNAL_APPLICATION_ERROR_HANDLER} from '../error_handler';
 import {Type} from '../interface/type';
 import {ComponentFactory, ComponentRef} from '../linker/component_factory';
 import {ComponentFactoryResolver} from '../linker/component_factory_resolver';
@@ -603,9 +603,6 @@ export class ApplicationRef {
           view.checkNoChanges();
         }
       }
-    } catch (e) {
-      // Attention: Don't rethrow as it could cancel subscriptions to Observables!
-      this.internalErrorHandler(e);
     } finally {
       this._runningTick = false;
       this.tracingSnapshot?.dispose();
@@ -754,7 +751,11 @@ export class ApplicationRef {
 
   private _loadComponent(componentRef: ComponentRef<any>): void {
     this.attachView(componentRef.hostView);
-    this.tick();
+    try {
+      this.tick();
+    } catch (e) {
+      this.internalErrorHandler(e);
+    }
     this.components.push(componentRef);
     // Get the listeners lazily to prevent DI cycles.
     const listeners = this._injector.get(APP_BOOTSTRAP_LISTENER, []);
diff --git a/packages/core/src/change_detection/scheduling/ng_zone_scheduling.ts b/packages/core/src/change_detection/scheduling/ng_zone_scheduling.ts
@@ -31,13 +31,14 @@ import {
   SCHEDULE_IN_ROOT_ZONE,
 } from './zoneless_scheduling';
 import {SCHEDULE_IN_ROOT_ZONE_DEFAULT} from './flags';
-import {ErrorHandler, INTERNAL_APPLICATION_ERROR_HANDLER} from '../../error_handler';
+import {INTERNAL_APPLICATION_ERROR_HANDLER, ErrorHandler} from '../../error_handler';
 
 @Injectable({providedIn: 'root'})
 export class NgZoneChangeDetectionScheduler {
   private readonly zone = inject(NgZone);
   private readonly changeDetectionScheduler = inject(ChangeDetectionScheduler);
   private readonly applicationRef = inject(ApplicationRef);
+  private readonly applicationErrorHandler = inject(INTERNAL_APPLICATION_ERROR_HANDLER);
 
   private _onMicrotaskEmptySubscription?: Subscription;
 
@@ -55,7 +56,11 @@ export class NgZoneChangeDetectionScheduler {
           return;
         }
         this.zone.run(() => {
-          this.applicationRef.tick();
+          try {
+            this.applicationRef.tick();
+          } catch (e) {
+            this.applicationErrorHandler(e);
+          }
         });
       },
     });
diff --git a/packages/core/src/change_detection/scheduling/zoneless_scheduling_impl.ts b/packages/core/src/change_detection/scheduling/zoneless_scheduling_impl.ts
@@ -31,6 +31,7 @@ import {
   ZONELESS_SCHEDULER_DISABLED,
 } from './zoneless_scheduling';
 import {TracingService} from '../../application/tracing';
+import {INTERNAL_APPLICATION_ERROR_HANDLER} from '../../error_handler';
 
 const CONSECUTIVE_MICROTASK_NOTIFICATION_LIMIT = 100;
 let consecutiveMicrotaskNotifications = 0;
@@ -57,6 +58,7 @@ function trackMicrotaskNotificationForDebugging() {
 
 @Injectable({providedIn: 'root'})
 export class ChangeDetectionSchedulerImpl implements ChangeDetectionScheduler {
+  private readonly applicationErrorHandler = inject(INTERNAL_APPLICATION_ERROR_HANDLER);
   private readonly appRef = inject(ApplicationRef);
   private readonly taskService = inject(PendingTasksInternal);
   private readonly ngZone = inject(NgZone);
@@ -292,7 +294,7 @@ export class ChangeDetectionSchedulerImpl implements ChangeDetectionScheduler {
       );
     } catch (e: unknown) {
       this.taskService.remove(task);
-      throw e;
+      this.applicationErrorHandler(e);
     } finally {
       this.cleanup();
     }
diff --git a/packages/core/test/render3/reactivity_spec.ts b/packages/core/test/render3/reactivity_spec.ts
@@ -91,7 +91,7 @@ describe('reactivity', () => {
       expect(isStable).toEqual([true, false, true]);
     });
 
-    it('should propagate errors to the ErrorHandler', () => {
+    it('should propagate errors to the ErrorHandler', async () => {
       TestBed.configureTestingModule({
         providers: [{provide: ErrorHandler, useFactory: () => new FakeErrorHandler()}],
         rethrowApplicationErrors: false,
@@ -113,7 +113,7 @@ describe('reactivity', () => {
         },
         {injector: appRef.injector},
       );
-      appRef.tick();
+      await appRef.whenStable();
       expect(run).toBeTrue();
       expect(lastError.message).toBe('fail!');
     });
