commit 76e721a0cd752b82703f8443a7ba2771b7db6221 parent 72cf5bd836b9165becb9ce011fd56476cb174858 Author: Christopher Cameron <ccameron@chromium.org> Date: Wed, 3 Dec 2025 14:40:59 +0000 Bug 2001978 [wpt PR 56221] - Add WPT tests for srgb-linear and display-p3-linear PredefinedColorSpace, a=testonly Automatic update from web-platform-tests Add WPT tests for srgb-linear and display-p3-linear PredefinedColorSpace Bug: 454152417 Change-Id: I86e2acf1bbc947054b82c61f96a9bdc654e16d57 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/7082585 Commit-Queue: ccameron chromium <ccameron@chromium.org> Reviewed-by: Philip Jägenstedt <foolip@chromium.org> Cr-Commit-Position: refs/heads/main@{#1549118} -- Resynchronize generated WPT canvas test with the YAML definition https://crrev.com/c/7082585 added a few tests, but the generated test files do not corresponds to the YAML test definition. This CL updates the tests to match the YAML. Change-Id: I6043f97cc1e68e624c81152f8a50e031dad613da Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/7208688 Reviewed-by: Andres Ricardo Perez <andresrperez@chromium.org> Commit-Queue: Jean-Philippe Gravel <jpgravel@chromium.org> Cr-Commit-Position: refs/heads/main@{#1551644} -- wpt-commits: c50b1117d078d749e118e3801ba39f2de0677a0c, 451436260d209b1cb4d67b8f01ef6c615c51f59c wpt-pr: 56221 Diffstat:
7 files changed, 359 insertions(+), 0 deletions(-)
diff --git a/testing/web-platform/tests/html/canvas/element/wide-gamut-canvas/2d.color.space.display-p3-linear.html b/testing/web-platform/tests/html/canvas/element/wide-gamut-canvas/2d.color.space.display-p3-linear.html @@ -0,0 +1,51 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<meta charset="UTF-8"> +<title>Canvas test: 2d.color.space.display-p3-linear</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.color.space.display-p3-linear</h1> +<p class="desc">test getImageData color conversion with a display-p3-linear uint8 canvas</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test("test getImageData color conversion with a display-p3-linear uint8 canvas"); +_addTest(function(canvas, ctx) { + + const color_style = 'color(display-p3-linear 0.0392 0.3922 0.7843)'; + // [0.0392, 0.3922, 0.7843, 1.0] * 255 = [10, 100, 200, 255] + const epsilon = 2; + ctx.fillStyle = color_style; + ctx.fillRect(0, 0, 10, 10); + + // Read without specifying a color space. The result should be the specified + // color. + let pixel_expected = [10, 100, 200, 255]; + let image_data = ctx.getImageData(5, 5, 1, 1); + _assertSame(image_data.colorSpace, "display-p3-linear", "image_data.colorSpace", "\"display-p3-linear\""); + assert_approx_equals(image_data.data[0], pixel_expected[0], 2); + assert_approx_equals(image_data.data[1], pixel_expected[1], 2); + assert_approx_equals(image_data.data[2], pixel_expected[2], 2); + assert_approx_equals(image_data.data[3], pixel_expected[3], 2); + + // Read back to display-p3. This will convert from linear to sRGB transfer + // function. + pixel_expected = [58, 168, 229, 255]; + image_data = ctx.getImageData(5, 5, 1, 1, {colorSpace:"display-p3"}); + _assertSame(image_data.colorSpace, "display-p3", "image_data.colorSpace", "\"display-p3\""); + assert_approx_equals(image_data.data[0], pixel_expected[0], 2); + assert_approx_equals(image_data.data[1], pixel_expected[1], 2); + assert_approx_equals(image_data.data[2], pixel_expected[2], 2); + assert_approx_equals(image_data.data[3], pixel_expected[3], 2); + +}, {colorSpace: "display-p3-linear"}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/wide-gamut-canvas/2d.color.space.srgb-linear.html b/testing/web-platform/tests/html/canvas/element/wide-gamut-canvas/2d.color.space.srgb-linear.html @@ -0,0 +1,51 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<meta charset="UTF-8"> +<title>Canvas test: 2d.color.space.srgb-linear</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.color.space.srgb-linear</h1> +<p class="desc">test getImageData color conversion with a srgb-linear uint8 canvas</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test("test getImageData color conversion with a srgb-linear uint8 canvas"); +_addTest(function(canvas, ctx) { + + const color_style = 'color(srgb-linear 0.0392 0.3922 0.7843)'; + // [0.0392, 0.3922, 0.7843, 1.0] * 255 = [10, 100, 200, 255] + const epsilon = 2; + ctx.fillStyle = color_style; + ctx.fillRect(0, 0, 10, 10); + + // Read without specifying a color space. The result should be the specified + // color. + let pixel_expected = [10, 100, 200, 255]; + let image_data = ctx.getImageData(5, 5, 1, 1); + _assertSame(image_data.colorSpace, "srgb-linear", "image_data.colorSpace", "\"srgb-linear\""); + assert_approx_equals(image_data.data[0], pixel_expected[0], 2); + assert_approx_equals(image_data.data[1], pixel_expected[1], 2); + assert_approx_equals(image_data.data[2], pixel_expected[2], 2); + assert_approx_equals(image_data.data[3], pixel_expected[3], 2); + + // Read back to srgb. This will convert from linear to sRGB transfer + // function. + pixel_expected = [58, 168, 229, 255]; + image_data = ctx.getImageData(5, 5, 1, 1, {colorSpace:"srgb"}); + _assertSame(image_data.colorSpace, "srgb", "image_data.colorSpace", "\"srgb\""); + assert_approx_equals(image_data.data[0], pixel_expected[0], 2); + assert_approx_equals(image_data.data[1], pixel_expected[1], 2); + assert_approx_equals(image_data.data[2], pixel_expected[2], 2); + assert_approx_equals(image_data.data[3], pixel_expected[3], 2); + +}, {colorSpace: "srgb-linear"}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/offscreen/wide-gamut-canvas/2d.color.space.display-p3-linear.html b/testing/web-platform/tests/html/canvas/offscreen/wide-gamut-canvas/2d.color.space.display-p3-linear.html @@ -0,0 +1,52 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<meta charset="UTF-8"> +<title>OffscreenCanvas test: 2d.color.space.display-p3-linear</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> + +<h1>2d.color.space.display-p3-linear</h1> +<p class="desc">test getImageData color conversion with a display-p3-linear uint8 canvas</p> + + +<script> +var t = async_test("test getImageData color conversion with a display-p3-linear uint8 canvas"); +var t_pass = t.done.bind(t); +var t_fail = t.step_func(function(reason) { + throw reason; +}); +t.step(function() { + + var canvas = new OffscreenCanvas(100, 50); + var ctx = canvas.getContext('2d', {colorSpace: "display-p3-linear"}); + + const color_style = 'color(display-p3-linear 0.0392 0.3922 0.7843)'; + // [0.0392, 0.3922, 0.7843, 1.0] * 255 = [10, 100, 200, 255] + const epsilon = 2; + ctx.fillStyle = color_style; + ctx.fillRect(0, 0, 10, 10); + + // Read without specifying a color space. The result should be the specified + // color. + let pixel_expected = [10, 100, 200, 255]; + let image_data = ctx.getImageData(5, 5, 1, 1); + _assertSame(image_data.colorSpace, "display-p3-linear", "image_data.colorSpace", "\"display-p3-linear\""); + assert_approx_equals(image_data.data[0], pixel_expected[0], 2); + assert_approx_equals(image_data.data[1], pixel_expected[1], 2); + assert_approx_equals(image_data.data[2], pixel_expected[2], 2); + assert_approx_equals(image_data.data[3], pixel_expected[3], 2); + + // Read back to display-p3. This will convert from linear to sRGB transfer + // function. + pixel_expected = [58, 168, 229, 255]; + image_data = ctx.getImageData(5, 5, 1, 1, {colorSpace:"display-p3"}); + _assertSame(image_data.colorSpace, "display-p3", "image_data.colorSpace", "\"display-p3\""); + assert_approx_equals(image_data.data[0], pixel_expected[0], 2); + assert_approx_equals(image_data.data[1], pixel_expected[1], 2); + assert_approx_equals(image_data.data[2], pixel_expected[2], 2); + assert_approx_equals(image_data.data[3], pixel_expected[3], 2); + t.done(); + +}); +</script> diff --git a/testing/web-platform/tests/html/canvas/offscreen/wide-gamut-canvas/2d.color.space.display-p3-linear.worker.js b/testing/web-platform/tests/html/canvas/offscreen/wide-gamut-canvas/2d.color.space.display-p3-linear.worker.js @@ -0,0 +1,46 @@ +// DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. +// OffscreenCanvas test in a worker:2d.color.space.display-p3-linear +// Description:test getImageData color conversion with a display-p3-linear uint8 canvas +// Note: + +importScripts("/resources/testharness.js"); +importScripts("/html/canvas/resources/canvas-tests.js"); + +var t = async_test("test getImageData color conversion with a display-p3-linear uint8 canvas"); +var t_pass = t.done.bind(t); +var t_fail = t.step_func(function(reason) { + throw reason; +}); +t.step(function() { + + var canvas = new OffscreenCanvas(100, 50); + var ctx = canvas.getContext('2d', {colorSpace: "display-p3-linear"}); + + const color_style = 'color(display-p3-linear 0.0392 0.3922 0.7843)'; + // [0.0392, 0.3922, 0.7843, 1.0] * 255 = [10, 100, 200, 255] + const epsilon = 2; + ctx.fillStyle = color_style; + ctx.fillRect(0, 0, 10, 10); + + // Read without specifying a color space. The result should be the specified + // color. + let pixel_expected = [10, 100, 200, 255]; + let image_data = ctx.getImageData(5, 5, 1, 1); + _assertSame(image_data.colorSpace, "display-p3-linear", "image_data.colorSpace", "\"display-p3-linear\""); + assert_approx_equals(image_data.data[0], pixel_expected[0], 2); + assert_approx_equals(image_data.data[1], pixel_expected[1], 2); + assert_approx_equals(image_data.data[2], pixel_expected[2], 2); + assert_approx_equals(image_data.data[3], pixel_expected[3], 2); + + // Read back to display-p3. This will convert from linear to sRGB transfer + // function. + pixel_expected = [58, 168, 229, 255]; + image_data = ctx.getImageData(5, 5, 1, 1, {colorSpace:"display-p3"}); + _assertSame(image_data.colorSpace, "display-p3", "image_data.colorSpace", "\"display-p3\""); + assert_approx_equals(image_data.data[0], pixel_expected[0], 2); + assert_approx_equals(image_data.data[1], pixel_expected[1], 2); + assert_approx_equals(image_data.data[2], pixel_expected[2], 2); + assert_approx_equals(image_data.data[3], pixel_expected[3], 2); + t.done(); +}); +done(); diff --git a/testing/web-platform/tests/html/canvas/offscreen/wide-gamut-canvas/2d.color.space.srgb-linear.html b/testing/web-platform/tests/html/canvas/offscreen/wide-gamut-canvas/2d.color.space.srgb-linear.html @@ -0,0 +1,52 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<meta charset="UTF-8"> +<title>OffscreenCanvas test: 2d.color.space.srgb-linear</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> + +<h1>2d.color.space.srgb-linear</h1> +<p class="desc">test getImageData color conversion with a srgb-linear uint8 canvas</p> + + +<script> +var t = async_test("test getImageData color conversion with a srgb-linear uint8 canvas"); +var t_pass = t.done.bind(t); +var t_fail = t.step_func(function(reason) { + throw reason; +}); +t.step(function() { + + var canvas = new OffscreenCanvas(100, 50); + var ctx = canvas.getContext('2d', {colorSpace: "srgb-linear"}); + + const color_style = 'color(srgb-linear 0.0392 0.3922 0.7843)'; + // [0.0392, 0.3922, 0.7843, 1.0] * 255 = [10, 100, 200, 255] + const epsilon = 2; + ctx.fillStyle = color_style; + ctx.fillRect(0, 0, 10, 10); + + // Read without specifying a color space. The result should be the specified + // color. + let pixel_expected = [10, 100, 200, 255]; + let image_data = ctx.getImageData(5, 5, 1, 1); + _assertSame(image_data.colorSpace, "srgb-linear", "image_data.colorSpace", "\"srgb-linear\""); + assert_approx_equals(image_data.data[0], pixel_expected[0], 2); + assert_approx_equals(image_data.data[1], pixel_expected[1], 2); + assert_approx_equals(image_data.data[2], pixel_expected[2], 2); + assert_approx_equals(image_data.data[3], pixel_expected[3], 2); + + // Read back to srgb. This will convert from linear to sRGB transfer + // function. + pixel_expected = [58, 168, 229, 255]; + image_data = ctx.getImageData(5, 5, 1, 1, {colorSpace:"srgb"}); + _assertSame(image_data.colorSpace, "srgb", "image_data.colorSpace", "\"srgb\""); + assert_approx_equals(image_data.data[0], pixel_expected[0], 2); + assert_approx_equals(image_data.data[1], pixel_expected[1], 2); + assert_approx_equals(image_data.data[2], pixel_expected[2], 2); + assert_approx_equals(image_data.data[3], pixel_expected[3], 2); + t.done(); + +}); +</script> diff --git a/testing/web-platform/tests/html/canvas/offscreen/wide-gamut-canvas/2d.color.space.srgb-linear.worker.js b/testing/web-platform/tests/html/canvas/offscreen/wide-gamut-canvas/2d.color.space.srgb-linear.worker.js @@ -0,0 +1,46 @@ +// DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. +// OffscreenCanvas test in a worker:2d.color.space.srgb-linear +// Description:test getImageData color conversion with a srgb-linear uint8 canvas +// Note: + +importScripts("/resources/testharness.js"); +importScripts("/html/canvas/resources/canvas-tests.js"); + +var t = async_test("test getImageData color conversion with a srgb-linear uint8 canvas"); +var t_pass = t.done.bind(t); +var t_fail = t.step_func(function(reason) { + throw reason; +}); +t.step(function() { + + var canvas = new OffscreenCanvas(100, 50); + var ctx = canvas.getContext('2d', {colorSpace: "srgb-linear"}); + + const color_style = 'color(srgb-linear 0.0392 0.3922 0.7843)'; + // [0.0392, 0.3922, 0.7843, 1.0] * 255 = [10, 100, 200, 255] + const epsilon = 2; + ctx.fillStyle = color_style; + ctx.fillRect(0, 0, 10, 10); + + // Read without specifying a color space. The result should be the specified + // color. + let pixel_expected = [10, 100, 200, 255]; + let image_data = ctx.getImageData(5, 5, 1, 1); + _assertSame(image_data.colorSpace, "srgb-linear", "image_data.colorSpace", "\"srgb-linear\""); + assert_approx_equals(image_data.data[0], pixel_expected[0], 2); + assert_approx_equals(image_data.data[1], pixel_expected[1], 2); + assert_approx_equals(image_data.data[2], pixel_expected[2], 2); + assert_approx_equals(image_data.data[3], pixel_expected[3], 2); + + // Read back to srgb. This will convert from linear to sRGB transfer + // function. + pixel_expected = [58, 168, 229, 255]; + image_data = ctx.getImageData(5, 5, 1, 1, {colorSpace:"srgb"}); + _assertSame(image_data.colorSpace, "srgb", "image_data.colorSpace", "\"srgb\""); + assert_approx_equals(image_data.data[0], pixel_expected[0], 2); + assert_approx_equals(image_data.data[1], pixel_expected[1], 2); + assert_approx_equals(image_data.data[2], pixel_expected[2], 2); + assert_approx_equals(image_data.data[3], pixel_expected[3], 2); + t.done(); +}); +done(); diff --git a/testing/web-platform/tests/html/canvas/tools/yaml/color_space.yaml b/testing/web-platform/tests/html/canvas/tools/yaml/color_space.yaml @@ -310,3 +310,64 @@ t.done(); }); }); + +- name: 2d.color.space.srgb-linear + desc: test getImageData color conversion with a srgb-linear uint8 canvas + attributes: '{colorSpace: "srgb-linear"}' + code: | + const color_style = 'color(srgb-linear 0.0392 0.3922 0.7843)'; + // [0.0392, 0.3922, 0.7843, 1.0] * 255 = [10, 100, 200, 255] + const epsilon = 2; + ctx.fillStyle = color_style; + ctx.fillRect(0, 0, 10, 10); + + // Read without specifying a color space. The result should be the specified + // color. + let pixel_expected = [10, 100, 200, 255]; + let image_data = ctx.getImageData(5, 5, 1, 1); + @assert image_data.colorSpace === "srgb-linear"; + assert_approx_equals(image_data.data[0], pixel_expected[0], 2); + assert_approx_equals(image_data.data[1], pixel_expected[1], 2); + assert_approx_equals(image_data.data[2], pixel_expected[2], 2); + assert_approx_equals(image_data.data[3], pixel_expected[3], 2); + + // Read back to srgb. This will convert from linear to sRGB transfer + // function. + pixel_expected = [58, 168, 229, 255]; + image_data = ctx.getImageData(5, 5, 1, 1, {colorSpace:"srgb"}); + @assert image_data.colorSpace === "srgb"; + assert_approx_equals(image_data.data[0], pixel_expected[0], 2); + assert_approx_equals(image_data.data[1], pixel_expected[1], 2); + assert_approx_equals(image_data.data[2], pixel_expected[2], 2); + assert_approx_equals(image_data.data[3], pixel_expected[3], 2); + +- name: 2d.color.space.display-p3-linear + desc: test getImageData color conversion with a display-p3-linear uint8 canvas + attributes: '{colorSpace: "display-p3-linear"}' + code: | + const color_style = 'color(display-p3-linear 0.0392 0.3922 0.7843)'; + // [0.0392, 0.3922, 0.7843, 1.0] * 255 = [10, 100, 200, 255] + const epsilon = 2; + ctx.fillStyle = color_style; + ctx.fillRect(0, 0, 10, 10); + + // Read without specifying a color space. The result should be the specified + // color. + let pixel_expected = [10, 100, 200, 255]; + let image_data = ctx.getImageData(5, 5, 1, 1); + @assert image_data.colorSpace === "display-p3-linear"; + assert_approx_equals(image_data.data[0], pixel_expected[0], 2); + assert_approx_equals(image_data.data[1], pixel_expected[1], 2); + assert_approx_equals(image_data.data[2], pixel_expected[2], 2); + assert_approx_equals(image_data.data[3], pixel_expected[3], 2); + + // Read back to display-p3. This will convert from linear to sRGB transfer + // function. + pixel_expected = [58, 168, 229, 255]; + image_data = ctx.getImageData(5, 5, 1, 1, {colorSpace:"display-p3"}); + @assert image_data.colorSpace === "display-p3"; + assert_approx_equals(image_data.data[0], pixel_expected[0], 2); + assert_approx_equals(image_data.data[1], pixel_expected[1], 2); + assert_approx_equals(image_data.data[2], pixel_expected[2], 2); + assert_approx_equals(image_data.data[3], pixel_expected[3], 2); +