mirror of
https://github.com/servo/servo.git
synced 2025-08-06 22:15:33 +01:00
Update web-platform-tests to revision 697b971060b2d475a73c1c3755232a4674d61cf5
This commit is contained in:
Ms2ger
parent
f60598909a
commit
b97474fbba
236 changed files with 4817 additions and 893 deletions
|
|
@ -0,0 +1,24 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset=utf-8>
|
||||
<title>Active time tests</title>
|
||||
<link rel="help" href="https://w3c.github.io/web-animations/#active-time">
|
||||
<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';
|
||||
|
||||
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');
|
||||
|
||||
</script>
|
||||
</body>
|
||||
|
|
@ -0,0 +1,444 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset=utf-8>
|
||||
<title>Current iteration tests</title>
|
||||
<link rel="help" href="https://w3c.github.io/web-animations/#current-iteration">
|
||||
<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().currentIteration,
|
||||
currentTest.before);
|
||||
anim.currentTime = currentTest.input.delay || 0;
|
||||
assert_equals(anim.effect.getComputedTiming().currentIteration,
|
||||
currentTest.active);
|
||||
if (typeof currentTest.after !== 'undefined') {
|
||||
anim.finish();
|
||||
assert_equals(anim.effect.getComputedTiming().currentIteration,
|
||||
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().currentIteration, null);
|
||||
anim.finished.then(t.step_func(function() {
|
||||
assert_equals(anim.effect.getComputedTiming().currentIteration, null);
|
||||
t.done();
|
||||
}));
|
||||
}, 'Test currentIteration 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: 2,
|
||||
active: 2,
|
||||
after: 2
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: 0,
|
||||
iterationStart: 2.5,
|
||||
duration: 100,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 2,
|
||||
active: 2,
|
||||
after: 2
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: 0,
|
||||
iterationStart: 2.5,
|
||||
duration: Infinity,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 2,
|
||||
active: 2,
|
||||
after: 2
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: 0,
|
||||
iterationStart: 3,
|
||||
duration: 0,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 3,
|
||||
active: 3,
|
||||
after: 3
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: 0,
|
||||
iterationStart: 3,
|
||||
duration: 100,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 3,
|
||||
active: 3,
|
||||
after: 3
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: 0,
|
||||
iterationStart: 3,
|
||||
duration: Infinity,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 3,
|
||||
active: 3,
|
||||
after: 3
|
||||
}
|
||||
];
|
||||
|
||||
var gTests_integer_iterations = [
|
||||
{
|
||||
input: { iterations: 3,
|
||||
iterationStart: 0,
|
||||
duration: 0,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 0,
|
||||
active: 2,
|
||||
after: 2
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: 3,
|
||||
iterationStart: 0,
|
||||
duration: 100,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 0,
|
||||
active: 0,
|
||||
after: 2
|
||||
},
|
||||
|
||||
{
|
||||
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: 2,
|
||||
active: 5,
|
||||
after: 5
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: 3,
|
||||
iterationStart: 2.5,
|
||||
duration: 100,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 2,
|
||||
active: 2,
|
||||
after: 5
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: 3,
|
||||
iterationStart: 2.5,
|
||||
duration: Infinity,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 2,
|
||||
active: 2
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: 3,
|
||||
iterationStart: 3,
|
||||
duration: 0,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 3,
|
||||
active: 5,
|
||||
after: 5
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: 3,
|
||||
iterationStart: 3,
|
||||
duration: 100,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 3,
|
||||
active: 3,
|
||||
after: 5
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: 3,
|
||||
iterationStart: 3,
|
||||
duration: Infinity,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 3,
|
||||
active: 3
|
||||
}
|
||||
];
|
||||
|
||||
var gTests_fractional_iterations = [
|
||||
{
|
||||
input: { iterations: 3.5,
|
||||
iterationStart: 0,
|
||||
duration: 0,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 0,
|
||||
active: 3,
|
||||
after: 3
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: 3.5,
|
||||
iterationStart: 0,
|
||||
duration: 100,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 0,
|
||||
active: 0,
|
||||
after: 3
|
||||
},
|
||||
|
||||
{
|
||||
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: 2,
|
||||
active: 5,
|
||||
after: 5
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: 3.5,
|
||||
iterationStart: 2.5,
|
||||
duration: 100,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 2,
|
||||
active: 2,
|
||||
after: 5
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: 3.5,
|
||||
iterationStart: 2.5,
|
||||
duration: Infinity,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 2,
|
||||
active: 2
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: 3.5,
|
||||
iterationStart: 3,
|
||||
duration: 0,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 3,
|
||||
active: 6,
|
||||
after: 6
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: 3.5,
|
||||
iterationStart: 3,
|
||||
duration: 100,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 3,
|
||||
active: 3,
|
||||
after: 6
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: 3.5,
|
||||
iterationStart: 3,
|
||||
duration: Infinity,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 3,
|
||||
active: 3
|
||||
}
|
||||
];
|
||||
|
||||
var gTests_infinity_iterations = [
|
||||
{
|
||||
input: { iterations: Infinity,
|
||||
iterationStart: 0,
|
||||
duration: 0,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 0,
|
||||
active: Infinity,
|
||||
after: Infinity
|
||||
},
|
||||
|
||||
{
|
||||
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: 2,
|
||||
active: Infinity,
|
||||
after: Infinity
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: Infinity,
|
||||
iterationStart: 2.5,
|
||||
duration: 100,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 2,
|
||||
active: 2
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: Infinity,
|
||||
iterationStart: 2.5,
|
||||
duration: Infinity,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 2,
|
||||
active: 2
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: Infinity,
|
||||
iterationStart: 3,
|
||||
duration: 0,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 3,
|
||||
active: Infinity,
|
||||
after: Infinity
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: Infinity,
|
||||
iterationStart: 3,
|
||||
duration: 100,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 3,
|
||||
active: 3
|
||||
},
|
||||
|
||||
{
|
||||
input: { iterations: Infinity,
|
||||
iterationStart: 3,
|
||||
duration: Infinity,
|
||||
delay: 1,
|
||||
fill: 'both' },
|
||||
before: 3,
|
||||
active: 3
|
||||
}
|
||||
];
|
||||
|
||||
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>
|
||||
|
|
@ -0,0 +1,435 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset=utf-8>
|
||||
<title>Simple iteration progress tests</title>
|
||||
<link rel="help"
|
||||
href="https://w3c.github.io/web-animations/#simple-iteration-progress">
|
||||
<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);
|
||||
});
|
||||
}
|
||||
|
||||
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>
|
||||
|
|
@ -0,0 +1,205 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset=utf-8>
|
||||
<title>Setting the start time tests</title>
|
||||
<link rel="help" href="https://w3c.github.io/web-animations/#set-the-animation-start-time">
|
||||
<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)
|
||||
{
|
||||
// It should only be possible to set *either* the start time or the current
|
||||
// time for an animation that does not have an active timeline.
|
||||
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC));
|
||||
|
||||
assert_equals(animation.currentTime, null, 'Intial current time');
|
||||
assert_equals(animation.startTuime, null, 'Intial start time');
|
||||
|
||||
animation.currentTime = 1000;
|
||||
assert_equals(animation.currentTime, 1000,
|
||||
'Setting the current time succeeds');
|
||||
assert_equals(animation.startTime, null,
|
||||
'Start time remains null after setting current time');
|
||||
|
||||
animation.startTime = 1000;
|
||||
assert_equals(animation.startTime, 1000,
|
||||
'Setting the start time succeeds');
|
||||
assert_equals(animation.currentTime, null,
|
||||
'Setting the start time clears the current time');
|
||||
|
||||
animation.startTime = null;
|
||||
assert_equals(animation.startTime, null,
|
||||
'Setting the start time to an unresolved time succeeds');
|
||||
assert_equals(animation.currentTime, null, 'The current time is unaffected');
|
||||
|
||||
}, 'Setting the start time of an animation without an active timeline');
|
||||
|
||||
test(function(t)
|
||||
{
|
||||
// Setting an unresolved start time on an animation without an active
|
||||
// timeline should not clear the current time.
|
||||
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC));
|
||||
|
||||
assert_equals(animation.currentTime, null, 'Intial current time');
|
||||
assert_equals(animation.startTuime, null, 'Intial start time');
|
||||
|
||||
animation.currentTime = 1000;
|
||||
assert_equals(animation.currentTime, 1000,
|
||||
'Setting the current time succeeds');
|
||||
assert_equals(animation.startTime, null,
|
||||
'Start time remains null after setting current time');
|
||||
|
||||
animation.startTime = null;
|
||||
assert_equals(animation.startTime, null, 'Start time remains unresolved');
|
||||
assert_equals(animation.currentTime, 1000, 'Current time is unaffected');
|
||||
|
||||
}, 'Setting an unresolved start time an animation without an active timeline'
|
||||
+ ' does not clear the current time');
|
||||
|
||||
test(function(t)
|
||||
{
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
document.timeline);
|
||||
|
||||
// So long as a hold time is set, querying the current time will return
|
||||
// the hold time.
|
||||
|
||||
// Since the start time is unresolved at this point, setting the current time
|
||||
// will set the hold time
|
||||
animation.currentTime = 1000;
|
||||
assert_equals(animation.currentTime, 1000,
|
||||
'The current time is calculated from the hold time');
|
||||
|
||||
// If we set the start time, however, we should clear the hold time.
|
||||
animation.startTime = document.timeline.currentTime - 2000;
|
||||
assert_times_equal(animation.currentTime, 2000,
|
||||
'The current time is calculated from the start time,'
|
||||
+ ' not the hold time');
|
||||
|
||||
// Sanity check
|
||||
assert_equals(animation.playState, 'running',
|
||||
'Animation reports it is running after setting a resolved'
|
||||
+ ' start time');
|
||||
}, 'Setting the start time clears the hold time');
|
||||
|
||||
test(function(t)
|
||||
{
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
document.timeline);
|
||||
|
||||
// Set up a running animation (i.e. both start time and current time
|
||||
// are resolved).
|
||||
animation.startTime = document.timeline.currentTime - 1000;
|
||||
assert_equals(animation.playState, 'running');
|
||||
assert_times_equal(animation.currentTime, 1000,
|
||||
'Current time is resolved for a running animation')
|
||||
|
||||
// Clear start time
|
||||
animation.startTime = null;
|
||||
assert_times_equal(animation.currentTime, 1000,
|
||||
'Hold time is set after start time is made unresolved');
|
||||
assert_equals(animation.playState, 'paused',
|
||||
'Animation reports it is paused after setting an unresolved'
|
||||
+ ' start time');
|
||||
}, 'Setting an unresolved start time sets the hold time');
|
||||
|
||||
promise_test(function(t)
|
||||
{
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
document.timeline);
|
||||
|
||||
var readyPromiseCallbackCalled = false;
|
||||
animation.ready.then(function() { readyPromiseCallbackCalled = true; } );
|
||||
|
||||
// Put the animation in the play-pending state
|
||||
animation.play();
|
||||
|
||||
// Sanity check
|
||||
assert_equals(animation.playState, 'pending',
|
||||
'Animation is in play-pending state');
|
||||
|
||||
// Setting the start time should resolve the 'ready' promise, i.e.
|
||||
// it should schedule a microtask to run the promise callbacks.
|
||||
animation.startTime = document.timeline.currentTime;
|
||||
assert_false(readyPromiseCallbackCalled,
|
||||
'Ready promise callback is not called synchronously');
|
||||
|
||||
// If we schedule another microtask then it should run immediately after
|
||||
// the ready promise resolution microtask.
|
||||
return Promise.resolve().then(function() {
|
||||
assert_true(readyPromiseCallbackCalled,
|
||||
'Ready promise callback called after setting startTime');
|
||||
});
|
||||
}, 'Setting the start time resolves a pending ready promise');
|
||||
|
||||
promise_test(function(t)
|
||||
{
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
document.timeline);
|
||||
|
||||
var readyPromiseCallbackCalled = false;
|
||||
animation.ready.then(function() { readyPromiseCallbackCalled = true; } );
|
||||
|
||||
// Put the animation in the pause-pending state
|
||||
animation.startTime = document.timeline.currentTime;
|
||||
animation.pause();
|
||||
|
||||
// Sanity check
|
||||
assert_equals(animation.playState, 'pending',
|
||||
'Animation is in pause-pending state');
|
||||
|
||||
// Setting the start time should resolve the 'ready' promise although
|
||||
// the resolution callbacks when be run in a separate microtask.
|
||||
animation.startTime = null;
|
||||
assert_false(readyPromiseCallbackCalled,
|
||||
'Ready promise callback is not called synchronously');
|
||||
|
||||
return Promise.resolve().then(function() {
|
||||
assert_true(readyPromiseCallbackCalled,
|
||||
'Ready promise callback called after setting startTime');
|
||||
});
|
||||
}, 'Setting the start time resolves a pending pause task');
|
||||
|
||||
promise_test(function(t)
|
||||
{
|
||||
var animation =
|
||||
new Animation(new KeyframeEffect(createDiv(t), null, 100 * MS_PER_SEC),
|
||||
document.timeline);
|
||||
|
||||
// Set start time such that the current time is past the end time
|
||||
animation.startTime = document.timeline.currentTime
|
||||
- 110 * MS_PER_SEC;
|
||||
assert_equals(animation.playState, 'finished',
|
||||
'Seeked to finished state using the startTime');
|
||||
|
||||
// If the 'did seek' flag is true, the current time should be greater than
|
||||
// the effect end.
|
||||
assert_greater_than(animation.currentTime,
|
||||
animation.effect.getComputedTiming().endTime,
|
||||
'Setting the start time updated the finished state with'
|
||||
+ ' the \'did seek\' flag set to true');
|
||||
|
||||
// Furthermore, that time should persist if we have correctly updated
|
||||
// the hold time
|
||||
var finishedCurrentTime = animation.currentTime;
|
||||
return waitForAnimationFrames(1).then(function() {
|
||||
assert_equals(animation.currentTime, finishedCurrentTime,
|
||||
'Current time does not change after seeking past the effect'
|
||||
+ ' end time by setting the current time');
|
||||
});
|
||||
}, 'Setting the start time updates the finished state');
|
||||
|
||||
</script>
|
||||
</body>
|
||||
Loading…
Add table
Add a link
Reference in a new issue