Summary: | WebAnimations API doesn't properly apply keyframe easings to transforms | ||
---|---|---|---|
Product: | WebKit | Reporter: | Alan Orozco <alanorozco> |
Component: | Animations | Assignee: | Antoine Quint <graouts> |
Status: | RESOLVED FIXED | ||
Severity: | Normal | CC: | dino, graouts, graouts, koivisto, simon.fraser, travis, webkit-bug-importer |
Priority: | P2 | Keywords: | InRadar |
Version: | Safari 13 | ||
Hardware: | Unspecified | ||
OS: | Unspecified | ||
See Also: |
https://bugs.webkit.org/show_bug.cgi?id=213495 https://bugs.webkit.org/show_bug.cgi?id=215853 |
||
Attachments: |
Description
Alan Orozco
2020-04-14 17:45:28 PDT
Created attachment 396485 [details]
(ignore this attachment, it was added accidentally)
Created attachment 396488 [details]
Chrome (correct): Left box is animated with `top`. Right box is animated using `transform`. Both have the same keyframe easings.
We don't support the "steps" family of timing functions for accelerated animations. We should opt out of the accelerated path in that case. Created attachment 396538 [details]
Test showing CSS and Web Animations for top and transform
Attaching a new test case that shows how CSS Animations behave correctly but not a JS-originated animation.
I think we're not setting the per-keyframe timing functions in KeyframeEffect::updateBlendingKeyframes(). Created attachment 396965 [details]
Patch
Committed r260360: <https://trac.webkit.org/changeset/260360> Comment on attachment 396965 [details] Patch View in context: https://bugs.webkit.org/attachment.cgi?id=396965&action=review > LayoutTests/webanimations/transform-animation-with-steps-timing-function-not-accelerated.html:23 > + animation.ready.then(() => { > + // We wait for two frames to ensure an accelerated animation would have been committed. > + requestAnimationFrame(() => { > + requestAnimationFrame(() => { > + assert_equals(internals.acceleratedAnimationsForElement(target).length, 0, "The animation's target has no accelerated animation."); > + t.done(); > + }); > + }); > + }); This would read better with await *** Bug 212686 has been marked as a duplicate of this bug. *** This caused bug 213495. |