refactor: debugElement.query is nullable

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

@@ -574,7 +574,8 @@ describe('Dialog', () => {
   it('should set the proper animation states', () => {
     let dialogRef = dialog.openFromComponent(PizzaMsg, { viewContainerRef: testViewContainerRef });
     let dialogContainer: CdkDialogContainer =
-        viewContainerFixture.debugElement.query(By.directive(CdkDialogContainer)).componentInstance;
+        viewContainerFixture.debugElement.query(By.directive(CdkDialogContainer))!
+        .componentInstance;
 
     expect(dialogContainer._state).toBe('enter');
 

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

@@ -31,7 +31,7 @@ describe('FocusMonitor', () => {
     fixture = TestBed.createComponent(PlainButton);
     fixture.detectChanges();
 
-    buttonElement = fixture.debugElement.query(By.css('button')).nativeElement;
+    buttonElement = fixture.debugElement.query(By.css('button'))!.nativeElement;
     focusMonitor = fm;
 
     changeHandler = jasmine.createSpy('focus origin change handler');
@@ -264,7 +264,7 @@ describe('cdkMonitorFocus', () => {
       fixture.detectChanges();
 
       spyOn(fixture.componentInstance, 'focusChanged');
-      buttonElement = fixture.debugElement.query(By.css('button')).nativeElement;
+      buttonElement = fixture.debugElement.query(By.css('button'))!.nativeElement;
       patchElementFocus(buttonElement);
     });
 
@@ -362,8 +362,8 @@ describe('cdkMonitorFocus', () => {
       fixture = TestBed.createComponent(ComplexComponentWithMonitorElementFocus);
       fixture.detectChanges();
 
-      parentElement = fixture.debugElement.query(By.css('div')).nativeElement;
-      childElement = fixture.debugElement.query(By.css('button')).nativeElement;
+      parentElement = fixture.debugElement.query(By.css('div'))!.nativeElement;
+      childElement = fixture.debugElement.query(By.css('button'))!.nativeElement;
 
       patchElementFocus(parentElement);
       patchElementFocus(childElement);
@@ -395,8 +395,8 @@ describe('cdkMonitorFocus', () => {
       fixture = TestBed.createComponent(ComplexComponentWithMonitorSubtreeFocus);
       fixture.detectChanges();
 
-      parentElement = fixture.debugElement.query(By.css('div')).nativeElement;
-      childElement = fixture.debugElement.query(By.css('button')).nativeElement;
+      parentElement = fixture.debugElement.query(By.css('div'))!.nativeElement;
+      childElement = fixture.debugElement.query(By.css('button'))!.nativeElement;
 
       patchElementFocus(parentElement);
       patchElementFocus(childElement);
@@ -431,8 +431,8 @@ describe('cdkMonitorFocus', () => {
           TestBed.createComponent(ComplexComponentWithMonitorSubtreeFocusAndMonitorElementFocus);
       fixture.detectChanges();
 
-      parentElement = fixture.debugElement.query(By.css('div')).nativeElement;
-      childElement = fixture.debugElement.query(By.css('button')).nativeElement;
+      parentElement = fixture.debugElement.query(By.css('div'))!.nativeElement;
+      childElement = fixture.debugElement.query(By.css('button'))!.nativeElement;
 
       patchElementFocus(parentElement);
       patchElementFocus(childElement);

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

@@ -35,7 +35,7 @@ describe('LiveAnnouncer', () => {
     });
 
     it('should correctly update the announce text', fakeAsync(() => {
-      let buttonElement = fixture.debugElement.query(By.css('button')).nativeElement;
+      let buttonElement = fixture.debugElement.query(By.css('button'))!.nativeElement;
       buttonElement.click();
 
       // This flushes our 100ms timeout for the screenreaders.

src/cdk/accordion/accordion-item.spec.ts

@@ -27,7 +27,7 @@ describe('CdkAccordionItem', () => {
     beforeEach(() => {
       fixture = TestBed.createComponent(SingleItem);
       item = fixture.debugElement
-        .query(By.directive(CdkAccordionItem))
+        .query(By.directive(CdkAccordionItem))!
         .injector.get<CdkAccordionItem>(CdkAccordionItem);
     });
 

src/cdk/bidi/directionality.spec.ts

@@ -75,7 +75,7 @@ describe('Directionality', () => {
     it('should provide itself as Directionality', () => {
       const fixture = TestBed.createComponent(ElementWithDir);
       const injectedDirectionality =
-        fixture.debugElement.query(By.directive(InjectsDirectionality)).componentInstance.dir;
+        fixture.debugElement.query(By.directive(InjectsDirectionality))!.componentInstance.dir;
 
       fixture.detectChanges();
 
@@ -85,7 +85,7 @@ describe('Directionality', () => {
     it('should emit a change event when the value changes', fakeAsync(() => {
       const fixture = TestBed.createComponent(ElementWithDir);
       const injectedDirectionality =
-        fixture.debugElement.query(By.directive(InjectsDirectionality)).componentInstance.dir;
+        fixture.debugElement.query(By.directive(InjectsDirectionality))!.componentInstance.dir;
 
       fixture.detectChanges();
 
@@ -108,7 +108,7 @@ describe('Directionality', () => {
     it('should complete the change stream on destroy', fakeAsync(() => {
       const fixture = TestBed.createComponent(ElementWithDir);
       const dir =
-        fixture.debugElement.query(By.directive(InjectsDirectionality)).componentInstance.dir;
+        fixture.debugElement.query(By.directive(InjectsDirectionality))!.componentInstance.dir;
       const spy = jasmine.createSpy('complete spy');
       const subscription = dir.change.subscribe(undefined, undefined, spy);
 

src/cdk/overlay/overlay-directives.spec.ts

@@ -294,7 +294,7 @@ describe('Overlay directives', () => {
     });
 
     it('should set the offsetY', () => {
-      const trigger = fixture.debugElement.query(By.css('button')).nativeElement;
+      const trigger = fixture.debugElement.query(By.css('button'))!.nativeElement;
       trigger.style.position = 'absolute';
       trigger.style.top = '30px';
       trigger.style.height = '20px';

src/cdk/text-field/autosize.spec.ts

@@ -37,7 +37,7 @@ describe('CdkTextareaAutosize', () => {
 
     textarea = fixture.nativeElement.querySelector('textarea');
     autosize = fixture.debugElement.query(
-        By.directive(CdkTextareaAutosize)).injector.get<CdkTextareaAutosize>(CdkTextareaAutosize);
+        By.directive(CdkTextareaAutosize))!.injector.get<CdkTextareaAutosize>(CdkTextareaAutosize);
   });
 
   it('should resize the textarea based on its content', () => {
@@ -173,7 +173,7 @@ describe('CdkTextareaAutosize', () => {
     // detection should be triggered after a multiline content is set.
     fixture = TestBed.createComponent(AutosizeTextAreaWithContent);
     textarea = fixture.nativeElement.querySelector('textarea');
-    autosize = fixture.debugElement.query(By.css('textarea'))
+    autosize = fixture.debugElement.query(By.css('textarea'))!
         .injector.get<CdkTextareaAutosize>(CdkTextareaAutosize);
 
     fixture.componentInstance.content = `
@@ -239,7 +239,7 @@ describe('CdkTextareaAutosize', () => {
   it('should not trigger a resize when it is disabled', fakeAsync(() => {
     const fixtureWithoutAutosize = TestBed.createComponent(AutosizeTextareaWithoutAutosize);
     textarea = fixtureWithoutAutosize.nativeElement.querySelector('textarea');
-    autosize = fixtureWithoutAutosize.debugElement.query(By.css('textarea'))
+    autosize = fixtureWithoutAutosize.debugElement.query(By.css('textarea'))!
         .injector.get<CdkTextareaAutosize>(CdkTextareaAutosize);
 
     fixtureWithoutAutosize.detectChanges();

src/google-maps/google-map/google-map.spec.ts

@@ -48,7 +48,7 @@ describe('GoogleMap', () => {
     const fixture = TestBed.createComponent(TestApp);
     fixture.detectChanges();
 
-    const container = fixture.debugElement.query(By.css('div'));
+    const container = fixture.debugElement.query(By.css('div'))!;
     expect(container.nativeElement.style.height).toBe(DEFAULT_HEIGHT);
     expect(container.nativeElement.style.width).toBe(DEFAULT_WIDTH);
     expect(mapConstructorSpy).toHaveBeenCalledWith(container.nativeElement, DEFAULT_OPTIONS);
@@ -63,7 +63,7 @@ describe('GoogleMap', () => {
     fixture.componentInstance.width = '400px';
     fixture.detectChanges();
 
-    const container = fixture.debugElement.query(By.css('div'));
+    const container = fixture.debugElement.query(By.css('div'))!;
     expect(container.nativeElement.style.height).toBe('750px');
     expect(container.nativeElement.style.width).toBe('400px');
     expect(mapConstructorSpy).toHaveBeenCalledWith(container.nativeElement, DEFAULT_OPTIONS);
@@ -86,7 +86,7 @@ describe('GoogleMap', () => {
     fixture.componentInstance.zoom = options.zoom;
     fixture.detectChanges();
 
-    const container = fixture.debugElement.query(By.css('div'));
+    const container = fixture.debugElement.query(By.css('div'))!;
     expect(mapConstructorSpy).toHaveBeenCalledWith(container.nativeElement, options);
 
     fixture.componentInstance.center = {lat: 8, lng: 9};
@@ -105,7 +105,7 @@ describe('GoogleMap', () => {
     fixture.componentInstance.options = options;
     fixture.detectChanges();
 
-    const container = fixture.debugElement.query(By.css('div'));
+    const container = fixture.debugElement.query(By.css('div'))!;
     expect(mapConstructorSpy).toHaveBeenCalledWith(container.nativeElement, options);
 
     fixture.componentInstance.options = {...options, heading: 170};
@@ -126,7 +126,7 @@ describe('GoogleMap', () => {
     fixture.componentInstance.options = inputOptions;
     fixture.detectChanges();
 
-    const container = fixture.debugElement.query(By.css('div'));
+    const container = fixture.debugElement.query(By.css('div'))!;
     expect(mapConstructorSpy).toHaveBeenCalledWith(container.nativeElement, correctedOptions);
   });
 });

src/material-experimental/mdc-checkbox/checkbox.spec.ts

@@ -44,7 +44,7 @@ describe('MatCheckbox', () => {
       fixture = createComponent(SingleCheckbox);
       fixture.detectChanges();
 
-      checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox));
+      checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox))!;
       checkboxNativeElement = checkboxDebugElement.nativeElement;
       checkboxInstance = checkboxDebugElement.componentInstance;
       testComponent = fixture.debugElement.componentInstance;
@@ -480,7 +480,7 @@ describe('MatCheckbox', () => {
         fixture = createComponent(SingleCheckbox);
         fixture.detectChanges();
 
-        checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox));
+        checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox))!;
         checkboxNativeElement = checkboxDebugElement.nativeElement;
         checkboxInstance = checkboxDebugElement.componentInstance;
         testComponent = fixture.debugElement.componentInstance;
@@ -512,7 +512,7 @@ describe('MatCheckbox', () => {
         fixture = createComponent(SingleCheckbox);
         fixture.detectChanges();
 
-        checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox));
+        checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox))!;
         checkboxNativeElement = checkboxDebugElement.nativeElement;
         checkboxInstance = checkboxDebugElement.componentInstance;
         testComponent = fixture.debugElement.componentInstance;
@@ -564,7 +564,7 @@ describe('MatCheckbox', () => {
       fixture = createComponent(CheckboxWithChangeEvent);
       fixture.detectChanges();
 
-      checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox));
+      checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox))!;
       checkboxNativeElement = checkboxDebugElement.nativeElement;
       checkboxInstance = checkboxDebugElement.componentInstance;
       testComponent = fixture.debugElement.componentInstance;
@@ -614,7 +614,7 @@ describe('MatCheckbox', () => {
 
     it('should use the provided aria-label', fakeAsync(() => {
          fixture = createComponent(CheckboxWithAriaLabel);
-         checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox));
+         checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox))!;
          checkboxNativeElement = checkboxDebugElement.nativeElement;
          inputElement = <HTMLInputElement>checkboxNativeElement.querySelector('input');
 
@@ -638,7 +638,7 @@ describe('MatCheckbox', () => {
 
     it('should use the provided aria-labelledby', fakeAsync(() => {
          fixture = createComponent(CheckboxWithAriaLabelledby);
-         checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox));
+         checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox))!;
          checkboxNativeElement = checkboxDebugElement.nativeElement;
          inputElement = <HTMLInputElement>checkboxNativeElement.querySelector('input');
 
@@ -648,7 +648,7 @@ describe('MatCheckbox', () => {
 
     it('should not assign aria-labelledby if none is provided', fakeAsync(() => {
          fixture = createComponent(SingleCheckbox);
-         checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox));
+         checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox))!;
          checkboxNativeElement = checkboxDebugElement.nativeElement;
          inputElement = <HTMLInputElement>checkboxNativeElement.querySelector('input');
 
@@ -668,7 +668,7 @@ describe('MatCheckbox', () => {
       fixture.detectChanges();
 
       testComponent = fixture.debugElement.componentInstance;
-      checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox));
+      checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox))!;
       checkboxNativeElement = checkboxDebugElement.nativeElement;
       inputElement = <HTMLInputElement>checkboxNativeElement.querySelector('input');
     });
@@ -698,7 +698,8 @@ describe('MatCheckbox', () => {
          fixture.detectChanges();
 
          const checkbox =
-             fixture.debugElement.query(By.directive(MatCheckbox)).componentInstance as MatCheckbox;
+             fixture.debugElement.query(By.directive(MatCheckbox))!
+             .componentInstance as MatCheckbox;
 
          expect(checkbox.tabIndex)
              .toBe(5, 'Expected tabIndex property to have been set based on the native attribute');
@@ -708,7 +709,7 @@ describe('MatCheckbox', () => {
          fixture = createComponent(CheckboxWithTabindexAttr);
          fixture.detectChanges();
 
-         const checkbox = fixture.debugElement.query(By.directive(MatCheckbox)).nativeElement;
+         const checkbox = fixture.debugElement.query(By.directive(MatCheckbox))!.nativeElement;
          expect(checkbox.getAttribute('tabindex')).toBeFalsy();
        }));
   });
@@ -743,7 +744,7 @@ describe('MatCheckbox', () => {
       fixture.componentInstance.isRequired = false;
       fixture.detectChanges();
 
-      checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox));
+      checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox))!;
       checkboxNativeElement = checkboxDebugElement.nativeElement;
       checkboxInstance = checkboxDebugElement.componentInstance;
       inputElement = <HTMLInputElement>checkboxNativeElement.querySelector('input');
@@ -785,7 +786,7 @@ describe('MatCheckbox', () => {
          fixture = createComponent(CheckboxWithNgModelAndOnPush);
          fixture.detectChanges();
 
-         checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox));
+         checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox))!;
          checkboxNativeElement = checkboxDebugElement.nativeElement;
          checkboxInstance = checkboxDebugElement.componentInstance;
          inputElement = <HTMLInputElement>checkboxNativeElement.querySelector('input');
@@ -860,7 +861,7 @@ describe('MatCheckbox', () => {
     });
 
     it('should forward name value to input element', fakeAsync(() => {
-         let checkboxElement = fixture.debugElement.query(By.directive(MatCheckbox));
+         let checkboxElement = fixture.debugElement.query(By.directive(MatCheckbox))!;
          let inputElement = <HTMLInputElement>checkboxElement.nativeElement.querySelector('input');
 
          expect(inputElement.getAttribute('name')).toBe('test-name');
@@ -877,7 +878,7 @@ describe('MatCheckbox', () => {
       fixture = createComponent(CheckboxWithFormControl);
       fixture.detectChanges();
 
-      checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox));
+      checkboxDebugElement = fixture.debugElement.query(By.directive(MatCheckbox))!;
       checkboxInstance = checkboxDebugElement.componentInstance;
       testComponent = fixture.debugElement.componentInstance;
       inputElement = <HTMLInputElement>checkboxDebugElement.nativeElement.querySelector('input');
@@ -905,8 +906,8 @@ describe('MatCheckbox', () => {
 
     beforeEach(() => {
       fixture = createComponent(CheckboxWithoutLabel);
-      const checkboxDebugEl = fixture.debugElement.query(By.directive(MatCheckbox));
-      checkboxInnerContainer = checkboxDebugEl.query(By.css('.mdc-form-field')).nativeElement;
+      const checkboxDebugEl = fixture.debugElement.query(By.directive(MatCheckbox))!;
+      checkboxInnerContainer = checkboxDebugEl.query(By.css('.mdc-form-field'))!.nativeElement;
     });
 
     it('should not add the "name" attribute if it is not passed in', fakeAsync(() => {