From f12e15e682acc0e9bb0722e3455e68acc6687ac6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Matias=20Niemel=C3=A4?= Date: Wed, 4 Oct 2017 16:14:17 -0700 Subject: [PATCH] test(animations): test to see if triggers get cancelled on removal (#19532) PR Close #19532 --- .../animation/animation_integration_spec.ts | 64 +++++++++++++++++++ 1 file changed, 64 insertions(+) diff --git a/packages/core/test/animation/animation_integration_spec.ts b/packages/core/test/animation/animation_integration_spec.ts index bfc08b651d..51932332f9 100644 --- a/packages/core/test/animation/animation_integration_spec.ts +++ b/packages/core/test/animation/animation_integration_spec.ts @@ -1318,6 +1318,70 @@ export function main() { expect(count).toEqual(2); }); + it('should cancel all animations on the element when a removal animation is set', + fakeAsync(() => { + const sharedAnimation = [style({opacity: 0}), animate('1s', style({opacity: 1}))]; + + @Component({ + selector: 'ani-cmp', + template: ` +
+ `, + animations: [ + trigger( + 'one', + [ + transition('* => go', sharedAnimation), + transition( + ':leave', [style({opacity: 1}), animate('1s', style({opacity: 0}))]), + ]), + trigger( + 'two', + [ + transition('* => go', sharedAnimation), + ]), + trigger( + 'three', + [ + transition('* => go', sharedAnimation), + ]), + ] + }) + class Cmp { + public exp0: any; + public exp1: any; + public exp2: any; + public exp3: any; + } + + TestBed.configureTestingModule({declarations: [Cmp]}); + + const fixture = TestBed.createComponent(Cmp); + const cmp = fixture.componentInstance; + + cmp.exp0 = true; + cmp.exp1 = 'go'; + cmp.exp2 = 'go'; + cmp.exp3 = 'go'; + fixture.detectChanges(); + flushMicrotasks(); + + const players = getLog(); + resetLog(); + + expect(players.length).toEqual(3); + + let count = 0; + players.forEach(player => { player.onDone(() => count++); }); + + expect(count).toEqual(0); + cmp.exp0 = false; + fixture.detectChanges(); + flushMicrotasks(); + + expect(count).toEqual(3); + })); + it('should destroy inner animations when a parent node is set for removal', () => { @Component({ selector: 'ani-cmp',