Skip to content

test(material/chips): remove dependency on NoopAnimationsModule #31791

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Aug 27, 2025
Merged

test(material/chips): remove dependency on NoopAnimationsModule #31791

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
41 changes: 18 additions & 23 deletions src/material/chips/chip-grid.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,6 @@ import {takeUntilDestroyed} from '@angular/core/rxjs-interop';
import {ComponentFixture, TestBed, fakeAsync, flush, tick} from '@angular/core/testing';
import {FormControl, FormsModule, NgForm, ReactiveFormsModule, Validators} from '@angular/forms';
import {By} from '@angular/platform-browser';
import {NoopAnimationsModule} from '@angular/platform-browser/animations';
import {MATERIAL_ANIMATIONS} from '../core';
import {MatError, MatFormField, MatHint, MatLabel} from '../form-field';
import {
Expand Down Expand Up @@ -178,13 +177,14 @@ describe('MatChipGrid', () => {

describe('on chip destroy', () => {
it('should focus the next item', () => {
// TODO(crisbeto): this test fails without the NoopAnimationsModule for some reason.
// It can indicate a deeper issue with the chips.
const fixture = createComponent(StandardChipGrid, undefined, [NoopAnimationsModule]);
const midItem = chips.get(2)!;
const fixture = createComponent(StandardChipGrid);
const midItemAction = primaryActions[2];
patchElementFocus(midItemAction);

// Focus the middle item
midItem.focus();
midItemAction.focus();
fixture.changeDetectorRef.markForCheck();
fixture.detectChanges();

// Destroy the middle item
testComponent.chips.splice(2, 1);
Expand All @@ -196,11 +196,14 @@ describe('MatChipGrid', () => {
});

it('should focus the previous item', () => {
// TODO(crisbeto): this test fails without the NoopAnimationsModule for some reason.
// It can indicate a deeper issue with the chips.
const fixture = createComponent(StandardChipGrid, undefined, [NoopAnimationsModule]);
const fixture = createComponent(StandardChipGrid);
const lastAction = primaryActions[primaryActions.length - 1];

// Focus the last item
chips.last.focus();
patchElementFocus(lastAction);
lastAction.focus();
fixture.changeDetectorRef.markForCheck();
fixture.detectChanges();

// Destroy the last item
testComponent.chips.pop();
Expand All @@ -212,9 +215,7 @@ describe('MatChipGrid', () => {
});

it('should not focus if chip grid is not focused', fakeAsync(() => {
// TODO(crisbeto): this test fails without the NoopAnimationsModule for some reason.
// It can indicate a deeper issue with the chips.
const fixture = createComponent(StandardChipGrid, undefined, [NoopAnimationsModule]);
const fixture = createComponent(StandardChipGrid);
const midItem = chips.get(2)!;

// Focus and blur the middle item
Expand All @@ -233,9 +234,7 @@ describe('MatChipGrid', () => {
}));

it('should focus the grid if the last focused item is removed', () => {
// TODO(crisbeto): this test fails without the NoopAnimationsModule for some reason.
// It can indicate a deeper issue with the chips.
const fixture = createComponent(StandardChipGrid, undefined, [NoopAnimationsModule]);
const fixture = createComponent(StandardChipGrid);
testComponent.chips = [0];
fixture.changeDetectorRef.markForCheck();

Expand All @@ -252,7 +251,7 @@ describe('MatChipGrid', () => {
});

it('should have a focus indicator', () => {
createComponent(StandardChipGrid, undefined, [NoopAnimationsModule]);
createComponent(StandardChipGrid);
const focusIndicators = chipGridNativeElement.querySelectorAll(
'.mat-mdc-chip-primary-focus-indicator',
);
Expand Down Expand Up @@ -510,9 +509,7 @@ describe('MatChipGrid', () => {
describe('FormFieldChipGrid', () => {
describe('keyboard behavior', () => {
it('should maintain focus if the active chip is deleted', () => {
// TODO(crisbeto): this test fails without the NoopAnimationsModule for some reason.
// It can indicate a deeper issue with the chips.
const fixture = createComponent(FormFieldChipGrid, undefined, [NoopAnimationsModule]);
const fixture = createComponent(FormFieldChipGrid);
const secondChip = fixture.nativeElement.querySelectorAll('.mat-mdc-chip')[1];
const secondChipAction = secondChip.querySelector('.mdc-evolution-chip__action--primary');

Expand Down Expand Up @@ -658,9 +655,7 @@ describe('MatChipGrid', () => {

describe('with chip remove', () => {
it('should properly focus next item if chip is removed through click', fakeAsync(() => {
// TODO(crisbeto): this test fails without the NoopAnimationsModule for some reason.
// It can indicate a deeper issue with the chips.
const fixture = createComponent(ChipGridWithRemove, undefined, [NoopAnimationsModule]);
const fixture = createComponent(ChipGridWithRemove);
flush();
const trailingActions = chipGridNativeElement.querySelectorAll<HTMLElement>(
'.mdc-evolution-chip__action--secondary',
Expand Down
Loading