diff --git a/packages/animations/browser/src/render/web_animations/web_animations_player.ts b/packages/animations/browser/src/render/web_animations/web_animations_player.ts index 879bcf3f1d..56e5a2ea0f 100644 --- a/packages/animations/browser/src/render/web_animations/web_animations_player.ts +++ b/packages/animations/browser/src/render/web_animations/web_animations_player.ts @@ -65,7 +65,7 @@ export class WebAnimationsPlayer implements AnimationPlayer { const keyframes = this.keyframes.map(styles => copyStyles(styles, false)); const previousStyleProps = Object.keys(this.previousStyles); - if (previousStyleProps.length) { + if (previousStyleProps.length && keyframes.length) { let startingKeyframe = keyframes[0]; let missingStyleProps: string[] = []; previousStyleProps.forEach(prop => { diff --git a/packages/animations/browser/test/render/web_animations/web_animations_player_spec.ts b/packages/animations/browser/test/render/web_animations/web_animations_player_spec.ts index 0fd04c8977..139aecfcf4 100644 --- a/packages/animations/browser/test/render/web_animations/web_animations_player_spec.ts +++ b/packages/animations/browser/test/render/web_animations/web_animations_player_spec.ts @@ -33,6 +33,24 @@ export function main() { expect(p.log).toEqual(['pause', 'play']); }); + it('should allow an empty set of keyframes with a set of previous styles', () => { + const previousKeyframes = [ + {opacity: 0, offset: 0}, + {opacity: 1, offset: 1}, + ]; + + const previousPlayer = new WebAnimationsPlayer(element, previousKeyframes, {duration: 1000}); + previousPlayer.play(); + previousPlayer.finish(); + previousPlayer.beforeDestroy(); + + const EMPTY_KEYFRAMES: any[] = []; + const player = + new WebAnimationsPlayer(element, EMPTY_KEYFRAMES, {duration: 1000}, [previousPlayer]); + player.play(); + player.destroy(); + }); + it('should not pause the player if created and started before initialized', () => { const keyframes = [ {opacity: 0, offset: 0},