mirror of
https://github.com/servo/servo.git
synced 2025-08-12 17:05:33 +01:00
Update web-platform-tests to revision 0a518aaff73532a26e175789f7e75fa99593ac64
This commit is contained in:
parent
9c172f49d0
commit
abcd4b654f
92 changed files with 2869 additions and 642 deletions
|
@ -0,0 +1,84 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset=utf-8>
|
||||
<title>easing tests</title>
|
||||
<link rel="help" href="https://w3c.github.io/web-animations/#dom-animationeffecttiming-easing">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="../testcommon.js"></script>
|
||||
<script src="../resources/effect-easing-tests.js"></script>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
function assert_progress(animation, currentTime, easingFunction) {
|
||||
animation.currentTime = currentTime;
|
||||
var portion = currentTime / animation.effect.timing.duration;
|
||||
assert_approx_equals(animation.effect.getComputedTiming().progress,
|
||||
easingFunction(portion),
|
||||
0.01,
|
||||
'The progress of the animation should be approximately ' +
|
||||
easingFunction(portion) + ' at ' + currentTime + 'ms');
|
||||
}
|
||||
|
||||
gEffectEasingTests.forEach(function(options) {
|
||||
test(function(t) {
|
||||
var target = createDiv(t);
|
||||
var anim = target.animate([ { opacity: 0 }, { opacity: 1 } ],
|
||||
{ duration: 1000 * MS_PER_SEC,
|
||||
fill: 'forwards' });
|
||||
anim.effect.timing.easing = options.easing;
|
||||
assert_equals(anim.effect.timing.easing, options.easing);
|
||||
|
||||
var easing = options.easingFunction;
|
||||
assert_progress(anim, 0, easing);
|
||||
assert_progress(anim, 250 * MS_PER_SEC, easing);
|
||||
assert_progress(anim, 500 * MS_PER_SEC, easing);
|
||||
assert_progress(anim, 750 * MS_PER_SEC, easing);
|
||||
assert_progress(anim, 1000 * MS_PER_SEC, easing);
|
||||
}, options.desc);
|
||||
});
|
||||
|
||||
test(function(t) {
|
||||
var div = createDiv(t);
|
||||
var anim = div.animate({ opacity: [ 0, 1 ] }, 100 * MS_PER_SEC);
|
||||
assert_throws({ name: 'TypeError' },
|
||||
function() {
|
||||
anim.effect.timing.easing = '';
|
||||
});
|
||||
assert_throws({ name: 'TypeError' },
|
||||
function() {
|
||||
anim.effect.timing.easing = 'test';
|
||||
});
|
||||
}, 'Test invalid easing value');
|
||||
|
||||
test(function(t) {
|
||||
var delay = 1000 * MS_PER_SEC;
|
||||
|
||||
var target = createDiv(t);
|
||||
var anim = target.animate([ { opacity: 0 }, { opacity: 1 } ],
|
||||
{ duration: 1000 * MS_PER_SEC,
|
||||
fill: 'both',
|
||||
delay: delay,
|
||||
easing: 'steps(2, start)' });
|
||||
|
||||
anim.effect.timing.easing = 'steps(2, end)';
|
||||
assert_equals(anim.effect.getComputedTiming().progress, 0,
|
||||
'easing replace to steps(2, end) at before phase');
|
||||
|
||||
anim.currentTime = delay + 750 * MS_PER_SEC;
|
||||
assert_equals(anim.effect.getComputedTiming().progress, 0.5,
|
||||
'change currentTime to active phase');
|
||||
|
||||
anim.effect.timing.easing = 'steps(2, start)';
|
||||
assert_equals(anim.effect.getComputedTiming().progress, 1,
|
||||
'easing replace to steps(2, start) at active phase');
|
||||
|
||||
anim.currentTime = delay + 1500 * MS_PER_SEC;
|
||||
anim.effect.timing.easing = 'steps(2, end)';
|
||||
assert_equals(anim.effect.getComputedTiming().progress, 1,
|
||||
'easing replace to steps(2, end) again at after phase');
|
||||
}, 'Change the easing while the animation is running');
|
||||
|
||||
</script>
|
||||
</body>
|
Loading…
Add table
Add a link
Reference in a new issue