summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/web-animations/interfaces/DocumentTimeline
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 00:47:55 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 00:47:55 +0000
commit26a029d407be480d791972afb5975cf62c9360a6 (patch)
treef435a8308119effd964b339f76abb83a57c29483 /testing/web-platform/tests/web-animations/interfaces/DocumentTimeline
parentInitial commit. (diff)
downloadfirefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz
firefox-26a029d407be480d791972afb5975cf62c9360a6.zip
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/web-animations/interfaces/DocumentTimeline')
-rw-r--r--testing/web-platform/tests/web-animations/interfaces/DocumentTimeline/constructor.html43
-rw-r--r--testing/web-platform/tests/web-animations/interfaces/DocumentTimeline/style-change-events.html92
2 files changed, 135 insertions, 0 deletions
diff --git a/testing/web-platform/tests/web-animations/interfaces/DocumentTimeline/constructor.html b/testing/web-platform/tests/web-animations/interfaces/DocumentTimeline/constructor.html
new file mode 100644
index 0000000000..ca0997ac8f
--- /dev/null
+++ b/testing/web-platform/tests/web-animations/interfaces/DocumentTimeline/constructor.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<title>DocumentTimeline constructor tests</title>
+<link rel="help" href="https://drafts.csswg.org/web-animations/#the-documenttimeline-interface">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../testcommon.js"></script>
+<script src="../../resources/timing-override.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+test(t => {
+ const timeline = new DocumentTimeline();
+
+ assert_times_equal(timeline.currentTime, document.timeline.currentTime);
+}, 'An origin time of zero is used when none is supplied');
+
+test(t => {
+ const timeline = new DocumentTimeline({ originTime: 0 });
+ assert_times_equal(timeline.currentTime, document.timeline.currentTime);
+}, 'A zero origin time produces a document timeline with a current time ' +
+ 'identical to the default document timeline');
+
+test(t => {
+ const timeline = new DocumentTimeline({ originTime: 10 * MS_PER_SEC });
+
+ assert_times_equal(timeline.currentTime,
+ (document.timeline.currentTime - 10 * MS_PER_SEC));
+}, 'A positive origin time makes the document timeline\'s current time lag ' +
+ 'behind the default document timeline');
+
+test(t => {
+ const timeline = new DocumentTimeline({ originTime: -10 * MS_PER_SEC });
+
+ assert_times_equal(timeline.currentTime,
+ (document.timeline.currentTime + 10 * MS_PER_SEC));
+}, 'A negative origin time makes the document timeline\'s current time run ' +
+ 'ahead of the default document timeline');
+
+</script>
+</body>
diff --git a/testing/web-platform/tests/web-animations/interfaces/DocumentTimeline/style-change-events.html b/testing/web-platform/tests/web-animations/interfaces/DocumentTimeline/style-change-events.html
new file mode 100644
index 0000000000..c1607e6fb9
--- /dev/null
+++ b/testing/web-platform/tests/web-animations/interfaces/DocumentTimeline/style-change-events.html
@@ -0,0 +1,92 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>DocumentTimeline interface: style change events</title>
+<link rel="help"
+ href="https://drafts.csswg.org/web-animations-1/#model-liveness">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../testcommon.js"></script>
+<body>
+<div id="log"></div>
+<script>
+'use strict';
+
+// NOTE: If more members are added to the DocumentTimeline interface it might be
+// better to rewrite these test in the same style as:
+//
+// web-animations/interfaces/Animation/style-change-events.html
+// web-animations/interfaces/KeyframeEffect/style-change-events.html
+
+promise_test(async t => {
+ const div = createDiv(t);
+
+ let gotTransition = false;
+ div.addEventListener('transitionrun', () => {
+ gotTransition = true;
+ });
+
+ // Create a covering animation but don't play it yet.
+ const coveringAnimation = new Animation(
+ new KeyframeEffect(div, { opacity: [0, 1] }, 100 * MS_PER_SEC)
+ );
+
+ // Setup transition start point.
+ div.style.transition = 'opacity 100s';
+ getComputedStyle(div).opacity;
+
+ // Update specified style but don't flush style.
+ div.style.opacity = '0.5';
+
+ // Get the currentTime
+ document.timeline.currentTime;
+
+ // Run the covering animation
+ coveringAnimation.play();
+
+ // If getting DocumentTimeline.currentTime produced a style change event it
+ // will trigger a transition. Otherwise, the covering animation will cause
+ // the before-change and after-change styles to be the same such that no
+ // transition is triggered on the next restyle.
+
+ // Wait for a couple of animation frames to give the transitionrun event
+ // a chance to be dispatched.
+ await waitForAnimationFrames(2);
+
+ assert_false(gotTransition, 'A transition should NOT have been triggered');
+}, 'DocumentTimeline.currentTime does NOT trigger a style change event');
+
+promise_test(async t => {
+ const div = createDiv(t);
+
+ let gotTransition = false;
+ div.addEventListener('transitionrun', () => {
+ gotTransition = true;
+ });
+
+ // Create a covering animation but don't play it yet.
+ const coveringAnimation = new Animation(
+ new KeyframeEffect(div, { opacity: [0, 1] }, 100 * MS_PER_SEC)
+ );
+
+ // Setup transition start point.
+ div.style.transition = 'opacity 100s';
+ getComputedStyle(div).opacity;
+
+ // Update specified style but don't flush style.
+ div.style.opacity = '0.5';
+
+ // Create a new DocumentTimeline
+ new DocumentTimeline();
+
+ // Run the covering animation
+ coveringAnimation.play();
+
+ // Wait for a couple of animation frames to give the transitionrun event
+ // a chance to be dispatched.
+ await waitForAnimationFrames(2);
+
+ assert_false(gotTransition, 'A transition should NOT have been triggered');
+}, 'DocumentTimeline constructor does NOT trigger a style change event');
+
+</script>
+</body>