[css-values-4] How to serialize calc(100% - 100% + 1em) at computed-value time

[TalbotG]

§10.7. Computed Value states:

calc(100% - 100% + 1em) resolves to calc(1em + 0%), not to 1em

https://drafts.csswg.org/css-values-4/#calc-computed-value

but shouldn't that be instead:

"calc(100% - 100% + 1em) resolves to calc(0% + 16px), not to 16px", assuming 1em = 16px ?
Either this is the case or last parg of Example 35 (following below) misleads and creates confusion.

A value like calc(20px + 2em) would serialize as calc(2em + 20px) as a specified value (maintaining both units as they’re incompatible at specified-value time, but sorting them alphabetically), or as something like 52px as a computed value (em values are converted to absolute lengths at computed-value time, so assuming 1em = 16px, they combine into 52px, which then drops the calc() wrapper.)

[TalbotG]

http://www.gtalbot.org/BrowserBugsSection/CSS3Values/getComputedStyle-calc-background-position-percent-012.html

Firefox 68 and Epiphany Technological Preview 3.31.90-8061c1929 (WebKitGTK 2.24.0) pass this test .

Chromium 73.0.3683.75 and Chromium 75.0.3753.0 return "16px 50%" instead of the expected "calc(0% + 16px) 50%" .

[TalbotG]

A note in § 10.9 Serialization states:

(...) em and px are obviously different at specified-value time, but at computed-value time they’re both absolutized to px.

https://drafts.csswg.org/css-values-4/#calc-serialize
https://www.w3.org/TR/css-values-4/#calc-serialize

[tabatkins]

You are correct, that example is wrong and should be showing a px result. The em part isn't important, so I'll just change it to a px value so I don't need to add additional text implying an em->px conversion ratio.

[TalbotG]

Don't you need to also change the sorting order of terms too? Percentage precedes dimension.

[ewilligers]

Percentage first. PR uploaded.