skills/angular__angular
1
0
Fork 0
mirror of https://github.com/angular/angular.git synced 2026-09-14 13:54:52 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(animations): add unit test for leaving animated child (#44489)

Browse Source 
add a new unit test to make sure that leaving elements queried via
a parent queried via animateChild are correctly removed

note: this tests the fix introduced in PR #44357

PR Close #44489
This commit is contained in:
dario-piotrowicz
2021-12-15 13:39:15 +00:00
committed by Dylan Hunn
parent d4015f762f
commit f2b858d24f
1 changed files with 45 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/core/test/animation/animation_query_integration_spec.ts
+45
View File
@@ -3348,6 +3348,51 @@ describe('animation query tests', function() {
expect(pp.element.classList.contains('container')).toBeTruthy();
expect(pcp.element.classList.contains('item')).toBeTruthy();
});
it('should correctly remove a leaving element queried/animated by a parent queried via animateChild',
fakeAsync(() => {
@Component({
selector: 'cmp',
template: `
<div class="grand-parent" [@grandParentAnimation]="childPresent">
<div class="parent" [@parentAnimation]="childPresent">
<div *ngIf="childPresent" class="child"></div>
</div>
</div>
`,
animations: [
trigger(
'grandParentAnimation',
[transition('true <=> false', query('@parentAnimation', animateChild()))]),
trigger(
'parentAnimation',
[transition(
'true => false', query(':leave.child', animate('.2s', style({opacity: 0}))))])
]
})
class Cmp {
public childPresent = true;
}
TestBed.configureTestingModule({declarations: [Cmp]});
const engine = TestBed.inject(ɵAnimationEngine);
const fixture = TestBed.createComponent(Cmp);
const cmp = fixture.componentInstance;
fixture.detectChanges();
let children = fixture.debugElement.nativeElement.querySelectorAll('.child');
expect(children.length).toEqual(1);
cmp.childPresent = false;
fixture.detectChanges();
flushMicrotasks();
engine.players.forEach(player => player.finish());
children = fixture.debugElement.nativeElement.querySelectorAll('.child');
expect(children.length).toEqual(0);
}));
});
describe('animation control flags', () => {