[css-values] A few more calc() issues in WPT tests

[weinig]

There are a few more discrepancies between my interpretation of the calc() spec and WPT that I want to check on:

https://wpt.fyi/results/css/css-values/calc-infinity-nan-serialize-length.html

This test has two cases that don't seem to be right:

1. 'calc(1 * min(NaN * 2px, NaN * 4em))' as a specified value should serialize as 'min(NaN * 1px, NaN * 1em)'.
2. 'calc(1 * clamp(NaN * 2em, NaN * 4px, NaN * 8pt))' as a specified value should serialize as 'clamp(NaN * 1em, NaN * 1px, NaN * 1px)'.

As far as I can tell, there is nothing that allows the elimination of the "1 *" (as obvious an elimination as it might be), and instead, they should be:

1. 'calc(1 * min(NaN * 2px, NaN * 4em))' as a specified value should serialize as 'calc(1 * min(NaN * 1px, NaN * 1em))'.
2. 'calc(1 * clamp(NaN * 2em, NaN * 4px, NaN * 8pt))' as a specified value should serialize as 'calc(1 * clamp(NaN * 1em, NaN * 1px, NaN * 1px))'.

---

https://wpt.fyi/results/css/css-values/minmax-length-percent-serialize.html

This test has two cases that don't seem right:

1.'max((min(10%, 30px) + 10px) * 2 + 10px, 5em + 5%)' as a specified value should serialize as 'max(10px + ((10px + min(10%, 30px)) * 2), 5% + 5em)'.
2. 'max((min(10%, 30px) + 10px) * 2 + 10px, 5em + 5%)' as a computed value should serialize as 'max(10px + ((10px + min(10%, 30px)) * 2), 5% + 80px)'.

My reading of the serialization section indicates that the 2 should sort before the (10px + min(10%, 30px)) in the product. So they should both serialize as:

max(10px + (2 * (10px + min(10%, 30px))), 5% + 5em)

https://wpt.fyi/results/css/css-values/calc-serialization-002.html also has the same error with the test case calc((min(10px, 20%) + max(1rem, 2%)) * 2).

---

Finally, https://wpt.fyi/results/css/css-values/calc-in-media-queries-with-mixed-units.html

Testcase 9 in this test:

<iframe src="./support/mixed-units-09.html" title="vh*vw/em*px/vh" frameborder="0" height="10" width="100"></iframe>

with the iframe containing the media query:

@media (height: calc(50vw / 0.3125em * 10px)) {

Despite the queries units not matching the title, the math does not work out.

calc(50vw / 0.3125em * 10px) == 50px / 5px * 10px == 100px, but height is 10, so that should fail.

[weinig]

cc @tabatkins

[weinig]

cc'ing authors / reviewers of these changes that I could find: @xiaochengh, @danielsakhapov, @emilio, @brandonmcconnell