Hi Team, I was looking through CSSOM bug cases where Webkit might be different compared to other browsers and came across following: Test Case - https://jsfiddle.net/7d1Lyavc/ Chrome Bug - https://bugs.chromium.org/p/chromium/issues/detail?id=1329311 Chrome Commit - https://chromium.googlesource.com/chromium/src/+/936f2a7b9a4fc4184f37e9539ea65fef6fcf528a *** STEPS TO REPRODUCE *** Run the JSFiddle >>> EXPECTED RESULT: @keyframes foo { 0% { } 100% { } }" >> ACTUAL RESULT: (In Safari 15.6 on macOS 12.5) @-webkit-keyframes foo { 0% { animation-name: bar; } 100% { animation-name: baz; } } ____ Other browsers (Firefox Nightly 105 and Chrome Canary 106) show "Expected Result". Appreciate if this can be fixed so all browsers are aligned, if it is already fixed in Webkit Nightly or upstream, please mark this as duplicate. Thanks!
<rdar://problem/98503617>
It looks like we're not stripping invalid rules when cssText is resolved.
Also, what's with the -webkit-keyframes business?!?
Oh, this is about not rejecting the animation-* properties when parsing @keyframes rules, see https://www.w3.org/TR/css-animations-1/#keyframes: "The <declaration-list> inside of <keyframe-block> accepts any CSS property except those defined in this specification, but does accept the animation-timing-function property and interprets it specially." This should be an easy fix.
I bet we also don't implement this correctly: "None of the properties interact with the cascade (so using !important on them is invalid and will cause the property to be ignored)."
Handling of !important is working as expected actually.
Pull request: https://github.com/WebKit/WebKit/pull/4318
Committed 254468@main (edad56b68bd2): <https://commits.webkit.org/254468@main> Reviewed commits have been landed. Closing PR #4318 and removing active labels.