We're failing a subtest in web-animations/interfaces/Animation/commitStyles.html: test(t => { const div = createDiv(t); div.style.width = '200px'; div.style.height = '200px'; const animation = div.animate({ transform: ["translate(100%, 0%)", "scale(3)"] }, 1000); animation.currentTime = 500; animation.commitStyles(); animation.cancel(); assert_equals(getComputedStyle(div).transform, "matrix(2, 0, 0, 2, 100, 0)", "Resolved transform is correct after commit."); }, 'Commits matrix-interpolated relative transforms'); Our current result is "matrix(2, 0, 0, 2, 0, 0)" because when we blend under commitStyles() layout has not happened yet for the div and the bounds passed to resolve the 100% translation value is 0,0.
Pull request: https://github.com/WebKit/WebKit/pull/5684
Performing a layout should not be required to pass this test, I wrote all the details in https://github.com/WebKit/WebKit/pull/5684#issuecomment-1288636644.
We'll need mix() support, I filed https://bugs.webkit.org/show_bug.cgi?id=246937. Retitling this bug to correctly identify the issue.
<rdar://problem/101725429>
Still failing sub-test: https://wpt.fyi/results/web-animations/interfaces/Animation/commitStyles.html?label=master&label=experimental&aligned=&q=safari%3Afail+firefox%3Apass+chrome%3Apass Adding 'WPTImpact' and 'BrowserCompat' tags.