Bug 248145

Summary: [web-animations] keyframes should be recomputed if used CSS variable changes
Product: WebKit Reporter: Antoine Quint <graouts>
Component: AnimationsAssignee: Antoine Quint <graouts>
Severity: Normal CC: dino, graouts, koivisto, simon.fraser, webkit-bug-importer
Priority: P2 Keywords: InRadar, WebExposed, WPTImpact
Version: Safari Technology Preview   
Hardware: Unspecified   
OS: Unspecified   
See Also: https://github.com/web-platform-tests/wpt/pull/37043

Description Antoine Quint 2022-11-20 08:04:11 PST
We're failing a couple of tests in web-animations/animation-model/keyframe-effects/effect-value-context-filling.html because we fail to update keyframes when a used CSS variable changes. For instance:

test(t => {
  const div = createDiv(t);
  div.style.setProperty('--target', '100px');
  const animation = div.animate(
    [{ marginLeft: '0px' }, { marginLeft: 'var(--target)' }],
    { duration: 1000, fill: 'forwards' }
    'Effect value before updating variable'

  div.style.setProperty('--target', '200px');

    'Effect value after updating variable'
}, 'Filling effect values reflect changes to variables on element');

In fact, after fixing bug 186490, the last two remaining failures in that test are due to this issue.
Comment 1 Antoine Quint 2022-11-20 08:18:06 PST
Pull request: https://github.com/WebKit/WebKit/pull/6682
Comment 2 Antoine Quint 2022-11-20 08:19:47 PST
Submitted web-platform-tests pull request: https://github.com/web-platform-tests/wpt/pull/37043
Comment 3 EWS 2022-11-20 12:36:49 PST
Committed 256893@main (5c0b3cb4b245): <https://commits.webkit.org/256893@main>

Reviewed commits have been landed. Closing PR #6682 and removing active labels.
Comment 4 Radar WebKit Bug Importer 2022-11-20 12:37:17 PST
Comment 5 Antoine Quint 2022-11-29 02:25:11 PST
*** Bug 201736 has been marked as a duplicate of this bug. ***