Bug 223875 – WPT failures due to calc() serialization

• Component: CSS
• Status: RESOLVED CONFIGURATION CHANGED

[Antoine Quint]

We fail several animation-related tests due to how calc() is serialized.

[Antoine Quint]

Some affected tests:

    - css-values/animations/calc-interpolation.html
    - css-transitions/animations/vertical-align-interpolation.html
    - css-backgrounds/animations/background-position-origin-interpolation.html
    - css-backgrounds/animations/border-image-width-interpolation.html

There may be more.

[Simon Fraser (smfr)]

Linky?

[Antoine Quint]

It would probably be wise to start with https://wpt.fyi/results/css/css-values/animations/calc-interpolation.html?label=master&label=experimental&aligned. My guess is that other test failures are all due to issues that are present in this test.

[Antoine Quint]

Other WPT tests under css/ which have calc-related issues:

    - css-backgrounds/animations/background-position-interpolation.html
    - css-backgrounds/animations/border-radius-interpolation.html
    - css-shapes/animation/shape-outside-interpolation.html

[Radar WebKit Bug Importer]

<rdar://problem/76207315>

[Antoine Quint]

Bug 224322 will already improve the situation but not fix every case.

[Antoine Quint]

Here's an example where we fail to simplify at all:

<div style="border-top-left-radius: calc(5px + (0.5 * (100% - 80px)))">
<script>
    console.assert(document.querySelector("div").style.borderTopLeftRadius == "calc(50% - 35px)");
</script>

[Antoine Quint]

Bug 224376 will fix some more cases.

[Antoine Quint]

Yet more cases will be fixed by bug 224611.

[Antoine Quint]

A few more cases are covered by bug 224670.

[Antoine Quint]

The issues I was tracking are all fixed by the fixed bugs this bug depended on. Closing.