From f1bd2521dc1d371741751e0ec2b44250f3ffafea Mon Sep 17 00:00:00 2001 From: Kristiyan Kostadinov Date: Fri, 24 May 2019 18:46:19 +0200 Subject: [PATCH] test(popover-edit): fix tests leaking overlay containers (#16103) Fixes instances of `cdk-overlay-container` being leaked after each `popover-edit` test. Aside from leaking memory, this has the potential of throwing off other tests that do things like `querySelector('.cdk-overlay-container .something')`. --- src/cdk-experimental/popover-edit/BUILD.bazel | 1 + .../popover-edit/popover-edit.spec.ts | 14 +++++++++++++- src/material-experimental/popover-edit/BUILD.bazel | 1 + .../popover-edit/popover-edit.spec.ts | 14 +++++++++++++- 4 files changed, 28 insertions(+), 2 deletions(-) diff --git a/src/cdk-experimental/popover-edit/BUILD.bazel b/src/cdk-experimental/popover-edit/BUILD.bazel index e64073f5934..65f64f36345 100644 --- a/src/cdk-experimental/popover-edit/BUILD.bazel +++ b/src/cdk-experimental/popover-edit/BUILD.bazel @@ -33,6 +33,7 @@ ng_test_library( "//src/cdk/keycodes", "//src/cdk/table", "//src/cdk/testing", + "//src/cdk/overlay", ], ) diff --git a/src/cdk-experimental/popover-edit/popover-edit.spec.ts b/src/cdk-experimental/popover-edit/popover-edit.spec.ts index 3b867cc7de6..92531a1f098 100644 --- a/src/cdk-experimental/popover-edit/popover-edit.spec.ts +++ b/src/cdk-experimental/popover-edit/popover-edit.spec.ts @@ -4,9 +4,10 @@ import {CdkTableModule} from '@angular/cdk/table'; import {dispatchKeyboardEvent} from '@angular/cdk/testing'; import {CommonModule} from '@angular/common'; import {Component, ElementRef, Type, ViewChild} from '@angular/core'; -import {ComponentFixture, fakeAsync, flush, TestBed, tick} from '@angular/core/testing'; +import {ComponentFixture, fakeAsync, flush, TestBed, tick, inject} from '@angular/core/testing'; import {FormsModule, NgForm} from '@angular/forms'; import {BidiModule, Direction} from '@angular/cdk/bidi'; +import {OverlayContainer} from '@angular/cdk/overlay'; import {BehaviorSubject} from 'rxjs'; import {CdkPopoverEditColspan, CdkPopoverEditModule, PopoverEditClickOutBehavior} from './index'; @@ -322,17 +323,28 @@ describe('CDK Popover Edit', () => { describe(label, () => { let component: BaseTestComponent; let fixture: ComponentFixture; + let overlayContainer: OverlayContainer; beforeEach(() => { TestBed.configureTestingModule({ imports: [CdkTableModule, CdkPopoverEditModule, CommonModule, FormsModule, BidiModule], declarations: [componentClass], }).compileComponents(); + inject([OverlayContainer], (oc: OverlayContainer) => { + overlayContainer = oc; + })(); fixture = TestBed.createComponent(componentClass); component = fixture.componentInstance; fixture.detectChanges(); }); + afterEach(() => { + // The overlay container's `ngOnDestroy` won't be called between test runs so we need + // to call it ourselves, in order to avoid leaking containers between tests and potentially + // throwing `querySelector` calls. + overlayContainer.ngOnDestroy(); + }); + describe('triggering edit', () => { it('shows and hides on-hover content only after a delay', fakeAsync(() => { const [row0, row1] = component.getRows(); diff --git a/src/material-experimental/popover-edit/BUILD.bazel b/src/material-experimental/popover-edit/BUILD.bazel index 0c65aceed8e..c8684ad37b0 100644 --- a/src/material-experimental/popover-edit/BUILD.bazel +++ b/src/material-experimental/popover-edit/BUILD.bazel @@ -33,6 +33,7 @@ ng_test_library( "//src/cdk/collections", "//src/cdk/keycodes", "//src/cdk/testing", + "//src/cdk/overlay", "//src/cdk-experimental/popover-edit", "//src/material/table", ], diff --git a/src/material-experimental/popover-edit/popover-edit.spec.ts b/src/material-experimental/popover-edit/popover-edit.spec.ts index d6b3039af8d..082bcb80244 100644 --- a/src/material-experimental/popover-edit/popover-edit.spec.ts +++ b/src/material-experimental/popover-edit/popover-edit.spec.ts @@ -4,8 +4,9 @@ import {MatTableModule} from '@angular/material/table'; import {dispatchKeyboardEvent} from '@angular/cdk/testing'; import {CommonModule} from '@angular/common'; import {Component, ElementRef, Type, ViewChild} from '@angular/core'; -import {ComponentFixture, fakeAsync, flush, TestBed, tick} from '@angular/core/testing'; +import {ComponentFixture, fakeAsync, flush, TestBed, tick, inject} from '@angular/core/testing'; import {FormsModule, NgForm} from '@angular/forms'; +import {OverlayContainer} from '@angular/cdk/overlay'; import {BehaviorSubject} from 'rxjs'; import { @@ -263,17 +264,28 @@ describe('Material Popover Edit', () => { describe(label, () => { let component: BaseTestComponent; let fixture: ComponentFixture; + let overlayContainer: OverlayContainer; beforeEach(() => { TestBed.configureTestingModule({ imports: [MatTableModule, MatPopoverEditModule, CommonModule, FormsModule], declarations: [componentClass], }).compileComponents(); + inject([OverlayContainer], (oc: OverlayContainer) => { + overlayContainer = oc; + })(); fixture = TestBed.createComponent(componentClass); component = fixture.componentInstance; fixture.detectChanges(); }); + afterEach(() => { + // The overlay container's `ngOnDestroy` won't be called between test runs so we need + // to call it ourselves, in order to avoid leaking containers between tests and potentially + // throwing `querySelector` calls. + overlayContainer.ngOnDestroy(); + }); + describe('triggering edit', () => { it('shows and hides on-hover content only after a delay', fakeAsync(() => { const [row0, row1] = component.getRows();