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-001.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-001.html')
-rw-r--r-- | testing/web-platform/tests/css/css-scoping/scoped-reference-animation-001.html | 42 |
1 files changed, 42 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-scoping/scoped-reference-animation-001.html b/testing/web-platform/tests/css/css-scoping/scoped-reference-animation-001.html new file mode 100644 index 0000000000..891bda52a3 --- /dev/null +++ b/testing/web-platform/tests/css/css-scoping/scoped-reference-animation-001.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<title>Tests animation with tree-scoped names and references</title> +<meta name="assert" content="Custom counter style references should work in 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> +/* Overrides predefined lower-roman counter-style */ +@counter-style lower-roman { + system: cyclic; + symbols: 'X'; +} + +/* Overrides predefined upper-roman counter-style */ +@counter-style upper-roman { + system: cyclic; + symbols: 'O'; +} + +/* Should resolve to the custom counter styles, not the predefined 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> |