From 70be0131ffbcf564d2557c78fdc93bcbf4b1d605 Mon Sep 17 00:00:00 2001
From: Aaron Krajeski <aaronhk@chromium.org>
Date: Thu, 3 Nov 2022 08:24:43 -0700
Subject: [PATCH] Allow for color parameters to be slightly different

Many WPT tests are looking for exact equality in color channels for
things like interpolation and color space conversion. This CL adds
an epsilon tolerance to the tests.

color-computed-relative-color-expected.txt and
color-computed-color-function-expected.txt need to be updated because
failure messages have changed.

color-computed-color-mix-function-expected.txt goes from 255 PASS,
249 FAIL to 289 PASS, 185 FAIL with this CL. Remaining failures all
look like hue interpolation/premultipliation issues.

Bug: 1092638
Change-Id: Ic8646fd790b29e5bb8461453208c246c7531c639
---
 css/support/computed-testcommon.js | 30 +++++++++++++++++++++++++++++-
 1 file changed, 29 insertions(+), 1 deletion(-)

diff --git a/css/support/computed-testcommon.js b/css/support/computed-testcommon.js
index 3d1c7184422fea7..e8d3a523477e116 100644
--- a/css/support/computed-testcommon.js
+++ b/css/support/computed-testcommon.js
@@ -25,7 +25,10 @@ function test_computed_value(property, specified, computed, titleExtra) {
     if (Array.isArray(computed)) {
       assert_in_array(readValue, computed);
     } else {
-      assert_equals(readValue, computed);
+      if (property == "color")
+        colorValuesAlmostEqual(readValue, computed, 0.0001);
+      else
+        assert_equals(readValue, computed);
     }
     if (readValue !== specified) {
       target.style[property] = '';
@@ -36,6 +39,31 @@ function test_computed_value(property, specified, computed, titleExtra) {
   }, `Property ${property} value '${specified}'${titleExtra ? ' ' + titleExtra : ''}`);
 }
 
+function colorValuesAlmostEqual(color1, color2, epsilon) {
+  // Colors can be split by spaces, commas or the '(' character.
+  const colorElementDividers = /( |\(|,)/;
+  // Return the string stripped of numbers.
+  function getNonNumbers(color) {
+    return color.replace(/[0-9]/g, '');
+  }
+  // Return an array of all numbers in the color.
+  function getNumbers(color) {
+    const result = [];
+    // const entries = color.split(colorElementDividers);
+    color.split(colorElementDividers).forEach(element => {
+      const numberElement = parseFloat(element);
+      if (!isNaN(numberElement)) {
+        result.push(numberElement);
+      }
+    });
+    return result;
+  }
+
+  assert_array_approx_equals(getNumbers(color1), getNumbers(color2), epsilon, "Numeric parameters are approximately equal.");
+  // Assert that the text of the two colors are equal. i.e. colorSpace, colorFunction and format.
+  assert_equals(getNonNumbers(color1), getNonNumbers(color2), "Color format is correct.");
+}
+
 function testComputedValueGreaterOrLowerThan(property, specified, expected, titleExtra) {
     test(() => {
       const target = document.getElementById('target');