commit a34996f1161df799fc4edc544e719d2dc415a7c8
parent 351152d7b43f7a5f58d78eba2caba573904bbf32
Author: moonira <moonira@google.com>
Date: Mon, 5 Jan 2026 10:33:12 +0000
Bug 2008375 [wpt PR 56964] - Support property dependent random() function inside ident(), a=testonly
Automatic update from web-platform-tests
Support property dependent random() function inside ident()
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 CSSCustomIdent, so that we will use the correct name for random()
inside an ident() function.
Bug: 413385732
Change-Id: Iad0cc1f3ec1a942c14f69ab587dd1c595a65bdf0
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/7280930
Reviewed-by: Rune Lillesveen <futhark@chromium.org>
Commit-Queue: Munira Tursunova <moonira@google.com>
Cr-Commit-Position: refs/heads/main@{#1563915}
--
wpt-commits: 97d2c21f8593192cfdee1b114f96a8d11f981a34
wpt-pr: 56964
Diffstat:
1 file changed, 53 insertions(+), 2 deletions(-)
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
@@ -39,6 +39,7 @@
--y: random(0, 100);
--random-length-1: random(fixed random(0, 1), 10px, 100px);
--random-length-2: random(fixed random(0, 1), 10px, 100px);
+ view-transition-name: ident("myident" random(1, 100));
}
.randomMatchElement {
width: random(element-shared, 0px, 100px);
@@ -50,6 +51,7 @@
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));
+ view-transition-name: ident("myident" random(element-shared, 1, 100));
}
.randomIdentifier {
width: random(--identifier, 0px, 100px);
@@ -330,6 +332,7 @@ test_random_computed_value('color', 'rgb(random(30, 10) random(60, 10) random(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_computed_value('view-transition-name', 'ident("myident" random(30, 10))', 'myident30');
// Test random value sharing
test(() => {
@@ -493,6 +496,30 @@ test(() => {
try {
for (i = 0; i < iterations; ++i) {
+ const t1 = document.createElement('div');
+ t1.className = 'randomNoIdentifier';
+ holder.appendChild(t1);
+ const t2 = document.createElement('div');
+ t2.className = 'randomNoIdentifier';
+ holder.appendChild(t2);
+
+ let t1ComputedViewTransitionName = getComputedStyle(t1)['view-transition-name'];
+ let t2ComputedViewTransitionName= getComputedStyle(t2)['view-transition-name'];
+
+ assert_false(t1ComputedViewTransitionName == t2ComputedViewTransitionName,
+ "view-transition-name values on different elements should be equal");
+ }
+ } finally {
+ document.body.removeChild(holder);
+ }
+}, `Shared by property, random inside ident(): random(a, b)`);
+
+test(() => {
+ const holder = document.createElement('div');
+ document.body.appendChild(holder);
+
+ try {
+ for (i = 0; i < iterations; ++i) {
const el = document.createElement('div');
el.className = 'randomIdentifier';
holder.appendChild(el);
@@ -592,6 +619,30 @@ test(() => {
t2.className = 'randomMatchElement';
holder.appendChild(t2);
+ let t1ComputedViewTransitionName = getComputedStyle(t1)['view-transition-name'];
+ let t2ComputedViewTransitionName= getComputedStyle(t2)['view-transition-name'];
+
+ test_random_equals(t1ComputedViewTransitionName, t2ComputedViewTransitionName,
+ "view-transition-name values on different elements should be equal");
+ }
+ } finally {
+ document.body.removeChild(holder);
+ }
+}, `Shared between elements within a property, random inside ident(): 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 t1ComputedColor = getComputedStyle(t1)['color'];
let t2ComputedColor = getComputedStyle(t2)['color'];
test_random_equals(t1ComputedColor, t2ComputedColor,
@@ -647,7 +698,7 @@ test(() => {
} finally {
document.body.removeChild(holder);
}
-}, `Shared between elements within a property - shorthand: random(element-shared, a, b))`);
+}, `Shared between elements within a property - shorthand: random(element-shared, a, b)`);
test(() => {
const holder = document.createElement('div');
@@ -694,7 +745,7 @@ test(() => {
} finally {
document.body.removeChild(holder);
}
-}, `Shared globally - shorthand: random(element-shared, a, b))`);
+}, `Shared globally - shorthand: random(element-shared, a, b)`);
test(() => {
const holder = document.createElement('div');