Animation constructor should not immediately play animation

[bendavis78]

The spec isn't clear on this as far as I can tell, but in Chrome and Firefox, the animation doesn't start immediately when using new Animation. When using web-animations-next.dev.js, and on Safari and IE, the animation starts immediately. This is either a bug in the polyfill or a bug in chrome & firefox-- I'm not sure which.

For anyone else running into this, a workaround to this inconsistency is to explicitly .pause() the animation after it's defined, then .play() when desired.

[Martin-Pitt]

I think this was intended that it should start paused (versus Element.animate() which creates and immediately runs an Animation).

The spec tends to talk in procedures for being exact of how things work, but this can be confusing to read or understand for clarity.

I know that Element.animate is sometimes referred to as a shortcut to creating and playing an animation.

https://drafts.csswg.org/web-animations-1/#creating-a-new-keyframeeffect-object

Having created a KeyframeEffect, it can be played by adding it to an Animation and then playing that animation. For simple effects, however, the Element.animate shortcut is more convenient since it performs these steps automatically.

https://drafts.csswg.org/web-animations-1/#the-animatable-interface-mixin Explicitly mentions:

Run the procedure to play an animation for animation In it's steps.

Which wouldn't be necessary if the Animation constructor ran such a procedure automatically (https://drafts.csswg.org/web-animations-1/#animation).