summaryrefslogtreecommitdiffstats
path: root/dom/animation/test/css-transitions/file_animation-finished.html
diff options
context:
space:
mode:
Diffstat (limited to 'dom/animation/test/css-transitions/file_animation-finished.html')
-rw-r--r--dom/animation/test/css-transitions/file_animation-finished.html61
1 files changed, 61 insertions, 0 deletions
diff --git a/dom/animation/test/css-transitions/file_animation-finished.html b/dom/animation/test/css-transitions/file_animation-finished.html
new file mode 100644
index 000000000..2f6bcf47d
--- /dev/null
+++ b/dom/animation/test/css-transitions/file_animation-finished.html
@@ -0,0 +1,61 @@
+<!doctype html>
+<meta charset=utf-8>
+<script src="../testcommon.js"></script>
+<style>
+
+.animated-div {
+ margin-left: 100px;
+ transition: margin-left 1000s linear 1000s;
+}
+
+</style>
+<body>
+<script>
+
+'use strict';
+
+const ANIM_DELAY_MS = 1000000; // 1000s
+const ANIM_DUR_MS = 1000000; // 1000s
+
+async_test(function(t) {
+ var div = addDiv(t, {'class': 'animated-div'});
+ flushComputedStyle(div);
+ div.style.marginLeft = '200px'; // initiate transition
+
+ var animation = div.getAnimations()[0];
+
+ animation.finish();
+
+ animation.finished.then(t.step_func(function() {
+ animation.play();
+ assert_equals(animation.currentTime, 0,
+ 'Replaying a finished transition should reset its ' +
+ 'currentTime');
+ t.done();
+ }));
+}, 'Test restarting a finished transition');
+
+async_test(function(t) {
+ var div = addDiv(t, {'class': 'animated-div'});
+ flushComputedStyle(div);
+ div.style.marginLeft = '200px'; // initiate transition
+
+ var animation = div.getAnimations()[0];
+
+ animation.ready.then(function() {
+ animation.playbackRate = -1;
+ return animation.finished;
+ }).then(t.step_func(function() {
+ animation.play();
+ // FIXME: once animation.effect.computedTiming.endTime is available (bug
+ // 1108055) we should use that here.
+ assert_equals(animation.currentTime, ANIM_DELAY_MS + ANIM_DUR_MS,
+ 'Replaying a finished reversed transition should reset ' +
+ 'its currentTime to the end of the effect');
+ t.done();
+ }));
+}, 'Test restarting a reversed finished transition');
+
+done();
+</script>
+</body>