1 files changed, 41 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-color/parsing/color-mix-out-of-gamut.html b/testing/web-platform/tests/css/css-color/parsing/color-mix-out-of-gamut.html
new file mode 100644
index 0000000000..d3e8a3560d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-color/parsing/color-mix-out-of-gamut.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Color Level 4: Computation of colors using color-mix() function syntax that result in out-of-gamut sRGB colors</title>
+<link rel="author" title="Sam Weinig" href="mailto:weinig@apple.com">
+<link rel="author" title="Aaron Krajeski" href="mailto:aaronhk@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-5/#color-mix">
+<link rel="help" href="https://drafts.csswg.org/css-color-5/#resolving-mix">
+<link rel="help" href="https://drafts.csswg.org/css-color-5/#serial-color-mix">
+<meta name="assert" content="gamut mapping works for computed value of color-mix()">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/css/support/computed-testcommon.js"></script>
+<script src="/css/support/color-testcommon.js"></script>
+</head>
+<body>
+<div id="target"></div>
+<script>
+    fuzzy_test_computed_color(`color-mix(in hsl, color(display-p3 0 1 0) 100%, rgb(0, 0, 0) 0%)`, `color(srgb -0.511814 1.01832 -0.310726)`);
+    fuzzy_test_computed_color(`color-mix(in hsl, lab(100 104.3 -50.9) 100%, rgb(0, 0, 0) 0%)`, `color(srgb 1.59343 0.58802 1.40564)`);
+    fuzzy_test_computed_color(`color-mix(in hsl, lab(0 104.3 -50.9) 100%, rgb(0, 0, 0) 0%)`, `color(srgb 0.351376 -0.213938 0.299501)`);
+    fuzzy_test_computed_color(`color-mix(in hsl, lch(100 116 334) 100%, rgb(0, 0, 0) 0%)`, `color(srgb 1.59328 0.588284 1.40527)`);
+    fuzzy_test_computed_color(`color-mix(in hsl, lch(0 116 334) 100%, rgb(0, 0, 0) 0%)`, `color(srgb 0.351307 -0.213865 0.299236)`);
+    fuzzy_test_computed_color(`color-mix(in hsl, oklab(1 0.365 -0.16) 100%, rgb(0, 0, 0) 0%)`, `color(srgb 1.59295 0.360371 1.38571)`);
+    fuzzy_test_computed_color(`color-mix(in hsl, oklab(0 0.365 -0.16) 100%, rgb(0, 0, 0) 0%)`, `color(srgb 0.0763893 -0.0456266 0.0932598)`);
+    fuzzy_test_computed_color(`color-mix(in hsl, oklch(1 0.399 336.3) 100%, rgb(0, 0, 0) 0%)`, `color(srgb 1.59328 0.358734 1.38664)`);
+    fuzzy_test_computed_color(`color-mix(in hsl, oklch(0 0.399 336.3) 100%, rgb(0, 0, 0) 0%)`, `color(srgb 0.076536 -0.045825 0.0937443)`);
+
+    fuzzy_test_computed_color(`color-mix(in hwb, color(display-p3 0 1 0) 100%, rgb(0, 0, 0) 0%)`, `color(srgb -0.511814 1.01832 -0.310726)`);
+    fuzzy_test_computed_color(`color-mix(in hwb, lab(100 104.3 -50.9) 100%, rgb(0, 0, 0) 0%)`, `color(srgb 1.59343 0.58802 1.40564)`);
+    fuzzy_test_computed_color(`color-mix(in hwb, lab(0 104.3 -50.9) 100%, rgb(0, 0, 0) 0%)`, `color(srgb 0.351376 -0.213938 0.299501)`);
+    fuzzy_test_computed_color(`color-mix(in hwb, lch(100 116 334) 100%, rgb(0, 0, 0) 0%)`, `color(srgb 1.59328 0.588284 1.40527)`);
+    fuzzy_test_computed_color(`color-mix(in hwb, lch(0 116 334) 100%, rgb(0, 0, 0) 0%)`, `color(srgb 0.351307 -0.213865 0.299236)`);
+    fuzzy_test_computed_color(`color-mix(in hwb, oklab(1 0.365 -0.16) 100%, rgb(0, 0, 0) 0%)`, `color(srgb 1.59295 0.360371 1.38571)`);
+    fuzzy_test_computed_color(`color-mix(in hwb, oklab(0 0.365 -0.16) 100%, rgb(0, 0, 0) 0%)`, `color(srgb 0.0763893 -0.0456266 0.0932598)`);
+    fuzzy_test_computed_color(`color-mix(in hwb, oklch(1 0.399 336.3) 100%, rgb(0, 0, 0) 0%)`, `color(srgb 1.59328 0.358736 1.38664)`);
+    fuzzy_test_computed_color(`color-mix(in hwb, oklch(0 0.399 336.3) 100%, rgb(0, 0, 0) 0%)`, `color(srgb 0.0765361 -0.045825 0.0937443)`);
+</script>
+</body>
+</html>