angular · atscott · Aug 26, 2025 · Jul 8, 2025
diff --git a/...ools/projects/ng-devtools/src/lib/devtools-tabs/router-tree/router-tree.component.spec.ts b/...ools/projects/ng-devtools/src/lib/devtools-tabs/router-tree/router-tree.component.spec.ts
@@ -13,6 +13,7 @@ import SpyObj = jasmine.SpyObj;
 import {FrameManager} from '../../application-services/frame_manager';
 import {Events, MessageBus} from '../../../../../protocol';
 import {ApplicationOperations} from '../../application-operations';
+import {provideZoneChangeDetection} from '@angular/core';
 
 describe('RouterTreeComponent', () => {
   let messageBus: MessageBus<Events>;
@@ -32,6 +33,7 @@ describe('RouterTreeComponent', () => {
     await TestBed.configureTestingModule({
       imports: [RouterTreeComponent],
       providers: [
+        provideZoneChangeDetection(),
         {provide: ApplicationOperations, useValue: applicationOperationsSpy},
         {provide: MessageBus, useValue: messageBus},
         {provide: FrameManager, useValue: frameManager},

diff --git a/integration/cli-signal-inputs/src/app/greet.component.spec.ts b/integration/cli-signal-inputs/src/app/greet.component.spec.ts
@@ -11,6 +11,7 @@ describe('greet component', () => {
     expect(fixture.nativeElement.textContent).toBe('Initial - initial-unset');
 
     fixture.componentInstance.firstName = 'John';
+    fixture.changeDetectorRef.markForCheck();
     fixture.detectChanges();
 
     expect(fixture.nativeElement.textContent).toBe('John - initial-unset');

diff --git a/integration/cli-signal-inputs/src/main.ts b/integration/cli-signal-inputs/src/main.ts
@@ -1,7 +1,8 @@
+import {provideZoneChangeDetection} from '@angular/core';
 import {bootstrapApplication, provideProtractorTestingSupport} from '@angular/platform-browser';
 
 import {AppComponent} from './app/app.component';
 
 bootstrapApplication(AppComponent, {
-  providers: [provideProtractorTestingSupport()],
+  providers: [provideZoneChangeDetection(), provideProtractorTestingSupport()],
 });
diff --git a/integration/platform-server/projects/ngmodule/src/app/app.module.ts b/integration/platform-server/projects/ngmodule/src/app/app.module.ts
@@ -1,4 +1,4 @@
-import {NgModule} from '@angular/core';
+import {NgModule, provideZoneChangeDetection} from '@angular/core';
 import {
   BrowserModule,
   provideClientHydration,
@@ -11,7 +11,7 @@ import {AppComponent} from './app.component';
 @NgModule({
   declarations: [AppComponent],
   imports: [BrowserModule, AppRoutingModule],
-  providers: [provideClientHydration(withIncrementalHydration())],
+  providers: [provideZoneChangeDetection(), provideClientHydration(withIncrementalHydration())],
   bootstrap: [AppComponent],
 })
 export class AppModule {}
diff --git a/integration/platform-server/projects/standalone/src/app/app.config.ts b/integration/platform-server/projects/standalone/src/app/app.config.ts
@@ -4,9 +4,11 @@ import {provideClientHydration, withIncrementalHydration} from '@angular/platfor
 import {provideRouter} from '@angular/router';
 
 import {routes} from './app.routes';
+import {provideZoneChangeDetection} from '@angular/core';
 
 export const appConfig: ApplicationConfig = {
   providers: [
+    provideZoneChangeDetection(),
     provideRouter(routes),
     provideClientHydration(withIncrementalHydration()),
     provideHttpClient(),

diff --git a/modules/benchmarks/src/change_detection/transplanted_views/transplanted_views.ts b/modules/benchmarks/src/change_detection/transplanted_views/transplanted_views.ts
@@ -13,6 +13,7 @@ import {
   Component,
   Input,
   NgModule,
+  provideZoneChangeDetection,
   TemplateRef,
   ViewChild,
 } from '@angular/core';
@@ -67,6 +68,7 @@ export class DeclarationComponent {
 @NgModule({
   declarations: [DeclarationComponent, InsertionComponent],
   bootstrap: [DeclarationComponent],
+  providers: [provideZoneChangeDetection()],
   imports: [BrowserModule],
 })
 export class TransplantedViewsModule {}
diff --git a/modules/benchmarks/src/defer/baseline/main.ts b/modules/benchmarks/src/defer/baseline/main.ts
@@ -11,9 +11,10 @@ import {bootstrapApplication, provideProtractorTestingSupport} from '@angular/pl
 import {init, syncUrlParamsToForm} from '../init';
 
 import {AppComponent} from './app.component';
+import {provideZoneChangeDetection} from '@angular/core';
 
 syncUrlParamsToForm();
 
 bootstrapApplication(AppComponent, {
-  providers: [provideProtractorTestingSupport()],
+  providers: [provideZoneChangeDetection(), provideProtractorTestingSupport()],
 }).then(init);
diff --git a/modules/benchmarks/src/defer/main/main.ts b/modules/benchmarks/src/defer/main/main.ts
@@ -7,6 +7,7 @@
  */
 
 import {bootstrapApplication, provideProtractorTestingSupport} from '@angular/platform-browser';
+import {provideZoneChangeDetection} from '@angular/core';
 
 import {init, syncUrlParamsToForm} from '../init';
 
@@ -15,5 +16,5 @@ import {AppComponent} from './app.component';
 syncUrlParamsToForm();
 
 bootstrapApplication(AppComponent, {
-  providers: [provideProtractorTestingSupport()],
+  providers: [provideZoneChangeDetection(), provideProtractorTestingSupport()],
 }).then(init);
diff --git a/modules/benchmarks/src/largeform/ng2/app.ts b/modules/benchmarks/src/largeform/ng2/app.ts
@@ -6,7 +6,7 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 
-import {Component, NgModule} from '@angular/core';
+import {Component, NgModule, provideZoneChangeDetection} from '@angular/core';
 import {FormsModule} from '@angular/forms';
 import {BrowserModule} from '@angular/platform-browser';
 
@@ -87,5 +87,6 @@ export class AppComponent {
   imports: [BrowserModule, FormsModule],
   bootstrap: [AppComponent],
   declarations: [AppComponent],
+  providers: [provideZoneChangeDetection()],
 })
 export class AppModule {}
diff --git a/modules/benchmarks/src/largetable/ng2/main.ts b/modules/benchmarks/src/largetable/ng2/main.ts
@@ -6,11 +6,13 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 
-import {enableProdMode} from '@angular/core';
+import {enableProdMode, provideZoneChangeDetection} from '@angular/core';
 import {bootstrapApplication} from '@angular/platform-browser';
 
 import {init} from './init';
 import {TableComponent} from './table';
 
 enableProdMode();
-bootstrapApplication(TableComponent).then(init);
+bootstrapApplication(TableComponent, {
+  providers: [provideZoneChangeDetection()],
+}).then(init);
diff --git a/modules/benchmarks/src/largetable/ng2_switch/table.ts b/modules/benchmarks/src/largetable/ng2_switch/table.ts
@@ -6,7 +6,7 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 
-import {Component, Input, NgModule} from '@angular/core';
+import {Component, Input, NgModule, provideZoneChangeDetection} from '@angular/core';
 import {BrowserModule} from '@angular/platform-browser';
 
 import {emptyTable, TableCell} from '../util';
@@ -35,5 +35,10 @@ export class TableComponent {
   }
 }
 
-@NgModule({imports: [BrowserModule], bootstrap: [TableComponent], declarations: [TableComponent]})
+@NgModule({
+  imports: [BrowserModule],
+  bootstrap: [TableComponent],
+  providers: [provideZoneChangeDetection()],
+  declarations: [TableComponent],
+})
 export class AppModule {}
diff --git a/modules/benchmarks/src/tree/ng2/tree.ts b/modules/benchmarks/src/tree/ng2/tree.ts
@@ -6,7 +6,7 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 
-import {Component, NgModule} from '@angular/core';
+import {Component, NgModule, provideZoneChangeDetection} from '@angular/core';
 import {BrowserModule, DomSanitizer, SafeStyle} from '@angular/platform-browser';
 
 import {emptyTree, TreeNode} from '../util';
@@ -29,7 +29,12 @@ export class TreeComponent {
   }
 }
 
-@NgModule({imports: [BrowserModule], bootstrap: [TreeComponent], declarations: [TreeComponent]})
+@NgModule({
+  imports: [BrowserModule],
+  providers: [provideZoneChangeDetection()],
+  bootstrap: [TreeComponent],
+  declarations: [TreeComponent],
+})
 export class AppModule {
   constructor(sanitizer: DomSanitizer) {
     trustedEmptyColor = sanitizer.bypassSecurityTrustStyle('');

diff --git a/modules/benchmarks/src/tree/ng2_static/tree.ts b/modules/benchmarks/src/tree/ng2_static/tree.ts
@@ -6,7 +6,7 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 
-import {Component, Input, NgModule} from '@angular/core';
+import {Component, Input, NgModule, provideZoneChangeDetection} from '@angular/core';
 import {BrowserModule, DomSanitizer, SafeStyle} from '@angular/platform-browser';
 
 import {emptyTree, getMaxDepth, TreeNode} from '../util';
@@ -57,6 +57,7 @@ export function createAppModule(): any {
     imports: [BrowserModule],
     bootstrap: [RootTreeComponent],
     declarations: [components],
+    providers: [provideZoneChangeDetection()],
     jit: true,
   })
   class AppModule {

diff --git a/modules/benchmarks/src/tree/ng2_switch/tree.ts b/modules/benchmarks/src/tree/ng2_switch/tree.ts
@@ -6,7 +6,7 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 
-import {Component, Input, NgModule} from '@angular/core';
+import {Component, Input, NgModule, provideZoneChangeDetection} from '@angular/core';
 import {BrowserModule} from '@angular/platform-browser';
 
 import {emptyTree, TreeNode} from '../util';
@@ -29,5 +29,6 @@ export class TreeComponent {
   imports: [BrowserModule],
   bootstrap: [TreeComponent],
   declarations: [TreeComponent],
+  providers: [provideZoneChangeDetection()],
 })
 export class AppModule {}
diff --git a/modules/playground/src/async/main.ts b/modules/playground/src/async/main.ts
@@ -6,7 +6,7 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 
-import {Component, NgModule} from '@angular/core';
+import {Component, NgModule, provideZoneChangeDetection} from '@angular/core';
 import {BrowserModule, platformBrowser} from '@angular/platform-browser';
 
 @Component({
@@ -114,6 +114,7 @@ class AsyncApplication {
   declarations: [AsyncApplication],
   bootstrap: [AsyncApplication],
   imports: [BrowserModule],
+  providers: [provideZoneChangeDetection()],
 })
 class ExampleModule {}
 

diff --git a/modules/playground/src/http/main.ts b/modules/playground/src/http/main.ts
@@ -7,7 +7,7 @@
  */
 
 import {HttpClientModule} from '@angular/common/http';
-import {NgModule} from '@angular/core';
+import {NgModule, provideZoneChangeDetection} from '@angular/core';
 import {BrowserModule, platformBrowser} from '@angular/platform-browser';
 
 import {HttpCmp} from './app/http_comp';
@@ -16,6 +16,7 @@ import {HttpCmp} from './app/http_comp';
   declarations: [HttpCmp],
   bootstrap: [HttpCmp],
   imports: [BrowserModule, HttpClientModule],
+  providers: [provideZoneChangeDetection()],
 })
 export class ExampleModule {}
 

diff --git a/modules/playground/src/jsonp/main.ts b/modules/playground/src/jsonp/main.ts
@@ -7,7 +7,7 @@
  */
 
 import {HttpClientJsonpModule, HttpClientModule} from '@angular/common/http';
-import {NgModule} from '@angular/core';
+import {NgModule, provideZoneChangeDetection} from '@angular/core';
 import {BrowserModule, platformBrowser} from '@angular/platform-browser';
 
 import {JsonpCmp} from './app/jsonp_comp';
@@ -16,6 +16,7 @@ import {JsonpCmp} from './app/jsonp_comp';
   bootstrap: [JsonpCmp],
   declarations: [JsonpCmp],
   imports: [BrowserModule, HttpClientModule, HttpClientJsonpModule],
+  providers: [provideZoneChangeDetection()],
 })
 export class ExampleModule {}
 

diff --git a/packages/common/test/directives/ng_class_spec.ts b/packages/common/test/directives/ng_class_spec.ts
@@ -18,6 +18,7 @@ describe('binding to CSS class list', () => {
   }
 
   function detectChangesAndExpectClassName(classes: string): void {
+    fixture?.changeDetectorRef.markForCheck();
     fixture!.detectChanges();
     let nonNormalizedClassName = fixture!.debugElement.children[0].nativeElement.className;
     expect(normalizeClassNames(nonNormalizedClassName)).toEqual(normalizeClassNames(classes));
@@ -395,8 +396,10 @@ describe('binding to CSS class list', () => {
       detectChangesAndExpectClassName('');
 
       fixture.componentInstance.condition = false;
+      fixture.changeDetectorRef.markForCheck();
       fixture.detectChanges();
       fixture.componentInstance.condition = true;
+      fixture.changeDetectorRef.markForCheck();
       detectChangesAndExpectClassName('color-red');
     });
 
@@ -478,6 +481,7 @@ describe('binding to CSS class list', () => {
       expect(fixture.nativeElement.firstChild.className).toBe('option-1');
 
       fixture.componentInstance.level = 5;
+      fixture.changeDetectorRef.markForCheck();
       fixture.detectChanges();
       expect(fixture.nativeElement.firstChild.className).toBe('option-5');
     });