Here is a video of the non-buggy behavior I see in Chrome: https://youtu.be/u2iViqqx1OI

And here is a video of the buggy behavior I see in Safari: https://youtu.be/v_Tx2peDnB8

Looks like Chrome works fine because it's using native, when forcing the polyfill (by using the dev.js version) the buggy behaviour is seen in Chrome.
https://jsfiddle.net/86126am2/

Seems the polyfill just doesn't have a handler for strokeDasharray: https://github.com/web-animations/web-animations-js/search?utf8=%E2%9C%93&q=strokeDasharray&type=Code

Any updates on this?

This bug does not seem like it has been fixed to me. Can you confirm that the updated jsfiddle animation works as expected in Safari? I updated the dependency to v2.2.5 and I'm still seeing the same behavior.

https://jsfiddle.net/alexjlockwood/79zh7228/

I also still see the same behavior in Chrome when I use the dev.js version: https://rawgit.com/web-animations/web-animations-js/dev/web-animations.dev.js

Looks like support for unitless values is missing. Confirmed that adding 'px' to the example makes it work in the polyfill: https://jsfiddle.net/79zh7228/8/

Can confirm adding units fixed the issue for me. https://scttcper.github.io/ngx-trend/ line should animate on page load