diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 01:47:29 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 01:47:29 +0000 |
commit | 0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d (patch) | |
tree | a31f07c9bcca9d56ce61e9a1ffd30ef350d513aa /testing/web-platform/tests/css/css-scoping/scoped-reference-animation-002.html | |
parent | Initial commit. (diff) | |
download | firefox-esr-0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d.tar.xz firefox-esr-0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d.zip |
Adding upstream version 115.8.0esr.upstream/115.8.0esr
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/css/css-scoping/scoped-reference-animation-002.html')
-rw-r--r-- | testing/web-platform/tests/css/css-scoping/scoped-reference-animation-002.html | 55 |
1 files changed, 55 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-scoping/scoped-reference-animation-002.html b/testing/web-platform/tests/css/css-scoping/scoped-reference-animation-002.html new file mode 100644 index 0000000000..d5c25f06c0 --- /dev/null +++ b/testing/web-platform/tests/css/css-scoping/scoped-reference-animation-002.html @@ -0,0 +1,55 @@ +<!DOCTYPE html> +<title>Tests animation with tree-scoped names and references</title> +<meta name="assert" content="Custom counter style references should work in shadow DOM keyframes"> +<link rel="help" href="https://drafts.csswg.org/css-scoping/#shadow-names"> +<link rel="author" href="mailto:xiaochengh@chromium.org"> +<link rel="match" href="scoped-reference-animation-ref.html"> + +<style> +@counter-style lower-roman { system: extends disc; } +@counter-style upper-roman { system: extends disc; } +</style> + +<div id="host"> +</div> + +<script> +host.attachShadow({mode: 'open'}).innerHTML = ` +<style> +/* Overrides predefined and outer tree scope's custom lower-roman counter-style */ +@counter-style lower-roman { + system: cyclic; + symbols: 'X'; +} + +/* Overrides predefined and outer tree scope's upper-roman counter-style */ +@counter-style upper-roman { + system: cyclic; + symbols: 'O'; +} + +/* Should resolve to the custom counter styles, not the predefined or the outer + tree scope's ones */ +@keyframes list-style-type-anim { + from { list-style-type: lower-roman; } + to { list-style-type: upper-roman; } +} + +#target1 { + animation: list-style-type-anim 2s -0.9s linear paused; +} + +#target2 { + animation: list-style-type-anim 2s -1s linear paused; +} +</style> + +<ul id="target1"> + <li>List marker should be X +</ul> + +<ul id="target2"> + <li>List marker should be O +</ul> +`; +</script> |