Bug 243537
Summary: | 'animation-foo' declarations in @keyframes should be parse error | ||
---|---|---|---|
Product: | WebKit | Reporter: | Ahmad Saleem <ahmad.saleem792> |
Component: | Animations | Assignee: | Antoine Quint <graouts> |
Status: | RESOLVED FIXED | ||
Severity: | Normal | CC: | ap, bfulgham, dino, graouts, graouts, karlcow, rniwa, simon.fraser, webkit-bug-importer, zalan |
Priority: | P2 | Keywords: | BrowserCompat, InRadar |
Version: | Safari 15 | ||
Hardware: | Mac (Apple Silicon) | ||
OS: | macOS 12 |
Ahmad Saleem
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!
Attachments | ||
---|---|---|
Add attachment proposed patch, testcase, etc. |
Radar WebKit Bug Importer
<rdar://problem/98503617>
Antoine Quint
It looks like we're not stripping invalid rules when cssText is resolved.
Antoine Quint
Also, what's with the -webkit-keyframes business?!?
Antoine Quint
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.
Antoine Quint
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)."
Antoine Quint
Handling of !important is working as expected actually.
Antoine Quint
Pull request: https://github.com/WebKit/WebKit/pull/4318
EWS
Committed 254468@main (edad56b68bd2): <https://commits.webkit.org/254468@main>
Reviewed commits have been landed. Closing PR #4318 and removing active labels.