mirror of
https://github.com/servo/servo.git
synced 2025-06-29 11:33:39 +01:00
445 lines
9.5 KiB
HTML
445 lines
9.5 KiB
HTML
<!DOCTYPE html>
|
|
<meta charset=utf-8>
|
|
<title>progress of KeyframeEffectReadOnly getComputedTiming() tests</title>
|
|
<link rel="help" href="https://w3c.github.io/web-animations/#dom-animationeffectreadonly-getcomputedtiming">
|
|
<link rel="author" title="Daisuke Akatsuka" href="mailto:daisuke@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';
|
|
|
|
function executeTests(tests, description) {
|
|
tests.forEach(function(currentTest) {
|
|
var testParams = '';
|
|
for (var attr in currentTest.input) {
|
|
testParams += ' ' + attr + ':' + currentTest.input[attr];
|
|
}
|
|
test(function(t) {
|
|
var div = createDiv(t);
|
|
var anim = div.animate({ opacity: [ 0, 1 ] }, currentTest.input);
|
|
assert_equals(anim.effect.getComputedTiming().progress,
|
|
currentTest.before);
|
|
anim.currentTime = currentTest.input.delay || 0;
|
|
assert_equals(anim.effect.getComputedTiming().progress,
|
|
currentTest.active);
|
|
if (typeof currentTest.after !== 'undefined') {
|
|
anim.finish();
|
|
assert_equals(anim.effect.getComputedTiming().progress,
|
|
currentTest.after);
|
|
}
|
|
}, description + testParams);
|
|
});
|
|
}
|
|
|
|
async_test(function(t) {
|
|
var div = createDiv(t);
|
|
var anim = div.animate({ opacity: [ 0, 1 ] }, { delay: 1 });
|
|
assert_equals(anim.effect.getComputedTiming().progress, null);
|
|
anim.finished.then(t.step_func(function() {
|
|
assert_equals(anim.effect.getComputedTiming().progress, null);
|
|
t.done();
|
|
}));
|
|
}, 'Test progress during before and after phase when fill is none');
|
|
|
|
var gTests_zero_iterations = [
|
|
{
|
|
input: { iterations: 0,
|
|
iterationStart: 0,
|
|
duration: 0,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 0,
|
|
after: 0
|
|
},
|
|
|
|
{
|
|
input: { iterations: 0,
|
|
iterationStart: 0,
|
|
duration: 100,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 0,
|
|
after: 0
|
|
},
|
|
|
|
{
|
|
input: { iterations: 0,
|
|
iterationStart: 0,
|
|
duration: Infinity,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 0,
|
|
after: 0
|
|
},
|
|
|
|
{
|
|
input: { iterations: 0,
|
|
iterationStart: 2.5,
|
|
duration: 0,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0.5,
|
|
active: 0.5,
|
|
after: 0.5
|
|
},
|
|
|
|
{
|
|
input: { iterations: 0,
|
|
iterationStart: 2.5,
|
|
duration: 100,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0.5,
|
|
active: 0.5,
|
|
after: 0.5
|
|
},
|
|
|
|
{
|
|
input: { iterations: 0,
|
|
iterationStart: 2.5,
|
|
duration: Infinity,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0.5,
|
|
active: 0.5,
|
|
after: 0.5
|
|
},
|
|
|
|
{
|
|
input: { iterations: 0,
|
|
iterationStart: 3,
|
|
duration: 0,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 0,
|
|
after: 0
|
|
},
|
|
|
|
{
|
|
input: { iterations: 0,
|
|
iterationStart: 3,
|
|
duration: 100,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 0,
|
|
after: 0
|
|
},
|
|
|
|
{
|
|
input: { iterations: 0,
|
|
iterationStart: 3,
|
|
duration: Infinity,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 0,
|
|
after: 0
|
|
}
|
|
];
|
|
|
|
var gTests_integer_iterations = [
|
|
{
|
|
input: { iterations: 3,
|
|
iterationStart: 0,
|
|
duration: 0,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 1,
|
|
after: 1
|
|
},
|
|
|
|
{
|
|
input: { iterations: 3,
|
|
iterationStart: 0,
|
|
duration: 100,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 0,
|
|
after: 1
|
|
},
|
|
|
|
{
|
|
input: { iterations: 3,
|
|
iterationStart: 0,
|
|
duration: Infinity,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 0
|
|
},
|
|
|
|
{
|
|
input: { iterations: 3,
|
|
iterationStart: 2.5,
|
|
duration: 0,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0.5,
|
|
active: 0.5,
|
|
after: 0.5
|
|
},
|
|
|
|
{
|
|
input: { iterations: 3,
|
|
iterationStart: 2.5,
|
|
duration: 100,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0.5,
|
|
active: 0.5,
|
|
after: 0.5
|
|
},
|
|
|
|
{
|
|
input: { iterations: 3,
|
|
iterationStart: 2.5,
|
|
duration: Infinity,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0.5,
|
|
active: 0.5
|
|
},
|
|
|
|
{
|
|
input: { iterations: 3,
|
|
iterationStart: 3,
|
|
duration: 0,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 1,
|
|
after: 1
|
|
},
|
|
|
|
{
|
|
input: { iterations: 3,
|
|
iterationStart: 3,
|
|
duration: 100,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 0,
|
|
after: 1
|
|
},
|
|
|
|
{
|
|
input: { iterations: 3,
|
|
iterationStart: 3,
|
|
duration: Infinity,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 0
|
|
}
|
|
];
|
|
|
|
var gTests_fractional_iterations = [
|
|
{
|
|
input: { iterations: 3.5,
|
|
iterationStart: 0,
|
|
duration: 0,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 0.5,
|
|
after: 0.5
|
|
},
|
|
|
|
{
|
|
input: { iterations: 3.5,
|
|
iterationStart: 0,
|
|
duration: 100,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 0,
|
|
after: 0.5
|
|
},
|
|
|
|
{
|
|
input: { iterations: 3.5,
|
|
iterationStart: 0,
|
|
duration: Infinity,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 0
|
|
},
|
|
|
|
{
|
|
input: { iterations: 3.5,
|
|
iterationStart: 2.5,
|
|
duration: 0,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0.5,
|
|
active: 1,
|
|
after: 1
|
|
},
|
|
|
|
{
|
|
input: { iterations: 3.5,
|
|
iterationStart: 2.5,
|
|
duration: 100,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0.5,
|
|
active: 0.5,
|
|
after: 1
|
|
},
|
|
|
|
{
|
|
input: { iterations: 3.5,
|
|
iterationStart: 2.5,
|
|
duration: Infinity,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0.5,
|
|
active: 0.5
|
|
},
|
|
|
|
{
|
|
input: { iterations: 3.5,
|
|
iterationStart: 3,
|
|
duration: 0,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 0.5,
|
|
after: 0.5
|
|
},
|
|
|
|
{
|
|
input: { iterations: 3.5,
|
|
iterationStart: 3,
|
|
duration: 100,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 0,
|
|
after: 0.5
|
|
},
|
|
|
|
{
|
|
input: { iterations: 3.5,
|
|
iterationStart: 3,
|
|
duration: Infinity,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 0
|
|
}
|
|
];
|
|
|
|
var gTests_infinity_iterations = [
|
|
{
|
|
input: { iterations: Infinity,
|
|
iterationStart: 0,
|
|
duration: 0,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 1,
|
|
after: 1
|
|
},
|
|
|
|
{
|
|
input: { iterations: Infinity,
|
|
iterationStart: 0,
|
|
duration: 100,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 0
|
|
},
|
|
|
|
{
|
|
input: { iterations: Infinity,
|
|
iterationStart: 0,
|
|
duration: Infinity,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 0
|
|
},
|
|
|
|
{
|
|
input: { iterations: Infinity,
|
|
iterationStart: 2.5,
|
|
duration: 0,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0.5,
|
|
active: 0.5,
|
|
after: 0.5
|
|
},
|
|
|
|
{
|
|
input: { iterations: Infinity,
|
|
iterationStart: 2.5,
|
|
duration: 100,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0.5,
|
|
active: 0.5
|
|
},
|
|
|
|
{
|
|
input: { iterations: Infinity,
|
|
iterationStart: 2.5,
|
|
duration: Infinity,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0.5,
|
|
active: 0.5
|
|
},
|
|
|
|
{
|
|
input: { iterations: Infinity,
|
|
iterationStart: 3,
|
|
duration: 0,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 1,
|
|
after: 1
|
|
},
|
|
|
|
{
|
|
input: { iterations: Infinity,
|
|
iterationStart: 3,
|
|
duration: 100,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 0
|
|
},
|
|
|
|
{
|
|
input: { iterations: Infinity,
|
|
iterationStart: 3,
|
|
duration: Infinity,
|
|
delay: 1,
|
|
fill: 'both' },
|
|
before: 0,
|
|
active: 0
|
|
}
|
|
];
|
|
|
|
executeTests(gTests_zero_iterations, "Test zero iterations:");
|
|
executeTests(gTests_integer_iterations, "Test integer iterations:");
|
|
executeTests(gTests_fractional_iterations, "Test fractional iterations:");
|
|
executeTests(gTests_infinity_iterations, "Test infinity iterations:");
|
|
|
|
</script>
|
|
</body>
|