Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[css-color] Values in relative-color-out-of-gamut.html seem slightly wrong. #45147

Open
romainmenke opened this issue Mar 16, 2024 · 6 comments · May be fixed by #49680
Open

[css-color] Values in relative-color-out-of-gamut.html seem slightly wrong. #45147

romainmenke opened this issue Mar 16, 2024 · 6 comments · May be fixed by #49680
Labels
css-color

Comments

@romainmenke
Copy link
Contributor

romainmenke commented Mar 16, 2024 •
edited
Loading

wpt/css/css-color/parsing/relative-color-out-of-gamut.html

Lines 24 to 52 in 6018167

fuzzy_test_computed_color(`rgb(from color(display-p3 0 1 0) r g b / alpha)`, `color(srgb -0.511814 1.01832 -0.310726)`);
fuzzy_test_computed_color(`rgb(from lab(100 104.3 -50.9) r g b)`, `color(srgb 1.59343 0.58802 1.40564)`);
fuzzy_test_computed_color(`rgb(from lab(0 104.3 -50.9) r g b)`, `color(srgb 0.351376 -0.213938 0.299501)`);
fuzzy_test_computed_color(`rgb(from lch(100 116 334) r g b)`, `color(srgb 1.59328 0.58828 1.40527)`);
fuzzy_test_computed_color(`rgb(from lch(0 116 334) r g b)`, `color(srgb 0.351307 -0.213865 0.299236)`);
fuzzy_test_computed_color(`rgb(from oklab(1 0.365 -0.16) r g b)`, `color(srgb 1.59295 0.360371 1.38571)`);
fuzzy_test_computed_color(`rgb(from oklab(0 0.365 -0.16) r g b)`, `color(srgb 0.0763893 -0.0456266 0.0932598)`);
fuzzy_test_computed_color(`rgb(from oklch(1 0.399 336.3) r g b)`, `color(srgb 1.59328 0.358736 1.38663)`);
fuzzy_test_computed_color(`rgb(from oklch(0 0.399 336.3) r g b)`, `color(srgb 0.0765362 -0.045825 0.0937443)`);
fuzzy_test_computed_color(`hsl(from color(display-p3 0 1 0) h s l / alpha)`, `color(srgb -0.511814 1.01832 -0.310726)`);
fuzzy_test_computed_color(`hsl(from lab(100 104.3 -50.9) h s l)`, `color(srgb 1.59343 0.58802 1.40564)`);
fuzzy_test_computed_color(`hsl(from lab(0 104.3 -50.9) h s l)`, `color(srgb 0.351376 -0.213938 0.299502)`);
fuzzy_test_computed_color(`hsl(from lch(100 116 334) h s l)`, `color(srgb 1.59328 0.58828 1.40527)`);
fuzzy_test_computed_color(`hsl(from lch(0 116 334) h s l)`, `color(srgb 0.351307 -0.213865 0.299236)`);
fuzzy_test_computed_color(`hsl(from oklab(1 0.365 -0.16) h s l)`, `color(srgb 1.59295 0.360371 1.38571)`);
fuzzy_test_computed_color(`hsl(from oklab(0 0.365 -0.16) h s l)`, `color(srgb 0.0763893 -0.0456266 0.0932598)`);
fuzzy_test_computed_color(`hsl(from oklch(1 0.399 336.3) h s l)`, `color(srgb 1.59328 0.358736 1.38663)`);
fuzzy_test_computed_color(`hsl(from oklch(0 0.399 336.3) h s l)`, `color(srgb 0.0765362 -0.045825 0.0937443)`);
fuzzy_test_computed_color(`hwb(from color(display-p3 0 1 0) h w b / alpha)`, `color(srgb -0.511814 1.01832 -0.310726)`);
fuzzy_test_computed_color(`hwb(from lab(100 104.3 -50.9) h w b)`, `color(srgb 1.59343 0.58802 1.40564)`);
fuzzy_test_computed_color(`hwb(from lab(0 104.3 -50.9) h w b)`, `color(srgb 0.351376 -0.213938 0.299502)`);
fuzzy_test_computed_color(`hwb(from lch(100 116 334) h w b)`, `color(srgb 1.59328 0.58828 1.40527)`);
fuzzy_test_computed_color(`hwb(from lch(0 116 334) h w b)`, `color(srgb 0.351307 -0.213865 0.299236)`);
fuzzy_test_computed_color(`hwb(from oklab(1 0.365 -0.16) h w b)`, `color(srgb 1.59295 0.360371 1.38571)`);
fuzzy_test_computed_color(`hwb(from oklab(0 0.365 -0.16) h w b)`, `color(srgb 0.0763894 -0.0456266 0.0932598)`);
fuzzy_test_computed_color(`hwb(from oklch(1 0.399 336.3) h w b)`, `color(srgb 1.59328 0.358736 1.38664)`);
fuzzy_test_computed_color(`hwb(from oklch(0 0.399 336.3) h w b)`, `color(srgb 0.0765362 -0.045825 0.0937443)`);

When verifying various tests for css-color I noticed that I get different results here.

For example:

rgb(from color(display-p3 0 1 0) r g b / alpha)

results:

  • color(srgb -0.511814 1.01832 -0.310726) (wpt)
  • color(srgb -0.5116 1.01827 -0.31067) (my results)
  • color(srgb -0.5116 1.01827 -0.31067) (colorjs.io)

I am not sure if the recorded values in the tests are slightly wrong, or if maybe Chrome is slightly wrong.

@svgeesus Are implementations expected to have interop to this degree?
If so, then there should be tests for this.

@mysteryDate I think you submitted these tests, is there anything you can think of that could explain this difference?

Maybe we should just reduce the precision of the value to match the epsilon of the fuzzy tests.

Note:
fuzzy_test_computed_color has a default epsilon of 0.01 so these tests are checking the full values.

Note:
Although these tests are related to gamut mapping, they actually test that no gamut mapping happens for specific values. So this is a general issue, not a gamut mapping bug.
@romainmenke romainmenke changed the title [css-color] Values relative-color-out-of-gamut.html seem slightly wrong. [css-color] Values in relative-color-out-of-gamut.html seem slightly wrong. Mar 16, 2024
@svgeesus
Copy link
Contributor

@svgeesus Are implementations expected to have interop to this degree?
If so, then there should be tests for this.

They could have.

There was a bunch of detailed work done over the last few years, some in CSS Color 4 and some in color.js, often in parallel, to really reduce sources of cumulative error like slightly-different white points, inverse matrices calculated from rounded-off values, and so forth.

In most but not all cases, the result of this was better precision but well below the level of a visual difference.

My suspicion is that browser implementers could usefully check their matrix values against the current ones in sample code which are now as accurate as we can make them for 64bit floats, and update as needed.

@romainmenke
Copy link
Contributor Author

A quick glance in WebKit at least shows that they have outdated matrix values:

sample code :
https://github.com/w3c/csswg-drafts/blob/ed383b552d3c977ad18116d8038c73d2c997f5a3/css-color-4/conversions.js#L159-L161

	var M = [
		[ 0.79776664490064230,  0.13518129740053308,  0.03134773412839220 ],
		[ 0.28807482881940130,  0.71183523424187300,  0.00008993693872564 ],
		[ 0.00000000000000000,  0.00000000000000000,  0.82510460251046020 ]
	];

WebKit:
https://github.com/WebKit/WebKit/blob/bf9bfb5b39381e185808dedaed839b86cd4d52ec/Source/WebCore/platform/graphics/ColorTypes.h#L430-L432

    static constexpr ColorMatrix<3, 3> linearToXYZ {
        0.7977604896723027f,  0.13518583717574031f,  0.0313493495815248f,
        0.2880711282292934f,  0.7118432178101014f,   0.00008565396060525902f,
        0.0f,                 0.0f,                  0.8251046025104601f
    };

@svgeesus
Copy link
Contributor

@weinig could you take a look? The difference will not be visible to the eye (mostly, unless errors accumulate through a chain of conversions) but could cause automatic tests to fail.

It looks here as if the fuzziness of the fuzzy test is set rather high, to mask these differences. But WPT should be using the correct results here. The sample code uses rational number where possible (it isn't, for prophoto) so should be accurate to 64 bits.

@svgeesus
Copy link
Contributor

svgeesus commented Dec 13, 2024 •
edited
Loading

@weinig @myst729 do you agree with my reasoning?

@romainmenke could you submit a PR to fix those tests, and also to tighten up the fuzziness a bit? Regardless of the accuracy required to pass the tests, the tested values should always be the correct ones.

@romainmenke romainmenke linked a pull request Dec 13, 2024 that will close this issue
Open
@romainmenke
Copy link
Contributor Author

romainmenke commented Dec 13, 2024 •
edited
Loading

I've opened a PR to fix these tests: #49680

Safari (Preview) seems to now get it right, other engines not so much.

@weinig
Copy link
Contributor

weinig commented Dec 16, 2024

Yeah, all looks good to me. Thanks for fixing the tests! (I updated webkit with the new matrices a number of months ago, so it makes sense Safari works).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
css-color
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

[css-color] fix relative-color-out-of-gamut.html value precision romainmenke/wpt
4 participants
@gsnedders @weinig @svgeesus @romainmenke