diff --git a/packages/animations/browser/src/render/transition_animation_engine.ts b/packages/animations/browser/src/render/transition_animation_engine.ts
index 3105399b6c..2e606610a3 100644
--- a/packages/animations/browser/src/render/transition_animation_engine.ts
+++ b/packages/animations/browser/src/render/transition_animation_engine.ts
@@ -872,22 +872,7 @@ export class TransitionAnimationEngine {
if (players) {
optimizeGroupPlayer(players).onDone(fn);
} else {
- let elementPlayers: AnimationPlayer[]|null = null;
-
- let parent = element;
- while (parent = parent.parentNode) {
- const playersForThisElement = this.playersByElement.get(parent);
- if (playersForThisElement && playersForThisElement.length) {
- elementPlayers = playersForThisElement;
- break;
- }
- }
-
- if (elementPlayers) {
- optimizeGroupPlayer(elementPlayers).onDone(fn);
- } else {
- fn();
- }
+ fn();
}
});
diff --git a/packages/core/test/animation/animation_integration_spec.ts b/packages/core/test/animation/animation_integration_spec.ts
index 6beca5de35..75e68f19b2 100644
--- a/packages/core/test/animation/animation_integration_spec.ts
+++ b/packages/core/test/animation/animation_integration_spec.ts
@@ -1127,14 +1127,13 @@ export function main() {
expect(count).toEqual(2);
});
- it('should always make children wait for the parent animation to finish before any removals occur',
+ it('should allow inner removals to happen when a non removal-based parent animation is set to animate',
() => {
@Component({
selector: 'ani-cmp',
template: `
`,
animations: [trigger(
@@ -1148,9 +1147,7 @@ export function main() {
@ViewChild('parent') public parent: any;
- @ViewChild('child1') public child1Elm: any;
-
- @ViewChild('child2') public child2Elm: any;
+ @ViewChild('child') public child: any;
}
TestBed.configureTestingModule({declarations: [Cmp]});
@@ -1170,10 +1167,69 @@ export function main() {
engine.flush();
const player = getLog()[0];
+ const p = cmp.parent.nativeElement;
+ const c = cmp.child.nativeElement;
+
+ expect(p.contains(c)).toBeTruthy();
+
+ cmp.exp2 = false;
+ fixture.detectChanges();
+ engine.flush();
+
+ expect(p.contains(c)).toBeFalsy();
+
+ player.finish();
+
+ expect(p.contains(c)).toBeFalsy();
+ });
+
+ it('should make inner removals wait until a parent based removal animation has finished',
+ () => {
+ @Component({
+ selector: 'ani-cmp',
+ template: `
+
+ `,
+ animations: [trigger(
+ 'parent',
+ [transition(
+ ':leave', [style({opacity: 0}), animate(1000, style({opacity: 1}))])])]
+ })
+ class Cmp {
+ public exp1: any;
+ public exp2: any;
+
+ @ViewChild('parent') public parent: any;
+
+ @ViewChild('child1') public child1Elm: any;
+
+ @ViewChild('child2') public child2Elm: any;
+ }
+
+ TestBed.configureTestingModule({declarations: [Cmp]});
+
+ const engine = TestBed.get(ɵAnimationEngine);
+ const fixture = TestBed.createComponent(Cmp);
+ const cmp = fixture.componentInstance;
+
+ cmp.exp1 = true;
+ cmp.exp2 = true;
+ fixture.detectChanges();
+ engine.flush();
+ resetLog();
+
const p = cmp.parent.nativeElement;
const c1 = cmp.child1Elm.nativeElement;
const c2 = cmp.child2Elm.nativeElement;
+ cmp.exp1 = false;
+ cmp.exp2 = false;
+ fixture.detectChanges();
+ engine.flush();
+
expect(p.contains(c1)).toBeTruthy();
expect(p.contains(c2)).toBeTruthy();
@@ -1183,11 +1239,6 @@ export function main() {
expect(p.contains(c1)).toBeTruthy();
expect(p.contains(c2)).toBeTruthy();
-
- player.finish();
-
- expect(p.contains(c1)).toBeFalsy();
- expect(p.contains(c2)).toBeFalsy();
});
it('should substitute in values if the provided state match is an object with values', () => {