diff options
| author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 19:33:14 +0000 |
|---|---|---|
| committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 19:33:14 +0000 |
| commit | 36d22d82aa202bb199967e9512281e9a53db42c9 (patch) | |
| tree | 105e8c98ddea1c1e4784a60a5a6410fa416be2de /testing/web-platform/tests/css/css-contain/container-queries/pseudo-elements-006.html | |
| parent | Initial commit. (diff) | |
| download | firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.tar.xz firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.zip | |
Adding upstream version 115.7.0esr.upstream/115.7.0esrupstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/css/css-contain/container-queries/pseudo-elements-006.html')
| -rw-r--r-- | testing/web-platform/tests/css/css-contain/container-queries/pseudo-elements-006.html | 66 |
1 files changed, 66 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-contain/container-queries/pseudo-elements-006.html b/testing/web-platform/tests/css/css-contain/container-queries/pseudo-elements-006.html new file mode 100644 index 0000000000..65aee97f75 --- /dev/null +++ b/testing/web-platform/tests/css/css-contain/container-queries/pseudo-elements-006.html @@ -0,0 +1,66 @@ +<!doctype html> +<title>@container: originating element container for pseudo elements</title> +<link rel="help" href="https://drafts.csswg.org/css-contain-3/#container-queries"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="support/cq-testcommon.js"></script> +<style> + .container { container-type: inline-size; } + #target { display: list-item; } + @container (max-width: 200px) { + #target::before { content: "PASS"; font-size: 10cqw; } + #target::after { font-size: 10cqw; } + #target::marker { font-size: 10cqw; } + #target::first-line { font-size: 10cqw; } + #target::first-letter { font-size: 10cqw; } + } + @container ((min-width: 300px) and (max-width: 350px)) { + #outer::first-line { font-size: 10cqw; } + #outer::first-letter { font-size: 10cqw; } + } + dialog::backdrop { font-size: 0px; } + @container (max-width: 100px) { + dialog::backdrop { font-size: 10cqw; } + } +</style> +<div style="width: 400px" class="container"> + <div style="width: 300px" class="container"> + <div id="target" class="container" style="width: 200px">First-line</div> + <dialog id="dialog" class="container" style="width: 100px"></dialog> + </div> + <div style="width: 400px" class="container"> + <div id="outer" style="width: 300px" class="container"> + <div class="container" style="width: 200px">First-line</div> + </div> +</div> +<script> + setup(() => assert_implements_container_queries()); + + test(() => { + assert_equals(getComputedStyle(target, "::before").fontSize, "20px"); + }, "Originating element container for ::before"); + test(() => { + assert_equals(getComputedStyle(target, "::after").fontSize, "20px"); + }, "Originating element container for ::after"); + test(() => { + assert_equals(getComputedStyle(target, "::marker").fontSize, "20px"); + }, "Originating element container for ::marker"); + test(() => { + assert_equals(getComputedStyle(target, "::first-line").fontSize, "20px"); + }, "Originating element container for ::first-line"); + test(() => { + assert_equals(getComputedStyle(target, "::first-letter").fontSize, "20px"); + }, "Originating element container for ::first-letter"); + test(() => { + assert_equals(getComputedStyle(outer, "::first-line").fontSize, "30px"); + }, "Originating element container for outer ::first-line"); + test(() => { + assert_equals(getComputedStyle(outer, "::first-letter").fontSize, "30px"); + }, "Originating element container for outer ::first-letter"); + test((t) => { + t.add_cleanup(() => dialog.close()); + assert_equals(getComputedStyle(dialog, "::backdrop").fontSize, "0px", "::backdrop not rendered"); + dialog.showModal(); + assert_equals(getComputedStyle(dialog, "::backdrop").fontSize, "10px", "::backdrop rendered"); + }, "Originating element container for ::backdrop"); +</script> |