search

web-animations / web-animations-js

JavaScript implementation of the Web Animations API
http://web-animations.github.io
Apache License 2.0
3.77k stars 408 forks source link

Web Animations "duration" doesn't accept stringy numbers #141

Closed lucyllewy closed 7 years ago

lucyllewy commented 7 years ago

Unsure whether this is an issue with the polyfill or native API limitations:

I've encountered an issue where I wanted to use the web animations API in a web component using Polymer. This is all well and good, except that I wanted to accept the duration of the animation via an exposed property of my component. Unfortunately, it seems that Polymer was handing me this property as a string, even when I'd told it that the property was numeric. Now that may be an issue for Polymer if I can narrow it down to a small test case for them. This issue is for the Animations API refusing to accept a duration parameter which is a string representation of a number, e.g. duration = "800".

Below is a link to a small codepen which illustrates the issue in as small a scenario as I could get it.

https://codepen.io/diddledan/pen/PjozZd

birtles commented 7 years ago

This is basically because of WebIDL handling. The definition of the duration member is:

(unrestricted double or DOMString) duration = "auto";

So strings will get treated as strings and then the following text applies:

If an attempt is made to set this attribute to a value less than zero, a NaN value, or a string other than the lowercase value auto, a TypeError must be thrown and the value of the duration attribute left unchanged. (Spec)

I'm not sure if we should add an extra step to try to parse the string as a number. If we did, we'd have to be careful that it doesn't prevent us from accept number-like values with a different meaning in the future.

In any case, this is a spec issue not a polyfill issue.

ewilligers commented 7 years ago

The polyfill is following the spec.