Bug 229398

Summary: Incorrect KeyframesEffect generated for background
Product: WebKit Reporter: Matt Perry <mattgperry>
Component: AnimationsAssignee: Antoine Quint <graouts>
Status: RESOLVED FIXED    
Severity: Normal CC: darin, dino, graouts, graouts, koivisto, mattgperry, simon.fraser, webkit-bug-importer
Priority: P2 Keywords: InRadar
Version: Safari Technology Preview   
Hardware: Mac (Intel)   
OS: macOS 11   
Attachments:
Description Flags
Patch
none
Patch
none
Patch for landing none

Matt Perry
Reported 2021-08-23 02:31:17 PDT
Visit this sandbox in Safari: https://codesandbox.io/s/waapi-webkit-iteration-timing-bug-forked-8ozd3?file=/src/index.js The middle box fails to animate `background`. Logging the generated KeyframeEffect reveals the first keyframe contains `background: #ff2965` as expected. However, the final keyframe contains `backgroundImage: ""` Either: - Removing `opacity` keyframes OR - Removing one `transform` keyframe Will fix this, and all three boxes will animate `background` as expected.
Attachments
Patch (9.60 KB, patch)
2022-02-03 02:53 PST, Antoine Quint 		no flags
DetailsFormatted DiffDiff
Patch (9.60 KB, patch)
2022-02-03 02:55 PST, Antoine Quint 		no flags
DetailsFormatted DiffDiff
Patch for landing (9.59 KB, patch)
2022-02-03 05:00 PST, Antoine Quint 		no flags
DetailsFormatted DiffDiff
Show Obsolete (2) View All Add attachment proposed patch, testcase, etc.
Radar WebKit Bug Importer
Comment 1 2021-08-30 02:32:45 PDT
<rdar://problem/82516118>
Antoine Quint
Comment 2 2021-09-08 07:19:43 PDT
This is a pretty amazing bug, thanks for reporting, I will look into this.
Antoine Quint
Comment 3 2022-02-03 02:32:24 PST
This happens when merging adjacent keyframes in processPropertyIndexedKeyframes(). I just found out that adding a shorthand property to a MutableStyleProperties expands it to longhands, and the merging code gets confused.
Antoine Quint
Comment 4 2022-02-03 02:53:43 PST
Created attachment 450753 [details] Patch
Antoine Quint
Comment 5 2022-02-03 02:55:15 PST
Created attachment 450754 [details] Patch
Darin Adler
Comment 6 2022-02-03 03:39:14 PST
Comment on attachment 450754 [details] Patch View in context: https://bugs.webkit.org/attachment.cgi?id=450754&action=review > Source/WebCore/animation/KeyframeEffect.cpp:402 > + previousKeyframe.style->mergeAndOverrideOnConflict(keyframe.style.get()); Might not need that get()
Antoine Quint
Comment 7 2022-02-03 03:51:57 PST
(In reply to Darin Adler from comment #6) > Comment on attachment 450754 [details] > Patch > > View in context: > https://bugs.webkit.org/attachment.cgi?id=450754&action=review > > > Source/WebCore/animation/KeyframeEffect.cpp:402 > > + previousKeyframe.style->mergeAndOverrideOnConflict(keyframe.style.get()); > > Might not need that get() Indeed, will fix in commit.
Antoine Quint
Comment 8 2022-02-03 05:00:26 PST
Created attachment 450762 [details] Patch for landing
EWS
Comment 9 2022-02-03 06:03:38 PST
Committed r289048 (246755@main): <https://commits.webkit.org/246755@main> All reviewed patches have been landed. Closing bug and clearing flags on attachment 450762 [details].
Note You need to log in before you can comment on or make changes to this bug.