diff --git a/packages/core/test/animation/animation_query_integration_spec.ts b/packages/core/test/animation/animation_query_integration_spec.ts index 3829f6bac3a..96c90f14776 100644 --- a/packages/core/test/animation/animation_query_integration_spec.ts +++ b/packages/core/test/animation/animation_query_integration_spec.ts @@ -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: ` +
+
+
+
+
+ `, + 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', () => {