fix(animations): make sure @.disabled respects disabled parent/sub animation sequences (#18715)

Prior to this fix if @parent and @child animations ran at the same
time within a disabled region then there was a chance that a @child
sub animation would never complete. This would cause *directives to
never close a removal when a @child trigger was placed on them. This
patch fixes this issue.

PR Close #18715
This commit is contained in:
Matias Niemelä
2017-08-04 15:10:47 -07:00
committed by Miško Hevery
parent 5d68c830d2
commit c3dcbf9cb3
2 changed files with 84 additions and 3 deletions

View File

@ -1016,11 +1016,20 @@ export class TransitionAnimationEngine {
} else {
eraseStyles(element, instruction.fromStyles);
player.onDestroy(() => setStyles(element, instruction.toStyles));
// there still might be a ancestor player animating this
// element therefore we will still add it as a sub player
// even if its animation may be disabled
subPlayers.push(player);
if (disabledElementsSet.has(element)) {
skippedPlayers.push(player);
}
}
});
// find all of the sub players' corresponding inner animation player
subPlayers.forEach(player => {
// even if any players are not found for a sub animation then it
// will still complete itself after the next tick since it's Noop
const playersForElement = skippedPlayersMap.get(player.element);
if (playersForElement && playersForElement.length) {
const innerPlayer = optimizeGroupPlayer(playersForElement);
@ -1052,7 +1061,7 @@ export class TransitionAnimationEngine {
// until that animation is over (or the parent queried animation)
if (details && details.hasAnimation) continue;
let players: AnimationPlayer[] = [];
let players: TransitionAnimationPlayer[] = [];
// if this element is queried or if it contains queried children
// then we want for the element not to be removed from the page
@ -1071,8 +1080,10 @@ export class TransitionAnimationEngine {
}
}
}
if (players.length) {
removeNodesAfterAnimationDone(this, element, players);
const activePlayers = players.filter(p => !p.destroyed);
if (activePlayers.length) {
removeNodesAfterAnimationDone(this, element, activePlayers);
} else {
this.processLeaveNode(element);
}