Skip to content

Commit

Permalink
test: clean up IE/Edge test workarounds (#24364)
Browse files Browse the repository at this point in the history 
The workarounds shouldn't be necessary since we don't run tests against IE and legacy Edge anymore.

(cherry picked from commit ad03673)
  • Loading branch information
@crisbeto @zarend
crisbeto authored and zarend committed Feb 7, 2022
1 parent 5485d12 commit c9288ed
Show file tree
Hide file tree
Showing 9 changed files with 34 additions and 182 deletions.
12 changes: 4 additions & 8 deletions src/material-experimental/mdc-input/input.spec.ts
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
import {Platform, PlatformModule} from '@angular/cdk/platform';
import {dispatchFakeEvent, wrappedErrorMessage} from '../../cdk/testing/private';
import {
ChangeDetectionStrategy,
Expand Down Expand Up @@ -38,6 +37,7 @@ import {MatIconModule} from '@angular/material/icon';
import {By} from '@angular/platform-browser';
import {BrowserAnimationsModule, NoopAnimationsModule} from '@angular/platform-browser/animations';
import {MAT_INPUT_VALUE_ACCESSOR, MatInput, MatInputModule} from './index';
import {getSupportedInputTypes} from '@angular/cdk/platform';

describe('MatMdcInput without forms', () => {
it('should default to floating labels', fakeAsync(() => {
Expand Down Expand Up @@ -69,24 +69,21 @@ describe('MatMdcInput without forms', () => {

it('should not be treated as empty if type is date', fakeAsync(() => {
const fixture = createComponent(MatInputDateTestController);
const platform = TestBed.inject(Platform);
fixture.detectChanges();

if (!(platform.TRIDENT || (platform.SAFARI && !platform.IOS))) {
if (getSupportedInputTypes().has('date')) {
const formField = fixture.debugElement.query(By.directive(MatFormField))!
.componentInstance as MatFormField;
expect(formField).toBeTruthy();
expect(formField!._control.empty).toBe(false);
}
}));

// Safari Desktop and IE don't support type="date" and fallback to type="text".
it('should be treated as empty if type is date in Safari Desktop or IE', fakeAsync(() => {
it('should be treated as empty if type is date on unsupported browser', fakeAsync(() => {
const fixture = createComponent(MatInputDateTestController);
const platform = TestBed.inject(Platform);
fixture.detectChanges();

if (platform.TRIDENT || (platform.SAFARI && !platform.IOS)) {
if (!getSupportedInputTypes().has('date')) {
const formField = fixture.debugElement.query(By.directive(MatFormField))!
.componentInstance as MatFormField;
expect(formField).toBeTruthy();
Expand Down Expand Up @@ -1486,7 +1483,6 @@ function configureTestingModule(
MatIconModule,
MatInputModule,
animations ? BrowserAnimationsModule : NoopAnimationsModule,
PlatformModule,
ReactiveFormsModule,
...imports,
],
Expand Down
2 changes: 1 addition & 1 deletion src/material/button/testing/shared.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -93,7 +93,7 @@ export function runHarnessTests(
// cancel dispatched click events on disabled buttons. We skip this check on Edge and Firefox.
// See: https://bugzilla.mozilla.org/show_bug.cgi?id=1582570 and:
// https://stackoverflow.com/questions/32377026/disabled-button-is-clickable-on-edge-browser
if (platform.EDGE || platform.FIREFOX) {
if (platform.FIREFOX) {
return;
}

Expand Down
1 change: 0 additions & 1 deletion src/material/grid-list/BUILD.bazel
View file
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,6 @@ ng_test_library(
deps = [
":grid-list",
"//src/cdk/bidi",
"//src/cdk/platform",
"@npm//@angular/platform-browser",
],
)
Expand Down
99 changes: 2 additions & 97 deletions src/material/grid-list/grid-list.spec.ts
View file
Original file line number Diff line number Diff line change
@@ -1,35 +1,20 @@
import {TestBed, ComponentFixture, inject} from '@angular/core/testing';
import {TestBed, ComponentFixture} from '@angular/core/testing';
import {Component, DebugElement, Type, ViewChild} from '@angular/core';
import {By} from '@angular/platform-browser';
import {MatGridList, MatGridListModule} from './index';
import {MatGridTile, MatGridTileText} from './grid-tile';
import {Directionality} from '@angular/cdk/bidi';
import {Platform} from '@angular/cdk/platform';

describe('MatGridList', () => {
let disableComputedStyleTests = false;

function createComponent<T>(componentType: Type<T>): ComponentFixture<T> {
TestBed.configureTestingModule({
imports: [MatGridListModule],
declarations: [componentType],
}).compileComponents();

const fixture = TestBed.createComponent<T>(componentType);

inject([Platform], (platform: Platform) => {
// IE and Edge aren't consistent in the values that they return from `getComputedStyle`.
// In some cases they return the computed values, and in others the passed-in ones. We use
// this flag to disable the tests that depend on `getComputedStyle` in order to avoid flakes.
// TODO: we can re-enable them when we start testing against the Chromium-based Edge.
disableComputedStyleTests = platform.EDGE || platform.TRIDENT;
})();

return fixture;
return TestBed.createComponent<T>(componentType);
}

afterEach(() => (disableComputedStyleTests = false));

it('should throw error if cols is not defined', () => {
const fixture = createComponent(GridListWithoutCols);

Expand Down Expand Up @@ -86,10 +71,6 @@ describe('MatGridList', () => {
it('should default to 1:1 row height if undefined ', () => {
const fixture = createComponent(GridListWithUnspecifiedRowHeight);

if (disableComputedStyleTests) {
return;
}

fixture.detectChanges();
const tile = fixture.debugElement.query(By.directive(MatGridTile))!;
const inlineStyles = tile.nativeElement.style;
Expand All @@ -103,10 +84,6 @@ describe('MatGridList', () => {
it('should use a ratio row height if passed in', () => {
const fixture = createComponent(GirdListWithRowHeightRatio);

if (disableComputedStyleTests) {
return;
}

fixture.componentInstance.rowHeight = '4:1';
fixture.detectChanges();

Expand All @@ -128,10 +105,6 @@ describe('MatGridList', () => {
it('should divide row height evenly in "fit" mode', () => {
const fixture = createComponent(GridListWithFitRowHeightMode);

if (disableComputedStyleTests) {
return;
}

fixture.componentInstance.totalHeight = '300px';
fixture.detectChanges();
const tile = fixture.debugElement.query(By.directive(MatGridTile))!;
Expand All @@ -149,10 +122,6 @@ describe('MatGridList', () => {
it('should use the fixed row height if passed in', () => {
const fixture = createComponent(GridListWithFixedRowHeightMode);

if (disableComputedStyleTests) {
return;
}

fixture.componentInstance.rowHeight = '100px';
fixture.detectChanges();

Expand All @@ -168,10 +137,6 @@ describe('MatGridList', () => {
it('should default to pixels if row height units are missing', () => {
const fixture = createComponent(GridListWithUnitlessFixedRowHeight);

if (disableComputedStyleTests) {
return;
}

fixture.detectChanges();
const tile = fixture.debugElement.query(By.directive(MatGridTile))!;
expect(getDimension(tile, 'height')).toBe(100);
Expand All @@ -180,10 +145,6 @@ describe('MatGridList', () => {
it('should default gutter size to 1px', () => {
const fixture = createComponent(GridListWithUnspecifiedGutterSize);

if (disableComputedStyleTests) {
return;
}

fixture.detectChanges();
const tiles = fixture.debugElement.queryAll(By.css('mat-grid-tile'));

Expand All @@ -200,10 +161,6 @@ describe('MatGridList', () => {
const fixture = createComponent(GridListWithUnspecifiedGutterSize);
const gridList = fixture.debugElement.query(By.directive(MatGridList))!;

if (disableComputedStyleTests) {
return;
}

gridList.componentInstance.gutterSize = 0;
fixture.detectChanges();

Expand All @@ -221,10 +178,6 @@ describe('MatGridList', () => {
it('should lay out the tiles correctly for a nested grid list', () => {
const fixture = createComponent(NestedGridList);

if (disableComputedStyleTests) {
return;
}

fixture.detectChanges();
const innerTiles = fixture.debugElement.queryAll(
By.css('mat-grid-tile mat-grid-list mat-grid-tile'),
Expand All @@ -238,10 +191,6 @@ describe('MatGridList', () => {
it('should set the gutter size if passed', () => {
const fixture = createComponent(GridListWithGutterSize);

if (disableComputedStyleTests) {
return;
}

fixture.detectChanges();
const tiles = fixture.debugElement.queryAll(By.css('mat-grid-tile'));

Expand All @@ -257,10 +206,6 @@ describe('MatGridList', () => {
it('should use pixels if gutter units are missing', () => {
const fixture = createComponent(GridListWithUnitlessGutterSize);

if (disableComputedStyleTests) {
return;
}

fixture.detectChanges();
const tiles = fixture.debugElement.queryAll(By.css('mat-grid-tile'));

Expand All @@ -277,10 +222,6 @@ describe('MatGridList', () => {
const fixture = createComponent(GridListWithUnspecifiedGutterSize);
const gridList = fixture.debugElement.query(By.directive(MatGridList))!;

if (disableComputedStyleTests) {
return;
}

gridList.componentInstance.gutterSize = '10%';
fixture.detectChanges();

Expand All @@ -293,10 +234,6 @@ describe('MatGridList', () => {
it('should set the correct list height in ratio mode', () => {
const fixture = createComponent(GridListWithRatioHeightAndMulipleRows);

if (disableComputedStyleTests) {
return;
}

fixture.detectChanges();
const list = fixture.debugElement.query(By.directive(MatGridList))!;
const inlineStyles = list.nativeElement.style;
Expand All @@ -309,10 +246,6 @@ describe('MatGridList', () => {
it('should set the correct list height in fixed mode', () => {
const fixture = createComponent(GridListWithFixRowHeightAndMultipleRows);

if (disableComputedStyleTests) {
return;
}

fixture.detectChanges();
const list = fixture.debugElement.query(By.directive(MatGridList))!;
expect(getDimension(list, 'height')).toBe(201);
Expand All @@ -321,10 +254,6 @@ describe('MatGridList', () => {
it('should allow adjustment of tile colspan', () => {
const fixture = createComponent(GridListWithColspanBinding);

if (disableComputedStyleTests) {
return;
}

fixture.componentInstance.colspan = 2;
fixture.detectChanges();

Expand All @@ -339,10 +268,6 @@ describe('MatGridList', () => {
it('should allow adjustment of tile rowspan', () => {
const fixture = createComponent(GridListWithRowspanBinding);

if (disableComputedStyleTests) {
return;
}

fixture.componentInstance.rowspan = 2;
fixture.detectChanges();

Expand All @@ -357,10 +282,6 @@ describe('MatGridList', () => {
it('should lay out tiles correctly for a complex layout', () => {
const fixture = createComponent(GridListWithComplexLayout);

if (disableComputedStyleTests) {
return;
}

fixture.componentInstance.tiles = [
{cols: 3, rows: 1},
{cols: 1, rows: 2},
Expand Down Expand Up @@ -395,10 +316,6 @@ describe('MatGridList', () => {
it('should lay out tiles correctly', () => {
const fixture = createComponent(GridListWithLayout);

if (disableComputedStyleTests) {
return;
}

fixture.detectChanges();
const tiles = fixture.debugElement.queryAll(By.css('mat-grid-tile'));

Expand Down Expand Up @@ -431,10 +348,6 @@ describe('MatGridList', () => {
it('should lay out tiles correctly when single cell to be placed at the beginning', () => {
const fixture = createComponent(GridListWithSingleCellAtBeginning);

if (disableComputedStyleTests) {
return;
}

fixture.detectChanges();
const tiles = fixture.debugElement.queryAll(By.css('mat-grid-tile'));

Expand Down Expand Up @@ -497,10 +410,6 @@ describe('MatGridList', () => {
it('should reset the old styles when switching to a new tile styler', () => {
const fixture = createComponent(GirdListWithRowHeightRatio);

if (disableComputedStyleTests) {
return;
}

fixture.componentInstance.rowHeight = '4:1';
fixture.detectChanges();

Expand Down Expand Up @@ -562,10 +471,6 @@ describe('MatGridList', () => {
it('should lay out the tiles if they are not direct descendants of the list', () => {
const fixture = createComponent(GridListWithIndirectTileDescendants);

if (disableComputedStyleTests) {
return;
}

fixture.detectChanges();
const tile = fixture.debugElement.query(By.directive(MatGridTile))!;
const inlineStyles = tile.nativeElement.style;
Expand Down
12 changes: 4 additions & 8 deletions src/material/input/input.spec.ts
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import {Platform, PlatformModule, _supportsShadowDom} from '@angular/cdk/platform';
import {getSupportedInputTypes, _supportsShadowDom} from '@angular/cdk/platform';
import {
createFakeEvent,
dispatchFakeEvent,
Expand Down Expand Up @@ -77,23 +77,20 @@ describe('MatInput without forms', () => {

it('should not be treated as empty if type is date', fakeAsync(() => {
const fixture = createComponent(MatInputDateTestController);
const platform = TestBed.inject(Platform);
fixture.detectChanges();

if (!(platform.TRIDENT || (platform.SAFARI && !platform.IOS))) {
if (getSupportedInputTypes().has('date')) {
const el = fixture.debugElement.query(By.css('label'))!.nativeElement;
expect(el).not.toBeNull();
expect(el.classList.contains('mat-form-field-empty')).toBe(false);
}
}));

// Safari Desktop and IE don't support type="date" and fallback to type="text".
it('should be treated as empty if type is date in Safari Desktop or IE', fakeAsync(() => {
it('should be treated as empty if type is date on unsupported browser', fakeAsync(() => {
const fixture = createComponent(MatInputDateTestController);
const platform = TestBed.inject(Platform);
fixture.detectChanges();

if (platform.TRIDENT || (platform.SAFARI && !platform.IOS)) {
if (!getSupportedInputTypes().has('date')) {
const el = fixture.debugElement.query(By.css('label'))!.nativeElement;
expect(el).not.toBeNull();
expect(el.classList.contains('mat-form-field-empty')).toBe(true);
Expand Down Expand Up @@ -1862,7 +1859,6 @@ function createComponent<T>(
MatFormFieldModule,
MatInputModule,
BrowserAnimationsModule,
PlatformModule,
ReactiveFormsModule,
...imports,
],
Expand Down
1 change: 0 additions & 1 deletion src/material/select/BUILD.bazel
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,6 @@ ng_test_library(
"//src/cdk/bidi",
"//src/cdk/keycodes",
"//src/cdk/overlay",
"//src/cdk/platform",
"//src/cdk/scrolling",
"//src/cdk/testing/private",
"//src/material/core",
Expand Down
Loading

0 comments on commit c9288ed

Please sign in to comment.