fix(animations): only require one flushMicrotasks call when testing animations

This commit is contained in:
Matias Niemelä
2017-05-18 19:26:20 -07:00
parent eed67ddafb
commit 6cb93c1fac
6 changed files with 101 additions and 30 deletions

View File

@ -86,7 +86,7 @@ export class AnimationEngine {
return this._transitionEngine.listen(namespaceId, element, eventName, eventPhase, callback);
}
flush(): void { this._transitionEngine.flush(); }
flush(countId: number = -1): void { this._transitionEngine.flush(countId); }
get players(): AnimationPlayer[] {
return (this._transitionEngine.players as AnimationPlayer[])

View File

@ -80,9 +80,14 @@ export function listenOnPlayer(
export function copyAnimationEvent(
e: AnimationEvent, phaseName?: string, totalTime?: number): AnimationEvent {
return makeAnimationEvent(
const event = makeAnimationEvent(
e.element, e.triggerName, e.fromState, e.toState, phaseName || e.phaseName,
totalTime == undefined ? e.totalTime : totalTime);
const data = (e as any)['_data'];
if (data != null) {
(event as any)['_data'] = data;
}
return event;
}
export function makeAnimationEvent(

View File

@ -382,7 +382,7 @@ export class AnimationTransitionNamespace {
insertNode(element: any, parent: any): void { addClass(element, this._hostClassName); }
drainQueuedTransitions(): QueueInstruction[] {
drainQueuedTransitions(countId: number): QueueInstruction[] {
const instructions: QueueInstruction[] = [];
this._queue.forEach(entry => {
const player = entry.player;
@ -395,6 +395,7 @@ export class AnimationTransitionNamespace {
if (listener.name == entry.triggerName) {
const baseEvent = makeAnimationEvent(
element, entry.triggerName, entry.fromState.value, entry.toState.value);
(baseEvent as any)['_data'] = countId;
listenOnPlayer(entry.player, listener.phase, baseEvent, listener.callback);
}
});
@ -627,7 +628,7 @@ export class TransitionAnimationEngine {
});
}
flush() {
flush(countId: number = -1) {
let players: AnimationPlayer[] = [];
if (this.newHostElements.size) {
this.newHostElements.forEach((ns, element) => { this._balanceNamespaceList(ns, element); });
@ -635,7 +636,7 @@ export class TransitionAnimationEngine {
}
if (this._namespaceList.length && (this.totalQueuedPlayers || this.queuedRemovals.size)) {
players = this._flushAnimations();
players = this._flushAnimations(countId);
}
this.totalQueuedPlayers = 0;
@ -659,7 +660,7 @@ export class TransitionAnimationEngine {
}
}
private _flushAnimations(): TransitionAnimationPlayer[] {
private _flushAnimations(countId: number): TransitionAnimationPlayer[] {
const subTimelines = new ElementInstructionMap();
const skippedPlayers: TransitionAnimationPlayer[] = [];
const skippedPlayersMap = new Map<any, AnimationPlayer[]>();
@ -677,8 +678,9 @@ export class TransitionAnimationEngine {
for (let i = this._namespaceList.length - 1; i >= 0; i--) {
const ns = this._namespaceList[i];
ns.drainQueuedTransitions().forEach(entry => {
ns.drainQueuedTransitions(countId).forEach(entry => {
const player = entry.player;
const element = entry.element;
if (!bodyNode || !this.driver.containsElement(bodyNode, element)) {
player.destroy();
@ -746,7 +748,7 @@ export class TransitionAnimationEngine {
}
});
allPreviousPlayersMap.forEach(players => { players.forEach(player => player.destroy()); });
allPreviousPlayersMap.forEach(players => players.forEach(player => player.destroy()));
const leaveNodes: any[] = bodyNode && allPostStyleElements.size ?
listToArray(this.driver.query(bodyNode, LEAVE_SELECTOR, true)) :

View File

@ -292,6 +292,7 @@ export function main() {
setProperty(element, engine, 'myTrigger', '456');
engine.flush();
delete (capture as any)['_data'];
expect(capture).toEqual({
element,
triggerName: 'myTrigger',
@ -305,6 +306,7 @@ export function main() {
const player = engine.players.pop() !;
player.finish();
delete (capture as any)['_data'];
expect(capture).toEqual({
element,
triggerName: 'myTrigger',