NEW 198529
css 'inherit' fails when parent property is running an accelerated animation
https://bugs.webkit.org/show_bug.cgi?id=198529
Summary css 'inherit' fails when parent property is running an accelerated animation
Stephen McGruer
Reported 2019-06-04 08:01:52 PDT
Created attachment 371281 [details] reproduction Steps to reproduce: See https://output.jsbin.com/nidagep/ for the reproduction (also attached), and the original Chrome bug https://cbrug.com/265303 The gist is that when a parent element is running an accelerated animation, a child that uses a value of 'inherit' is not properly updated unless something causes a main frame tick (e.g. a mouseover or a rAF). In the attached example, the child should transform smoothly from 0-90deg, due to the accumulation from the parent + the inherit. Instead, it transforms from 0-45deg unless a main frame tick happens. This was reproduced in Safari using Browserstack; Safari 12 on Mac Mojave.
Attachments
reproduction (448 bytes, text/html)
2019-06-04 08:01 PDT, Stephen McGruer
no flags
Radar WebKit Bug Importer
Comment 1 2019-06-06 10:22:05 PDT
Antoine Quint
Comment 2 2022-03-04 13:46:37 PST
All of Chrome, Firefox and Safari seem to struggle with this example.
Note You need to log in before you can comment on or make changes to this bug.