1710735 - CSS variables not resolved in animation-timing-function inside @keyframes rule

Status: NEW

(Core :: CSS Parsing and Computation, defect)

Description

[Markus Stange [:mstange]]

In this testcase, the animation is moving fluidly rather than in steps: https://codepen.io/mstange/pen/eYvpaXm

The declaration animation-timing-function: steps(var(--steps)); in the @keyframes rule seems to be ignored.

All browsers seem to agree on this. But is it something that the spec asks for, or is this by accident?

Emilio found https://searchfox.org/mozilla-central/rev/6b099d836c882bc155d2ef285e0ad0ab9f5038f6/servo/components/style/stylesheets/keyframes_rule.rs#337 and said "ordering might be a bit tricky, because we look the timing function before collecting custom properties declared in the keyframe block itself".