summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/css/css-animations
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-05-15 03:35:49 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-05-15 03:35:49 +0000
commitd8bbc7858622b6d9c278469aab701ca0b609cddf (patch)
treeeff41dc61d9f714852212739e6b3738b82a2af87 /testing/web-platform/tests/css/css-animations
parentReleasing progress-linux version 125.0.3-1~progress7.99u1. (diff)
downloadfirefox-d8bbc7858622b6d9c278469aab701ca0b609cddf.tar.xz
firefox-d8bbc7858622b6d9c278469aab701ca0b609cddf.zip
Merging upstream version 126.0.
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/css/css-animations')
-rw-r--r--testing/web-platform/tests/css/css-animations/WEB_FEATURES.yml5
-rw-r--r--testing/web-platform/tests/css/css-animations/crashtests/cancel-update.html25
-rw-r--r--testing/web-platform/tests/css/css-animations/crashtests/pseudo-element-animation-with-marker.html15
-rw-r--r--testing/web-platform/tests/css/css-animations/display-none-dont-cancel-pseudo.tentative.html52
-rw-r--r--testing/web-platform/tests/css/css-animations/parsing/WEB_FEATURES.yml4
-rw-r--r--testing/web-platform/tests/css/css-animations/stability/animation-event-destroy-renderer.html73
6 files changed, 174 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-animations/WEB_FEATURES.yml b/testing/web-platform/tests/css/css-animations/WEB_FEATURES.yml
new file mode 100644
index 0000000000..2059bd4927
--- /dev/null
+++ b/testing/web-platform/tests/css/css-animations/WEB_FEATURES.yml
@@ -0,0 +1,5 @@
+features:
+- name: animation-composition
+ files:
+ - animation-composition.html
+ - animation-composition-*
diff --git a/testing/web-platform/tests/css/css-animations/crashtests/cancel-update.html b/testing/web-platform/tests/css/css-animations/crashtests/cancel-update.html
new file mode 100644
index 0000000000..1cb094692e
--- /dev/null
+++ b/testing/web-platform/tests/css/css-animations/crashtests/cancel-update.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<link rel="help" href="https://crbug.com/564354">
+<link rel="help" href="https://issues.chromium.org/issues/40447203">
+<title>Check that cancelling one running animation and updating another doesn't
+crash.</title>
+<style>
+ @keyframes anim {
+ from { background-color: blue; }
+ to { background-color: red; }
+ }
+
+ @keyframes anim2 {
+ from { opacity: 0; }
+ to { opacity: 1; }
+ }
+</style>
+<div id="target"></div>
+<script>
+ window.onload = () => {
+ target.style.animation = "anim 1s, anim2 1s";
+ target.offsetTop;
+ target.style.animation = "anim2 2s";
+ target.offsetTop;
+ };
+</script>
diff --git a/testing/web-platform/tests/css/css-animations/crashtests/pseudo-element-animation-with-marker.html b/testing/web-platform/tests/css/css-animations/crashtests/pseudo-element-animation-with-marker.html
new file mode 100644
index 0000000000..ba7fc2371a
--- /dev/null
+++ b/testing/web-platform/tests/css/css-animations/crashtests/pseudo-element-animation-with-marker.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<link rel="help" href="https://crbug.com/360457">
+<link rel="help" href="https://issues.chromium.org/issues/41099655">
+<title>Test if it doesn't crash when pseudo element has animation with marker</title>
+<style>
+@keyframes test { 0% { marker: url("crash"); } }
+body:before { animation-name: test; }
+</style>
+<doby>
+</doby>
+<script>
+ window.onload = () => {
+ document.getAnimations();
+ }
+</script>
diff --git a/testing/web-platform/tests/css/css-animations/display-none-dont-cancel-pseudo.tentative.html b/testing/web-platform/tests/css/css-animations/display-none-dont-cancel-pseudo.tentative.html
new file mode 100644
index 0000000000..bed4ec2b80
--- /dev/null
+++ b/testing/web-platform/tests/css/css-animations/display-none-dont-cancel-pseudo.tentative.html
@@ -0,0 +1,52 @@
+<!DOCTYPE html>
+<link rel=author href="mailto:graouts@apple.com">
+<link rel=help href="https://drafts.csswg.org/css-display-4/#display-animation">
+<link rel=help href="https://github.com/w3c/csswg-drafts/issues/10111">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/web-animations/testcommon.js"></script>
+<style>
+
+@keyframes display-animation {
+ from { margin-left: 100px; display: block }
+ to { margin-left: 200px; display: none }
+}
+
+.target::after {
+ content: "";
+ margin-left: 50px;
+}
+
+.target.animated::after {
+ animation: display-animation 1ms forwards;
+}
+
+</style>
+<body>
+<script>
+
+promise_test(async t => {
+ const target = createDiv(t);
+ target.className = "target";
+
+ const cs = getComputedStyle(target, "::after");
+ const animations = () => target.getAnimations({ subtree: true });
+
+ assert_equals(animations().length, 0, "There are no running animations initially");
+ assert_equals(cs.marginLeft, "50px");
+ assert_equals(cs.display, "inline");
+
+ target.classList.add("animated");
+ const runningAnimations = animations();
+ assert_equals(runningAnimations.length, 1, "Setting the 'animated' class started an animation");
+ assert_equals(cs.marginLeft, "100px");
+ assert_equals(cs.display, "block");
+
+ await runningAnimations[0].finished;
+ assert_equals(animations().length, 1, "The animation remains after completion");
+ assert_equals(cs.marginLeft, "200px");
+ assert_equals(cs.display, "none");
+}, 'A CSS Animation on a pseudo-element animating to "display: none" with "fill: forwards" remains active after animation completion.');
+
+</script>
+</body> \ No newline at end of file
diff --git a/testing/web-platform/tests/css/css-animations/parsing/WEB_FEATURES.yml b/testing/web-platform/tests/css/css-animations/parsing/WEB_FEATURES.yml
new file mode 100644
index 0000000000..7e3ccd1b3b
--- /dev/null
+++ b/testing/web-platform/tests/css/css-animations/parsing/WEB_FEATURES.yml
@@ -0,0 +1,4 @@
+features:
+- name: animation-composition
+ files:
+ - animation-composition-*
diff --git a/testing/web-platform/tests/css/css-animations/stability/animation-event-destroy-renderer.html b/testing/web-platform/tests/css/css-animations/stability/animation-event-destroy-renderer.html
new file mode 100644
index 0000000000..0a1e1d5085
--- /dev/null
+++ b/testing/web-platform/tests/css/css-animations/stability/animation-event-destroy-renderer.html
@@ -0,0 +1,73 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <title>Destroy and Hide Element in Animation Iteration Event</title>
+ <!-- Note: this is effectively a crashtest, but as crashtests do not
+ support variants, authoring as a promise test -->
+ <meta name="variant" content="?animationstart">
+ <meta name="variant" content="?animationiteration">
+ <link rel="help" href="https://bugs.webkit.org/show_bug.cgi?id=22635">
+ <style>
+ .box {
+ height: 100px;
+ width: 100px;
+ margin: 10px;
+ background-color: blue;
+ animation-duration: 0.2s;
+ animation-iteration-count: 2;
+ }
+
+ @keyframes move {
+ from { transform: translate(0px, 0px); }
+ to { transform: translate(100px, 0px); }
+ }
+ </style>
+ <div id="container">
+ <div id="box1" class="box"></div>
+ <div id="box2" class="box"></div>
+ </div>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <script src="/common/gc.js"></script>
+ <script>
+ 'use strict';
+
+ function eventPromise(target, event, callback) {
+ return new Promise(resolve => {
+ const listener = () => {
+ callback();
+ resolve();
+ };
+ target.addEventListener(event, listener,
+ { once: true });
+ });
+ }
+
+ promise_test(async t => {
+ const eventType = location.search.substring(1);
+ var box1 = document.getElementById('box1');
+ var box2 = document.getElementById('box2');
+
+ const promises = [];
+ promises.push(eventPromise(box1, eventType, () => {
+ box1.parentNode.removeChild(box1);
+ }));
+ box1.style.animationName = 'move';
+ promises.push(eventPromise(box2, eventType, () => {
+ box2.style.display = 'none';
+ }));
+ box2.style.animationName = 'move';
+ await Promise.all(promises);
+
+ // Garbage collection is best effort.
+ if (window.garbageCollect) {
+ await garbageCollect();
+ }
+
+ assert_equals(document.getAnimations().length, 0);
+ }, 'Triggering the cancel of an animation during event handling does not ' +
+ 'crash.');
+
+ </script>
+</head>
+</html>