diff options
author | Oriol Brufau <obrufau@igalia.com> | 2025-03-13 07:49:08 +0100 |
---|---|---|
committer | GitHub <noreply@github.com> | 2025-03-13 06:49:08 +0000 |
commit | f93006af95dd75a07de2571e6a2edabcc64a46ac (patch) | |
tree | 2e356bbe166bf7f918c295c01aebde9ad3e5759e /tests | |
parent | 205b97d5edbca6f24b189b564ec5f7129ba40228 (diff) | |
download | servo-f93006af95dd75a07de2571e6a2edabcc64a46ac.tar.gz servo-f93006af95dd75a07de2571e6a2edabcc64a46ac.zip |
Improve logic for establishing a stacking context (#35947)
In particular:
- `z-index` will now work on unpositioned grid items.
- `will-change: z-index` will only establish a stacking context if
`z-index` applies, i.e. if the box is positioned or a flex/grid item.
- The conditions in `establishes_stacking_context()` are reordered,
so that the most likely ones are checked first.
Signed-off-by: Oriol Brufau <obrufau@igalia.com>
Diffstat (limited to 'tests')
29 files changed, 127 insertions, 48 deletions
diff --git a/tests/wpt/meta/MANIFEST.json b/tests/wpt/meta/MANIFEST.json index 79668fb0ad6..e54ddc40d22 100644 --- a/tests/wpt/meta/MANIFEST.json +++ b/tests/wpt/meta/MANIFEST.json @@ -307667,6 +307667,45 @@ {} ] ], + "will-change-stacking-context-z-index-2.html": [ + "9379185048a78b031e8ac290bd7bb3e5df24fa5f", + [ + null, + [ + [ + "/css/reference/ref-filled-green-100px-square.xht", + "==" + ] + ], + {} + ] + ], + "will-change-stacking-context-z-index-3.html": [ + "4ec40ae1a430a095ea6f703c8c27698e04792220", + [ + null, + [ + [ + "/css/reference/ref-filled-green-100px-square.xht", + "==" + ] + ], + {} + ] + ], + "will-change-stacking-context-z-index-4.html": [ + "d8a87b23415c3c10a6f4875f16cd63301e789152", + [ + null, + [ + [ + "/css/reference/ref-filled-green-100px-square.xht", + "==" + ] + ], + {} + ] + ], "will-change-transform-add-content.html": [ "1d8568ee629e48adfe99abab2e2194a73ae1301a", [ diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-001.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-001.html.ini deleted file mode 100644 index 45cf6fc0460..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-001.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-inline-z-axis-ordering-001.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-002.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-002.html.ini deleted file mode 100644 index 4ff1ef0fe2d..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-002.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-inline-z-axis-ordering-002.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-003.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-003.html.ini deleted file mode 100644 index 837fbd2a8c1..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-003.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-inline-z-axis-ordering-003.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-004.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-004.html.ini deleted file mode 100644 index fd41d4c1a42..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-004.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-inline-z-axis-ordering-004.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-005.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-005.html.ini deleted file mode 100644 index 293ed0639f2..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-005.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-inline-z-axis-ordering-005.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-overlapped-items-001.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-overlapped-items-001.html.ini deleted file mode 100644 index eb2233d3700..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-overlapped-items-001.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-inline-z-axis-ordering-overlapped-items-001.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-overlapped-items-002.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-overlapped-items-002.html.ini deleted file mode 100644 index cb9905e7a27..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-overlapped-items-002.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-inline-z-axis-ordering-overlapped-items-002.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-overlapped-items-003.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-overlapped-items-003.html.ini deleted file mode 100644 index f3a786abf7b..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-overlapped-items-003.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-inline-z-axis-ordering-overlapped-items-003.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-overlapped-items-004.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-overlapped-items-004.html.ini deleted file mode 100644 index 03f883fbceb..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-overlapped-items-004.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-inline-z-axis-ordering-overlapped-items-004.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-overlapped-items-005.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-overlapped-items-005.html.ini deleted file mode 100644 index f89f4e9cfbe..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-overlapped-items-005.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-inline-z-axis-ordering-overlapped-items-005.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-overlapped-items-006.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-overlapped-items-006.html.ini deleted file mode 100644 index 479e338b1fd..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-inline-z-axis-ordering-overlapped-items-006.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-inline-z-axis-ordering-overlapped-items-006.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-layout-z-order-a.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-layout-z-order-a.html.ini deleted file mode 100644 index 64b4b2b480e..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-layout-z-order-a.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-layout-z-order-a.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-layout-z-order-b.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-layout-z-order-b.html.ini deleted file mode 100644 index 7573aba43fd..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-layout-z-order-b.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-layout-z-order-b.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-001.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-001.html.ini deleted file mode 100644 index 3a9b399710f..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-001.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-z-axis-ordering-001.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-002.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-002.html.ini deleted file mode 100644 index 3702bfaad3d..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-002.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-z-axis-ordering-002.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-003.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-003.html.ini deleted file mode 100644 index 0a3c12ac1bf..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-003.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-z-axis-ordering-003.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-004.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-004.html.ini deleted file mode 100644 index 221e23ddb98..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-004.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-z-axis-ordering-004.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-005.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-005.html.ini deleted file mode 100644 index 43014f76ca9..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-005.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-z-axis-ordering-005.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-overlapped-items-001.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-overlapped-items-001.html.ini deleted file mode 100644 index 98556a4a8ca..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-overlapped-items-001.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-z-axis-ordering-overlapped-items-001.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-overlapped-items-002.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-overlapped-items-002.html.ini deleted file mode 100644 index c947cd0caf8..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-overlapped-items-002.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-z-axis-ordering-overlapped-items-002.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-overlapped-items-003.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-overlapped-items-003.html.ini deleted file mode 100644 index 80644b4df38..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-overlapped-items-003.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-z-axis-ordering-overlapped-items-003.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-overlapped-items-004.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-overlapped-items-004.html.ini deleted file mode 100644 index c6498b7b9c0..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-overlapped-items-004.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-z-axis-ordering-overlapped-items-004.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-overlapped-items-005.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-overlapped-items-005.html.ini deleted file mode 100644 index c214befe848..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-overlapped-items-005.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-z-axis-ordering-overlapped-items-005.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-overlapped-items-006.html.ini b/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-overlapped-items-006.html.ini deleted file mode 100644 index b4f85a68692..00000000000 --- a/tests/wpt/meta/css/css-grid/grid-items/grid-z-axis-ordering-overlapped-items-006.html.ini +++ /dev/null @@ -1,2 +0,0 @@ -[grid-z-axis-ordering-overlapped-items-006.html] - expected: FAIL diff --git a/tests/wpt/meta/css/css-will-change/will-change-stacking-context-z-index-3.html.ini b/tests/wpt/meta/css/css-will-change/will-change-stacking-context-z-index-3.html.ini new file mode 100644 index 00000000000..d0c021b9dd0 --- /dev/null +++ b/tests/wpt/meta/css/css-will-change/will-change-stacking-context-z-index-3.html.ini @@ -0,0 +1,2 @@ +[will-change-stacking-context-z-index-3.html] + prefs: ["layout_grid_enabled:true"] diff --git a/tests/wpt/tests/css/css-will-change/will-change-stacking-context-z-index-2.html b/tests/wpt/tests/css/css-will-change/will-change-stacking-context-z-index-2.html new file mode 100644 index 00000000000..9379185048a --- /dev/null +++ b/tests/wpt/tests/css/css-will-change/will-change-stacking-context-z-index-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<title>CSS Test: `will-change: z-index`</title> +<link rel="author" title="Oriol Brufau" href="obrufau@igalia.com"> +<link rel="help" href="https://www.w3.org/TR/css-will-change/#valdef-will-change-custom-ident"> +<link rel="help" href="https://www.w3.org/TR/css-flexbox-1/#painting"> +<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/11827"> +<link rel="match" href="../reference/ref-filled-green-100px-square.xht"> +<meta name="assert" content=" + `will-change: z-index` establishes a stacking context on a flex item. +"> +<style> +.test { + will-change: z-index; + width: 100px; + background: red; +} +.test::before { + content: ""; + display: block; + position: relative; + z-index: -1; + height: 100px; + background: green; +} +</style> +<p>Test passes if there is a filled green square and <strong>no red</strong>.</p> +<div style="display: flex"> + <div class="test"></div> +</div> diff --git a/tests/wpt/tests/css/css-will-change/will-change-stacking-context-z-index-3.html b/tests/wpt/tests/css/css-will-change/will-change-stacking-context-z-index-3.html new file mode 100644 index 00000000000..4ec40ae1a43 --- /dev/null +++ b/tests/wpt/tests/css/css-will-change/will-change-stacking-context-z-index-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<title>CSS Test: `will-change: z-index`</title> +<link rel="author" title="Oriol Brufau" href="obrufau@igalia.com"> +<link rel="help" href="https://www.w3.org/TR/css-will-change/#valdef-will-change-custom-ident"> +<link rel="help" href="https://www.w3.org/TR/css-grid-2/#z-order"> +<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/11827"> +<link rel="match" href="../reference/ref-filled-green-100px-square.xht"> +<meta name="assert" content=" + `will-change: z-index` establishes a stacking context on a grid item. +"> +<style> +.test { + will-change: z-index; + width: 100px; + background: red; +} +.test::before { + content: ""; + display: block; + position: relative; + z-index: -1; + height: 100px; + background: green; +} +</style> +<p>Test passes if there is a filled green square and <strong>no red</strong>.</p> +<div style="display: grid"> + <div class="test"></div> +</div> diff --git a/tests/wpt/tests/css/css-will-change/will-change-stacking-context-z-index-4.html b/tests/wpt/tests/css/css-will-change/will-change-stacking-context-z-index-4.html new file mode 100644 index 00000000000..d8a87b23415 --- /dev/null +++ b/tests/wpt/tests/css/css-will-change/will-change-stacking-context-z-index-4.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<title>CSS Test: `will-change: z-index`</title> +<link rel="author" title="Oriol Brufau" href="obrufau@igalia.com"> +<link rel="help" href="https://www.w3.org/TR/css-will-change/#valdef-will-change-custom-ident"> +<link rel="help" href="https://www.w3.org/TR/CSS2/visuren.html#z-index"> +<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/11827"> +<link rel="match" href="../reference/ref-filled-green-100px-square.xht"> +<meta name="assert" content=" + `will-change: z-index` doesn't establish a stacking context on a non-positioned block box, + because `z-index` doesn't apply in that case. +"> +<style> +.test { + will-change: z-index; + width: 100px; + background: green; +} +.test::before { + content: ""; + display: block; + position: relative; + z-index: -1; + height: 100px; + background: red; +} +</style> +<p>Test passes if there is a filled green square and <strong>no red</strong>.</p> +<div class="test"></div> |