mirror of
https://github.com/servo/servo.git
synced 2025-07-10 17:03:40 +01:00
97 lines
3.4 KiB
HTML
97 lines
3.4 KiB
HTML
<!DOCTYPE html>
|
|
<meta charset=utf-8>
|
|
<title>endDelay tests</title>
|
|
<link rel="help" href="http://w3c.github.io/web-animations/#dom-animationeffecttiming-enddelay">
|
|
<link rel="author" title="Ryo Motozawa" href="mailto:motozawa@mozilla-japan.org">
|
|
<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';
|
|
|
|
test(function(t) {
|
|
var div = createDiv(t);
|
|
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
|
anim.effect.timing.endDelay = 123.45;
|
|
assert_times_equal(anim.effect.timing.endDelay, 123.45,
|
|
'set endDelay 123.45');
|
|
assert_times_equal(anim.effect.getComputedTiming().endDelay, 123.45,
|
|
'getComputedTiming() after set endDelay 123.45');
|
|
}, 'set endDelay 123.45');
|
|
|
|
test(function(t) {
|
|
var div = createDiv(t);
|
|
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
|
anim.effect.timing.endDelay = -1000;
|
|
assert_equals(anim.effect.timing.endDelay, -1000, 'set endDelay -1000');
|
|
assert_equals(anim.effect.getComputedTiming().endDelay, -1000,
|
|
'getComputedTiming() after set endDelay -1000');
|
|
}, 'set endDelay -1000');
|
|
|
|
test(function(t) {
|
|
var div = createDiv(t);
|
|
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
|
assert_throws({name: "TypeError"}, function() {
|
|
anim.effect.timing.endDelay = Infinity;
|
|
}, 'we can not assign Infinity to timing.endDelay');
|
|
}, 'set endDelay Infinity');
|
|
|
|
test(function(t) {
|
|
var div = createDiv(t);
|
|
var anim = div.animate({ opacity: [ 0, 1 ] }, 2000);
|
|
assert_throws({name: "TypeError"}, function() {
|
|
anim.effect.timing.endDelay = -Infinity;
|
|
}, 'we can not assign negative Infinity to timing.endDelay');
|
|
}, 'set endDelay negative Infinity');
|
|
|
|
async_test(function(t) {
|
|
var div = createDiv(t);
|
|
var anim = div.animate({ opacity: [ 0, 1 ] },
|
|
{ duration: 100000, endDelay: 50000 });
|
|
anim.onfinish = t.step_func(function(event) {
|
|
assert_unreached('onfinish event should not be fired');
|
|
});
|
|
|
|
anim.ready.then(function() {
|
|
anim.currentTime = 100000;
|
|
return waitForAnimationFrames(2);
|
|
}).then(t.step_func(function() {
|
|
t.done();
|
|
}));
|
|
}, 'onfinish event is not fired duration endDelay');
|
|
|
|
async_test(function(t) {
|
|
var div = createDiv(t);
|
|
var anim = div.animate({ opacity: [ 0, 1 ] },
|
|
{ duration: 100000, endDelay: 30000 });
|
|
var finishedTimelineTime;
|
|
anim.finished.then(function() {
|
|
finishedTimelineTime = anim.timeline.currentTime;
|
|
});
|
|
|
|
var receivedEvents = [];
|
|
anim.onfinish = function(event) {
|
|
receivedEvents.push(event);
|
|
}
|
|
|
|
anim.ready.then(function() {
|
|
anim.currentTime = 110000; // during endDelay
|
|
return waitForAnimationFrames(2);
|
|
}).then(t.step_func(function() {
|
|
assert_equals(receivedEvents.length, 0,
|
|
'onfinish event is should not be fired' +
|
|
'when currentTime is during endDelay');
|
|
anim.currentTime = 130000; // after endTime
|
|
return waitForAnimationFrames(2);
|
|
})).then(t.step_func_done(function() {
|
|
assert_equals(receivedEvents.length, 1, 'length of array should be one');
|
|
assert_equals(receivedEvents[0].timelineTime, finishedTimelineTime,
|
|
'receivedEvents[0].timelineTime should equal to the animation timeline '
|
|
+ 'when finished promise is resolved');
|
|
}));
|
|
}, 'onfinish event is fired currentTime is after endTime');
|
|
|
|
</script>
|
|
</body>
|