1841313 - WPT failures related to interpolation/composition in css/css-grid/animation/[grid-template-columns-composition.html, grid-template-rows-composition.html]

Status: VERIFIED FIXED

(Core :: CSS Parsing and Computation, defect)

Description

[Thomas Wisniewski [:twisniewski]]

wpt.fyi:

• https://wpt.fyi/results/css/css-grid/animation/grid-template-columns-composition.html
• https://wpt.fyi/results/css/css-grid/animation/grid-template-rows-composition.html

Comment 1

[Daniel Holbert [:dholbert]]

It looks like we're treating the added values as if they were actual start/end values, not values being added.

Here's the live testcase:
http://wpt.live/css/css-grid/animation/grid-template-rows-composition.html

The at (0) and at (1) lines are particularly revealing about what's going on, I think. e.g. these ones:

Compositing: property <grid-template-rows> underlying [50px 10%] from add [100px 100px] to add [200px 20%] at (0) should be [150px calc(100px + 10%)]
assert_equals: expected "150px calc ( 10 % + 100px ) " but got "100px calc ( 0 % + 100px ) "

Compositing: property <grid-template-rows> underlying [50px 10%] from add [100px 100px] to add [200px 20%] at (1) should be [250px 30%]
assert_equals: expected "250px 30 % " but got "200px 20 % "

The "but got" lines here seem to show that we're just directly using the added value, instead of adding it to the base value.

Boris, do you know if we support the underlying features behind these animation-of-an-added-value tests? I'm curious whether this is a bug in this particular grid property vs. us not supporting the underlying animation feature.

Comment 2

[Boris Chiou [:boris]]

We do support the Animate trait (which should include the support of the composition implicitly) for grid-template-{row|column} in https://searchfox.org/mozilla-central/source/servo/components/style/values/animated/grid.rs, so I expect this is a bug. I am going to check what happens on this.

Comment 3

[Boris Chiou [:boris]]

Attachment: Bug 1841313 - Handle addition and accumulation for grid-template-{rows|columns}.

If we unconditionally return Err(()), the entire composition fails and
we use the keyframe values always.

Basically, we should just use the effect value per item when it falls back to
discrete, instead of using the entire grid-template-{rows|columns} effect value,
so we have to implement Procedure::Add and Procedure::Accumulate to avoid
rejecting everything in GridTemplateComponent.

Comment 4

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/49f7cb9f991c
Handle addition and accumulation for grid-template-{rows|columns}. r=emilio

Comment 5

[Noemi Erli[:noemi_erli]]

https://hg.mozilla.org/mozilla-central/rev/49f7cb9f991c

Comment 6

[Ardelean Oana, Desktop Test Engineering [:oardelean]]

Reproducible on a 2023-07-15 Nightly build on macOS 12.
Verified as fixed on Firefox 117.0b9(build ID: 20230817175856) and Nightly 118.0a1(build ID: 20230817214619) on macOS 12, Windows 10, Ubuntu 22.