commit e894d7cacb963bf39e89d4d9c92bce4223c2ab8f
parent 94dd63fef415dacac5a421317f754dcb3751e137
Author: Rune Lillesveen <futhark@chromium.org>
Date: Fri, 3 Oct 2025 08:59:47 +0000
Bug 1991097 [wpt PR 55092] - Implicit second value 'any' instead of 'span-all' for fallback query, a=testonly
Automatic update from web-platform-tests
Implicit second value 'any' instead of 'span-all' for fallback query
Per resolution in [1], unambiguous single-keyword position-area query
values have an implicit 'any' value instead of 'span-all'.
Made existing tests no longer tentative.
[1] https://github.com/w3c/csswg-drafts/issues/12610#issuecomment-3329830278
Bug: 447150249, 417621241
Change-Id: I996331bd90a61609ffdeaac3044504559e651490
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6986521
Reviewed-by: Anders Hartvoll Ruud <andruud@chromium.org>
Commit-Queue: Rune Lillesveen <futhark@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1521184}
--
wpt-commits: 1fe8c460629bc810c319f3d8d774e9eb899be8de
wpt-pr: 55092
Diffstat:
5 files changed, 101 insertions(+), 63 deletions(-)
diff --git a/testing/web-platform/tests/css/css-anchor-position/container-queries/anchored-fallback-implicit-any.html b/testing/web-platform/tests/css/css-anchor-position/container-queries/anchored-fallback-implicit-any.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<title>CSS Conditional Test: @container anchored(fallback) matching implicit 'any' <position-area></title>
+<link rel="help" href="https://drafts.csswg.org/css-anchor-position-2/#anchored-container-queries">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/css/css-conditional/container-queries/support/cq-testcommon.js"></script>
+<style>
+ #anchor {
+ anchor-name: --a;
+ width: 100px;
+ height: 100px;
+ }
+ #anchored {
+ position: absolute;
+ position-anchor: --a;
+ position-area: top;
+ position-try-fallbacks: right span-bottom;
+ width: 100px;
+ /* Too tall to fit over the anchor to trigger fallback */
+ height: 100px;
+ container-type: anchored;
+ }
+ #target {
+ /* Implicit 'any' for the horizontal part of the query */
+ @container anchored(fallback: span-bottom) { --span-bottom: yes; }
+ /* Implicit 'any' for the vertical part of the query */
+ @container anchored(fallback: right) { --right: yes; }
+ }
+</style>
+<div id="anchor"></div>
+<div id="anchored">
+ <div id="target"></div>
+</div>
+<script>
+ test(() => {
+ const style = getComputedStyle(target);
+ assert_equals(style.getPropertyValue("--span-bottom"), "yes");
+ assert_equals(style.getPropertyValue("--right"), "yes");
+ }, "@container anchored(fallback: <position-area>) querying single axis with implicit 'any'");
+</script>
diff --git a/testing/web-platform/tests/css/css-anchor-position/container-queries/anchored-fallback-position-area-any.html b/testing/web-platform/tests/css/css-anchor-position/container-queries/anchored-fallback-position-area-any.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<title>CSS Conditional Test: @container anchored(fallback) matching 'any' <position-area></title>
+<link rel="help" href="https://drafts.csswg.org/css-anchor-position-2/#anchored-container-queries">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/css/css-conditional/container-queries/support/cq-testcommon.js"></script>
+<style>
+ #anchor {
+ anchor-name: --a;
+ width: 100px;
+ height: 100px;
+ }
+ #anchored {
+ position: absolute;
+ position-anchor: --a;
+ position-area: top;
+ position-try-fallbacks: span-bottom;
+ width: 100px;
+ /* Too tall to fit over the anchor to trigger fallback */
+ height: 100px;
+ container-type: anchored;
+ }
+ #target {
+ @container anchored(fallback: any) { --any: yes; }
+ @container anchored(fallback: any span-bottom) { --any-span-bottom: yes; }
+ @container anchored(fallback: span-end any) { --span-end-any: yes; }
+ @container anchored(fallback: any span-all) { --any-span-all: yes; }
+ }
+</style>
+<div id="anchor"></div>
+<div id="anchored">
+ <div id="target"></div>
+</div>
+<script>
+ test(() => {
+ const style = getComputedStyle(target);
+ assert_equals(style.getPropertyValue("--any"), "yes");
+ assert_equals(style.getPropertyValue("--any-span-bottom"), "yes");
+ assert_equals(style.getPropertyValue("--span-end-any"), "yes");
+ assert_equals(style.getPropertyValue("--any-span-all"), "yes");
+ }, "@container anchored(fallback: <position-area>) querying 'any'");
+</script>
diff --git a/testing/web-platform/tests/css/css-anchor-position/container-queries/anchored-fallback-position-area-any.tentative.html b/testing/web-platform/tests/css/css-anchor-position/container-queries/anchored-fallback-position-area-any.tentative.html
@@ -1,43 +0,0 @@
-<!DOCTYPE html>
-<title>CSS Conditional Test: @container anchored(fallback) matching 'any' <position-area></title>
-<link rel="help" href="https://drafts.csswg.org/css-anchor-position-2/#anchored-container-queries">
-<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/12610">
-<script src="/resources/testharness.js"></script>
-<script src="/resources/testharnessreport.js"></script>
-<script src="/css/css-conditional/container-queries/support/cq-testcommon.js"></script>
-<style>
- #anchor {
- anchor-name: --a;
- width: 100px;
- height: 100px;
- }
- #anchored {
- position: absolute;
- position-anchor: --a;
- position-area: top;
- position-try-fallbacks: span-bottom;
- width: 100px;
- /* Too tall to fit over the anchor to trigger fallback */
- height: 100px;
- container-type: anchored;
- }
- #target {
- @container anchored(fallback: any) { --any: yes; }
- @container anchored(fallback: any span-bottom) { --any-span-bottom: yes; }
- @container anchored(fallback: span-end any) { --span-end-any: yes; }
- @container anchored(fallback: any span-all) { --any-span-all: yes; }
- }
-</style>
-<div id="anchor"></div>
-<div id="anchored">
- <div id="target"></div>
-</div>
-<script>
- test(() => {
- const style = getComputedStyle(target);
- assert_equals(style.getPropertyValue("--any"), "yes");
- assert_equals(style.getPropertyValue("--any-span-bottom"), "yes");
- assert_equals(style.getPropertyValue("--span-end-any"), "yes");
- assert_equals(style.getPropertyValue("--any-span-all"), "yes");
- }, "@container anchored(fallback: <position-area>) querying 'any'");
-</script>
diff --git a/testing/web-platform/tests/css/css-anchor-position/container-queries/at-container-anchored-parsing-any.html b/testing/web-platform/tests/css/css-anchor-position/container-queries/at-container-anchored-parsing-any.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<title>CSS Conditional Test: @container anchored query parsing - 'any' position-area</title>
+<link rel="help" href="https://drafts.csswg.org/css-anchor-position-2/#anchored-container-queries">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/css/css-conditional/container-queries/support/cq-testcommon.js"></script>
+<div style="container-name:name;container-type:anchored">
+ <main id="cq-main"></main>
+</div>
+<script>
+ test_cq_condition_known('anchored(fallback: any)');
+ test_cq_condition_known('anchored(fallback: any any)');
+ test_cq_condition_known('anchored(fallback: any top)');
+ test_cq_condition_known('anchored(fallback: center any)');
+ test_cq_condition_known('anchored(fallback: any self-start)');
+ test_cq_condition_known('anchored(fallback: inline-end any)');
+
+ test_cq_condition_unknown('anchored(fallback: any none)');
+</script>
diff --git a/testing/web-platform/tests/css/css-anchor-position/container-queries/at-container-anchored-parsing-any.tentative.html b/testing/web-platform/tests/css/css-anchor-position/container-queries/at-container-anchored-parsing-any.tentative.html
@@ -1,20 +0,0 @@
-<!DOCTYPE html>
-<title>CSS Conditional Test: @container anchored query parsing - 'any' position-area</title>
-<link rel="help" href="https://drafts.csswg.org/css-anchor-position-2/#anchored-container-queries">
-<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/12610">
-<script src="/resources/testharness.js"></script>
-<script src="/resources/testharnessreport.js"></script>
-<script src="/css/css-conditional/container-queries/support/cq-testcommon.js"></script>
-<div style="container-name:name;container-type:anchored">
- <main id="cq-main"></main>
-</div>
-<script>
- test_cq_condition_known('anchored(fallback: any)');
- test_cq_condition_known('anchored(fallback: any any)');
- test_cq_condition_known('anchored(fallback: any top)');
- test_cq_condition_known('anchored(fallback: center any)');
- test_cq_condition_known('anchored(fallback: any self-start)');
- test_cq_condition_known('anchored(fallback: inline-end any)');
-
- test_cq_condition_unknown('anchored(fallback: any none)');
-</script>