test(multiple): Update test initializer to provide zoneless (#29043)

package.json

@@ -56,12 +56,12 @@
   },
   "version": "18.0.0-rc.1",
   "dependencies": {
-    "@angular/animations": "^18.0.0-rc.0",
-    "@angular/common": "^18.0.0-rc.0",
-    "@angular/compiler": "^18.0.0-rc.0",
-    "@angular/core": "^18.0.0-rc.0",
-    "@angular/forms": "^18.0.0-rc.0",
-    "@angular/platform-browser": "^18.0.0-rc.0",
+    "@angular/animations": "^18.0.0-rc.2",
+    "@angular/common": "^18.0.0-rc.2",
+    "@angular/compiler": "^18.0.0-rc.2",
+    "@angular/core": "^18.0.0-rc.2",
+    "@angular/forms": "^18.0.0-rc.2",
+    "@angular/platform-browser": "^18.0.0-rc.2",
     "@types/google.maps": "^3.54.10",
     "@types/youtube": "^0.0.50",
     "rxjs": "^6.6.7",
@@ -76,12 +76,12 @@
     "@angular/bazel": "https://github.com/angular/bazel-builds.git#bac9c1abe1e6ac1801fbbccb53353a1ed7126469",
     "@angular/build-tooling": "https://github.com/angular/dev-infra-private-build-tooling-builds.git#a11e93b01708684827af3873e9232b437c209237",
     "@angular/cli": "^18.0.0-rc.0",
-    "@angular/compiler-cli": "^18.0.0-rc.0",
-    "@angular/localize": "^18.0.0-rc.0",
+    "@angular/compiler-cli": "^18.0.0-rc.2",
+    "@angular/localize": "^18.0.0-rc.2",
     "@angular/ng-dev": "https://github.com/angular/dev-infra-private-ng-dev-builds.git#36946be4df61f6549ae3829c026022e47674eae2",
-    "@angular/platform-browser-dynamic": "^18.0.0-rc.0",
-    "@angular/platform-server": "^18.0.0-rc.0",
-    "@angular/router": "^18.0.0-rc.0",
+    "@angular/platform-browser-dynamic": "^18.0.0-rc.2",
+    "@angular/platform-server": "^18.0.0-rc.2",
+    "@angular/router": "^18.0.0-rc.2",
     "@babel/core": "^7.16.12",
     "@babel/helper-explode-assignable-expression": "^7.18.6",
     "@babel/helper-string-parser": "^7.22.5",

src/cdk-experimental/combobox/combobox.spec.ts

@@ -1,4 +1,11 @@
-import {Component, DebugElement, ElementRef, ViewChild} from '@angular/core';
+import {
+  Component,
+  DebugElement,
+  ElementRef,
+  ViewChild,
+  provideZoneChangeDetection,
+  signal,
+} from '@angular/core';
 import {ComponentFixture, TestBed, waitForAsync} from '@angular/core/testing';
 import {By} from '@angular/platform-browser';
 import {CdkComboboxModule} from './combobox-module';
@@ -25,6 +32,7 @@ describe('Combobox', () => {
 
     beforeEach(waitForAsync(() => {
       TestBed.configureTestingModule({
+        providers: [provideZoneChangeDetection()],
         imports: [CdkComboboxModule, ComboboxToggle],
       }).compileComponents();
     }));
@@ -83,7 +91,7 @@ describe('Combobox', () => {
 
     it('should toggle focus upon toggling the panel', () => {
       comboboxElement.focus();
-      testComponent.actions = 'toggle';
+      testComponent.actions.set('toggle');
       fixture.detectChanges();
 
       expect(document.activeElement).toEqual(comboboxElement);
@@ -209,7 +217,7 @@ describe('Combobox', () => {
     });
 
     it('should coerce actions separated by space', () => {
-      testComponent.actions = 'focus click';
+      testComponent.actions.set('focus click');
       fixture.detectChanges();
 
       const openActions = comboboxInstance.openActions;
@@ -219,7 +227,7 @@ describe('Combobox', () => {
     });
 
     it('should coerce actions separated by comma', () => {
-      testComponent.actions = 'focus,click,downKey';
+      testComponent.actions.set('focus,click,downKey');
       fixture.detectChanges();
 
       const openActions = comboboxInstance.openActions;
@@ -230,7 +238,7 @@ describe('Combobox', () => {
     });
 
     it('should coerce actions separated by commas and spaces', () => {
-      testComponent.actions = 'focus click,downKey';
+      testComponent.actions.set('focus click,downKey');
       fixture.detectChanges();
 
       const openActions = comboboxInstance.openActions;
@@ -241,10 +249,10 @@ describe('Combobox', () => {
     });
 
     it('should throw error when given invalid open action', () => {
-      expect(() => {
-        testComponent.actions = 'invalidAction';
-        fixture.detectChanges();
-      }).toThrow();
+      const errorSpy = spyOn(console, 'error');
+      testComponent.actions.set('invalidAction');
+      fixture.detectChanges();
+      expect(errorSpy).toHaveBeenCalled();
     });
   });
 
@@ -274,7 +282,7 @@ describe('Combobox', () => {
     });
 
     it('should open panel with focus open action', () => {
-      testComponent.actions = 'focus';
+      testComponent.actions.set('focus');
       fixture.detectChanges();
 
       expect(comboboxInstance.isOpen()).toBeFalse();
@@ -286,7 +294,7 @@ describe('Combobox', () => {
     });
 
     it('should open panel with click open action', () => {
-      testComponent.actions = 'click';
+      testComponent.actions.set('click');
       fixture.detectChanges();
 
       expect(comboboxInstance.isOpen()).toBeFalse();
@@ -298,7 +306,7 @@ describe('Combobox', () => {
     });
 
     it('should open panel with downKey open action', () => {
-      testComponent.actions = 'downKey';
+      testComponent.actions.set('downKey');
       fixture.detectChanges();
 
       expect(comboboxInstance.isOpen()).toBeFalse();
@@ -310,7 +318,7 @@ describe('Combobox', () => {
     });
 
     it('should toggle panel with toggle open action', () => {
-      testComponent.actions = 'toggle';
+      testComponent.actions.set('toggle');
       fixture.detectChanges();
 
       expect(comboboxInstance.isOpen()).toBeFalse();
@@ -327,7 +335,7 @@ describe('Combobox', () => {
     });
 
     it('should close panel on escape key', () => {
-      testComponent.actions = 'click';
+      testComponent.actions.set('click');
       fixture.detectChanges();
 
       expect(comboboxInstance.isOpen()).toBeFalse();
@@ -344,7 +352,7 @@ describe('Combobox', () => {
     });
 
     it('should handle multiple open actions', () => {
-      testComponent.actions = 'click downKey';
+      testComponent.actions.set('click downKey');
       fixture.detectChanges();
 
       expect(comboboxInstance.isOpen()).toBeFalse();
@@ -371,7 +379,7 @@ describe('Combobox', () => {
   template: `
   <button cdkCombobox #toggleCombobox="cdkCombobox" class="example-combobox"
           [cdkComboboxTriggerFor]="panel"
-          [openActions]="actions">
+          [openActions]="actions()">
     No Value
   </button>
   <div id="other-content"></div>
@@ -388,5 +396,5 @@ describe('Combobox', () => {
 class ComboboxToggle {
   @ViewChild('input') inputElement: ElementRef<HTMLInputElement>;
 
-  actions: string = 'click';
+  actions = signal('click');
 }

src/cdk-experimental/popover-edit/popover-edit.spec.ts

@@ -3,7 +3,13 @@ import {LEFT_ARROW, UP_ARROW, RIGHT_ARROW, DOWN_ARROW, TAB} from '@angular/cdk/k
 import {CdkTableModule} from '@angular/cdk/table';
 import {dispatchKeyboardEvent} from '@angular/cdk/testing/private';
 import {CommonModule} from '@angular/common';
-import {Component, Directive, ElementRef, ViewChild} from '@angular/core';
+import {
+  Component,
+  Directive,
+  ElementRef,
+  ViewChild,
+  provideZoneChangeDetection,
+} from '@angular/core';
 import {ComponentFixture, fakeAsync, flush, TestBed, tick} from '@angular/core/testing';
 import {FormsModule, NgForm} from '@angular/forms';
 import {BidiModule, Direction} from '@angular/cdk/bidi';
@@ -382,6 +388,7 @@ describe('CDK Popover Edit', () => {
       beforeEach(fakeAsync(() => {
         TestBed.configureTestingModule({
           imports: [CdkTableModule, CdkPopoverEditModule, CommonModule, FormsModule, BidiModule],
+          providers: [provideZoneChangeDetection()],
           declarations: [componentClass],
         }).compileComponents();
         fixture = TestBed.createComponent<BaseTestComponent>(componentClass);

src/cdk-experimental/scrolling/virtual-scroll-viewport.spec.ts

@@ -49,7 +49,9 @@ describe('CdkVirtualScrollViewport', () => {
     it('should throw if maxBufferPx is less than minBufferPx', fakeAsync(() => {
       testComponent.minBufferPx = 100;
       testComponent.maxBufferPx = 99;
-      expect(() => finishInit(fixture)).toThrow();
+      const errorSpy = spyOn(console, 'error');
+      finishInit(fixture);
+      expect(errorSpy).toHaveBeenCalled();
     }));
 
     // TODO(mmalerba): Add test that it corrects the initial render if it didn't render enough,

src/cdk-experimental/table-scroll-container/table-scroll-container.spec.ts

@@ -1,5 +1,5 @@
 import {CollectionViewer, DataSource} from '@angular/cdk/collections';
-import {Component, Type, ViewChild} from '@angular/core';
+import {Component, Type, ViewChild, provideZoneChangeDetection} from '@angular/core';
 import {ComponentFixture, TestBed, waitForAsync} from '@angular/core/testing';
 import {BehaviorSubject, combineLatest} from 'rxjs';
 import {map} from 'rxjs/operators';
@@ -23,6 +23,7 @@ describe('CdkTableScrollContainer', () => {
     declarations: any[] = [],
   ): ComponentFixture<T> {
     TestBed.configureTestingModule({
+      providers: [provideZoneChangeDetection()],
       imports: [CdkTableModule, CdkTableScrollContainerModule, componentType, ...declarations],
     }).compileComponents();
 

src/cdk/a11y/focus-monitor/focus-monitor.spec.ts

@@ -8,7 +8,7 @@ import {
   dispatchEvent,
 } from '../../testing/private';
 import {DOCUMENT} from '@angular/common';
-import {Component, NgZone, ViewChild} from '@angular/core';
+import {Component, NgZone, ViewChild, provideZoneChangeDetection} from '@angular/core';
 import {ComponentFixture, fakeAsync, flush, inject, TestBed, tick} from '@angular/core/testing';
 import {By} from '@angular/platform-browser';
 import {Platform} from '@angular/cdk/platform';
@@ -826,7 +826,7 @@ describe('FocusMonitor observable stream', () => {
     fakePlatform = {isBrowser: true} as Platform;
     TestBed.configureTestingModule({
       imports: [A11yModule, PlainButton],
-      providers: [{provide: Platform, useValue: fakePlatform}],
+      providers: [{provide: Platform, useValue: fakePlatform}, provideZoneChangeDetection()],
     }).compileComponents();
   });
 

src/cdk/a11y/focus-trap/focus-trap.spec.ts

@@ -5,6 +5,7 @@ import {
   TemplateRef,
   ViewContainerRef,
   ViewEncapsulation,
+  provideZoneChangeDetection,
 } from '@angular/core';
 import {waitForAsync, ComponentFixture, TestBed} from '@angular/core/testing';
 import {PortalModule, CdkPortalOutlet, TemplatePortal} from '@angular/cdk/portal';
@@ -14,6 +15,7 @@ import {By} from '@angular/platform-browser';
 describe('FocusTrap', () => {
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
+      providers: [provideZoneChangeDetection()],
       imports: [
         A11yModule,
         PortalModule,

src/cdk/a11y/live-announcer/live-announcer.spec.ts

@@ -1,7 +1,7 @@
 import {MutationObserverFactory} from '@angular/cdk/observers';
 import {Overlay} from '@angular/cdk/overlay';
 import {ComponentPortal} from '@angular/cdk/portal';
-import {Component} from '@angular/core';
+import {Component, provideZoneChangeDetection} from '@angular/core';
 import {ComponentFixture, fakeAsync, flush, inject, TestBed, tick} from '@angular/core/testing';
 import {By} from '@angular/platform-browser';
 import {A11yModule} from '../index';
@@ -21,6 +21,7 @@ describe('LiveAnnouncer', () => {
   describe('with default element', () => {
     beforeEach(() =>
       TestBed.configureTestingModule({
+        providers: [provideZoneChangeDetection()],
         imports: [A11yModule, TestApp, TestModal],
       }),
     );
@@ -127,6 +128,7 @@ describe('LiveAnnouncer', () => {
       fixture.destroy();
 
       TestBed.resetTestingModule().configureTestingModule({
+        providers: [provideZoneChangeDetection()],
         imports: [A11yModule],
       });
 
@@ -225,7 +227,10 @@ describe('LiveAnnouncer', () => {
 
       return TestBed.configureTestingModule({
         imports: [A11yModule, TestApp],
-        providers: [{provide: LIVE_ANNOUNCER_ELEMENT_TOKEN, useValue: customLiveElement}],
+        providers: [
+          provideZoneChangeDetection(),
+          {provide: LIVE_ANNOUNCER_ELEMENT_TOKEN, useValue: customLiveElement},
+        ],
       });
     });
 
@@ -249,6 +254,7 @@ describe('LiveAnnouncer', () => {
       return TestBed.configureTestingModule({
         imports: [A11yModule, TestApp],
         providers: [
+          provideZoneChangeDetection(),
           {
             provide: LIVE_ANNOUNCER_DEFAULT_OPTIONS,
             useValue: {
@@ -297,6 +303,7 @@ describe('CdkAriaLive', () => {
     TestBed.configureTestingModule({
       imports: [A11yModule, DivWithCdkAriaLive],
       providers: [
+        provideZoneChangeDetection(),
         {
           provide: MutationObserverFactory,
           useValue: {

src/cdk/bidi/directionality.spec.ts

@@ -1,5 +1,5 @@
 import {waitForAsync, fakeAsync, TestBed} from '@angular/core/testing';
-import {Component, ViewChild} from '@angular/core';
+import {Component, ViewChild, signal} from '@angular/core';
 import {By} from '@angular/platform-browser';
 import {BidiModule, Directionality, Dir, Direction, DIR_DOCUMENT} from './index';
 
@@ -102,7 +102,7 @@ describe('Directionality', () => {
       expect(injectedDirectionality.value).toBe('rtl');
       expect(fixture.componentInstance.changeCount).toBe(0);
 
-      fixture.componentInstance.direction = 'ltr';
+      fixture.componentInstance.direction.set('ltr');
 
       fixture.detectChanges();
 
@@ -129,7 +129,7 @@ describe('Directionality', () => {
       fixture.detectChanges();
       expect(fixture.componentInstance.dir.value).toBe('rtl');
 
-      fixture.componentInstance.direction = 'not-valid';
+      fixture.componentInstance.direction.set('not-valid');
       fixture.detectChanges();
       expect(fixture.componentInstance.dir.value).toBe('ltr');
     });
@@ -170,7 +170,7 @@ class InjectsDirectionality {
 
 @Component({
   template: `
-    <div [dir]="direction" (dirChange)="changeCount = changeCount + 1">
+    <div [dir]="direction()" (dirChange)="changeCount = changeCount + 1">
       <injects-directionality></injects-directionality>
     </div>
   `,
@@ -179,7 +179,7 @@ class InjectsDirectionality {
 })
 class ElementWithDir {
   @ViewChild(Dir) dir: Dir;
-  direction = 'rtl';
+  direction = signal('rtl');
   changeCount = 0;
 }
 

src/cdk/clipboard/copy-to-clipboard.spec.ts

@@ -1,4 +1,4 @@
-import {Component} from '@angular/core';
+import {Component, provideZoneChangeDetection} from '@angular/core';
 import {ComponentFixture, fakeAsync, TestBed, tick} from '@angular/core/testing';
 
 import {Clipboard} from './clipboard';
@@ -30,6 +30,7 @@ describe('CdkCopyToClipboard', () => {
   beforeEach(fakeAsync(() => {
     TestBed.configureTestingModule({
       imports: [ClipboardModule, CopyToClipboardHost],
+      providers: [provideZoneChangeDetection()],
     });
 
     TestBed.compileComponents();

src/cdk/drag-drop/directives/drag.spec.ts

@@ -21,6 +21,7 @@ import {
   ViewChild,
   ViewChildren,
   ViewEncapsulation,
+  provideZoneChangeDetection,
 } from '@angular/core';
 import {TestBed, ComponentFixture, fakeAsync, flush, tick} from '@angular/core/testing';
 import {ViewportRuler, CdkScrollableModule} from '@angular/cdk/scrolling';
@@ -53,6 +54,7 @@ describe('CdkDrag', () => {
     TestBed.configureTestingModule({
       imports: [DragDropModule, CdkScrollableModule],
       providers: [
+        provideZoneChangeDetection(),
         {
           provide: CDK_DRAG_CONFIG,
           useValue: {