The following example behaves as expected in Chrome and FF, but behaves incorrectly in Safari: In Firefox and Chrome the Deno logo moves from the top right to the middle. In Safari the logo moves from the top left to the middle. ```html <style> div { background-image: url(https://deno.land/logo.svg); background-size: 10px; background-repeat: no-repeat; height: 100px; width: 100px; animation: move 1s; } @keyframes move { from { background-position: right 0 top 0px; } to { background-position: right 50px top 10px; } } </style> <div></div> ```
<rdar://problem/81807407>
Created attachment 436541 [details] Test case
The issue here is that the style that results from the animation does not have m_backgroundXOrigin/m_backgroundYOrigin set in it.
Created attachment 436581 [details] Patch
Committed r281683 (241033@main): <https://commits.webkit.org/241033@main> All reviewed patches have been landed. Closing bug and clearing flags on attachment 436581 [details].
It appears that the test added in this change is flaky, mostly failing (but sometimes passing) on GTK and WPE, and mostly passing (but sometimes failing) on Mac/iOS: https://results.webkit.org/?suite=layout-tests&test=animations%2Fbackground-position.html
(In reply to Arcady Goldmints-Orlov from comment #6) > It appears that the test added in this change is flaky, mostly failing (but > sometimes passing) on GTK and WPE, and mostly passing (but sometimes > failing) on Mac/iOS: > https://results.webkit.org/?suite=layout-tests&test=animations%2Fbackground- > position.html See bug 229764