tor-browser

commit e8eb097320433450dd3c8e7e8972482cc20509e4
parent db1c582340f0863be18fda49790405ce18eacd91
Author: moonira <moonira@google.com>
Date:   Wed,  3 Dec 2025 13:57:19 +0000

Bug 2002290 [wpt PR 56263] - Compute computed value of random() function with percentages, a=testonly

Automatic update from web-platform-tests
Compute computed value of random() function with percentages

From spec [0]:

If a random() function can’t be simplified by computed value time,
then it should compute to its maximally-simplified form,
but with its <random-value-sharing> set to its random base value.
For example computed value for "width: random(50%, 100%)" should be
something like: "width: random(fixed .1234, 50%, 100%)".

This CL adds the random() function to CalculationExpressionNode and
implements `CSSMathExpressionRandomFunction::ToCalculationExpression`
to compute computed unresolved calc values.

Note: There is an existing bug: calc expressions with only percentage
values are sometimes being simplified, when they shouldn't. For example,
computed value for min(10%, 30%) should not be simplified to 10% since
percentages may represent negative values. This CL introduces a
workaround for the random() function, so that all expressions with only
percentage values will be marked unresolvable before layout time.

[0] https://drafts.csswg.org/css-values-5/#random

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

--

wpt-commits: 0a6b7f67ac0cb22f57c8f0e39536677ebfb9172e
wpt-pr: 56263

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

1 file changed, 33 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
@@ -22,6 +22,7 @@
     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%);
   }
   .randomIdentifier {
     width: random(--identifier, 0px, 100px);
@@ -54,7 +55,7 @@ const iterations = 5;
 // does not generate deterministic test failure output. Chrome relies on test
 // failure output to be deterministic and stable for failing test expectations.
 function test_random_equals(actual, expected, message = "Random values should be equal") {
-  assert_true(actual === expected, message);
+  assert_equals(actual, expected, message);
 }
 
 function test_random_computed_value(property, specified, computed, titleExtra, options = {}) {
@@ -270,6 +271,13 @@ test_pseudo_element_random_computed_value_in_range(property, '::before', 'random
 
 // Test unresolvable percentage values
 test_random_computed_value_has_fixed('translate', 'random(10%, 100%)', '10%', '100%');
+test_random_computed_value_has_fixed('translate', 'random(3 * 10% , 10 * 10%)', '30%', '100%');
+test_random_computed_value_has_fixed('translate', 'random(10%, 1%)', '10%', '1%');
+test_random_computed_value_has_fixed('translate', 'random(--identifier element-shared, 10%, 100%)', '10%', '100%');
+
+// Test resolvable percentage values
+test_random_computed_value('font-size', 'random(30%, 10%)', '4.8px');
+test_random_computed_value('font-size', 'random(10px * 10% / 1%, 0%)', '100px');
 
 // Test out of range math functions for fixed value
 test_random_computed_value_has_fixed('translate', 'random(fixed random(1, 2), 10%, 100%)', '10%', '100%');
@@ -405,6 +413,30 @@ test(() => {
   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'];
+
+      test_random_equals(t1ComputedWidth, t2ComputedWidth,
+                           "translate values with percentages on different elements should be equal");
+    }
+  } finally {
+    document.body.removeChild(holder);
+  }
+}, `Shared between elements within a property, percentage values: random(element-shared, a, b)`);
+
+test(() => {
+  const holder = document.createElement('div');
+  document.body.appendChild(holder);
+
+  try {
     var allHaveSameMarginTopAndMarginLeft = true;
     for (i = 0; i < iterations; ++i) {
       const other = document.createElement('div');