246913 2022-10-23 03:02:01 -0700 [web-animations] handle blending of layout-dependent <transform-list> values 2026-01-12 09:03:28 -0800 1 1 1 Unclassified WebKit Animations Safari Technology Preview Unspecified Unspecified NEW BrowserCompat, InRadar, WPTImpact P2 Normal --- 246937 222096 1 graouts graouts ahmad.saleem792 dino graouts koivisto philip sam webkit-bug-importer oldest_to_newest 1907624 0 graouts 2022-10-23 03:02:01 -0700 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. 1907625 1 graouts 2022-10-23 03:08:19 -0700 Pull request: https://github.com/WebKit/WebKit/pull/5684 1907742 2 graouts 2022-10-24 01:33:10 -0700 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. 1907752 3 graouts 2022-10-24 02:42:19 -0700 We'll need mix() support, I filed https://bugs.webkit.org/show_bug.cgi?id=246937. Retitling this bug to correctly identify the issue. 1909205 4 webkit-bug-importer 2022-10-30 03:02:17 -0700 <rdar://problem/101725429> 2018942 5 ahmad.saleem792 2024-03-05 18:35:05 -0800 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. 2138187 6 graouts 2025-08-22 01:20:13 -0700 *** Bug 222096 has been marked as a duplicate of this bug. *** 2138193 7 graouts 2025-08-22 01:37:46 -0700 Note that `mix()` is no longer a thing and in this instance `transform-mix()` would be the relevant CSS function: https://drafts.csswg.org/css-values-5/#transform-mix.