tor-browser

commit b362247c2b08faafc8c2169ddce46b93d3b18809
parent a2b9bcebe2f43d68cc43884539b7142d720a90ed
Author: moonira <moonira@google.com>
Date:   Mon,  5 Jan 2026 10:23:35 +0000

Bug 2008351 [wpt PR 56961] - Support property dependent random() function inside colour values, a=testonly

Automatic update from web-platform-tests
Support property dependent random() function inside colour values

If no random identifier is specified, we need to use the property name
and value index as the name in the cache key. Add support for this
in CSSRelativeColorValue, CSSUnresolvedColorValue, CSSColorMixValue,
so that we will use the correct name for random() inside a color
function value.

Bug: 413385732
Change-Id: Ib4ae499173cdef6e93cd96086395200f82606972
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/7277446
Reviewed-by: Rune Lillesveen <futhark@chromium.org>
Commit-Queue: Munira Tursunova <moonira@google.com>
Cr-Commit-Position: refs/heads/main@{#1563900}

--

wpt-commits: 90dec55e6e9a18b57176ee3071fd5994f614a67b
wpt-pr: 56961

Diffstat:
M
testing/web-platform/tests/css/css-values/random-computed.tentative.html
 | 
29
++++++++++++++++++++++++++++-
M
testing/web-platform/tests/css/css-values/random-serialize.tentative.html
 | 
3
+++

2 files changed, 31 insertions(+), 1 deletion(-)
diff --git a/testing/web-platform/tests/css/css-values/random-computed.tentative.html b/testing/web-platform/tests/css/css-values/random-computed.tentative.html
@@ -46,9 +46,10 @@
     left: random(element-shared, 0px, 100000px);
     right: random(element-shared, 0px, 100000px);
     margin: random(element-shared 0px, 100000px) random(element-shared 0px, 100000px);
-    translate: random(10%, 30%);
+    translate: random(element-shared, 10%, 30%);
     scale: random(element-shared, 1, 3) random(element-shared, 3, 9);
     math-depth: add(random(element-shared, 1, 100));
+    color: color-mix(in srgb, rgb(from blue random(51, 10) random(g + 51, g) random(b, b)), rgb(random(21, 10) 0 0));
   }
   .randomIdentifier {
     width: random(--identifier, 0px, 100px);
@@ -325,6 +326,9 @@ test_random_base_is_not_1('width', 'random(fixed random(1, 2), 10px, 100px)');
 test_random_computed_value_has_fixed('translate', 'random(fixed random(-2, -1), 10%, 100%)', '10%', '100%', 0);
 
 // Random inside function
+test_random_computed_value('color', 'rgb(random(30, 10) random(60, 10) random(90, 10))', 'rgb(30, 60, 90)');
+test_random_computed_value('color', 'rgb(from blue random(51, 10) random(g + 51, g) random(b, b))', 'color(srgb 0.2 0.2 1)');
+test_random_computed_value('color', 'color-mix(in srgb, rgb(random(30, 10) 0 0), rgb(random(21, 10) 0 0))', 'color(srgb 0.1 0 0)');
 test_random_computed_value('math-depth', 'add(random(30, 10))', '30');
 
 // Test random value sharing
@@ -588,6 +592,29 @@ test(() => {
       t2.className = 'randomMatchElement';
       holder.appendChild(t2);
 
+      let t1ComputedColor = getComputedStyle(t1)['color'];
+      let t2ComputedColor = getComputedStyle(t2)['color'];
+      test_random_equals(t1ComputedColor, t2ComputedColor,
+                         "color values on different elements should be equal");
+    }
+  } finally {
+    document.body.removeChild(holder);
+  }
+}, `Shared between elements within a property, random inside color functions: random(element-shared, a, b)`);
+
+test(() => {
+  const holder = document.createElement('div');
+  document.body.appendChild(holder);
+
+  try {
+    for (i = 0; i < iterations; ++i) {
+      const t1 = document.createElement('div');
+      t1.className = 'randomMatchElement';
+      holder.appendChild(t1);
+      const t2 = document.createElement('div');
+      t2.className = 'randomMatchElement';
+      holder.appendChild(t2);
+
       let t1ComputedWidth = getComputedStyle(t1)['translate'];
       let t2ComputedWidth = getComputedStyle(t2)['translate'];
 
diff --git a/testing/web-platform/tests/css/css-values/random-serialize.tentative.html b/testing/web-platform/tests/css/css-values/random-serialize.tentative.html
@@ -44,6 +44,9 @@ test_valid_value('width', 'random(fixed calc(2 / 4), 0px, 100px)', 'random(fixed
 // Test nested in expressions
 test_valid_value('width', 'calc(2 * random(0px, 100px))');
 test_valid_value('math-depth', 'add(random(0, 3))');
+test_valid_value('color', 'rgb(random(0, 255) random(0, 255) random(0, 255))');
+test_valid_value('color', 'rgb(from blue r g random(b, (150 + b)))');
+test_valid_value('color', 'color-mix(in srgb, rgb(random(0, 255) 0 random(0, 255)), rgb(0 random(0, 255) 0))');
 
 // Test other types
 test_valid_value('max-lines', 'random(25, 50)');