mirror of
https://github.com/servo/servo.git
synced 2025-06-24 00:54:32 +01:00
212 lines
7.9 KiB
HTML
212 lines
7.9 KiB
HTML
<!DOCTYPE html>
|
|
<meta charset=utf-8>
|
|
<title>KeyframeEffectReadOnly getComputedTiming() tests</title>
|
|
<link rel="help" href="https://w3c.github.io/web-animations/#dom-animationeffectreadonly-getcomputedtiming">
|
|
<link rel="author" title="Boris Chiou" href="mailto:boris.chiou@gmail.com">
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<script src="../../testcommon.js"></script>
|
|
<body>
|
|
<div id="log"></div>
|
|
<div id="target"></div>
|
|
<script>
|
|
"use strict";
|
|
|
|
var target = document.getElementById("target");
|
|
|
|
test(function(t) {
|
|
var effect = new KeyframeEffectReadOnly(target,
|
|
{ left: ["10px", "20px"] });
|
|
|
|
var ct = effect.getComputedTiming();
|
|
assert_equals(ct.delay, 0, "computed delay");
|
|
assert_equals(ct.fill, "none", "computed fill");
|
|
assert_equals(ct.iterations, 1.0, "computed iterations");
|
|
assert_equals(ct.duration, 0, "computed duration");
|
|
assert_equals(ct.direction, "normal", "computed direction");
|
|
}, "values of getComputedTiming() when a KeyframeEffectReadOnly is " +
|
|
"constructed without any KeyframeEffectOptions object");
|
|
|
|
var gGetComputedTimingTests = [
|
|
{ desc: "an empty KeyframeEffectOptions object",
|
|
input: { },
|
|
expected: { } },
|
|
{ desc: "a normal KeyframeEffectOptions object",
|
|
input: { delay: 1000,
|
|
fill: "auto",
|
|
iterations: 5.5,
|
|
duration: "auto",
|
|
direction: "alternate" },
|
|
expected: { delay: 1000,
|
|
fill: "none",
|
|
iterations: 5.5,
|
|
duration: 0,
|
|
direction: "alternate" } },
|
|
{ desc: "a double value",
|
|
input: 3000,
|
|
timing: { duration: 3000 },
|
|
expected: { delay: 0,
|
|
fill: "none",
|
|
iterations: 1,
|
|
duration: 3000,
|
|
direction: "normal" } },
|
|
{ desc: "+Infinity",
|
|
input: Infinity,
|
|
expected: { duration: Infinity } },
|
|
{ desc: "an Infinity duration",
|
|
input: { duration: Infinity },
|
|
expected: { duration: Infinity } },
|
|
{ desc: "an auto duration",
|
|
input: { duration: "auto" },
|
|
expected: { duration: 0 } },
|
|
{ desc: "an Infinity iterations",
|
|
input: { iterations: Infinity },
|
|
expected: { iterations: Infinity } },
|
|
{ desc: "an auto fill",
|
|
input: { fill: "auto" },
|
|
expected: { fill: "none" } },
|
|
{ desc: "a forwards fill",
|
|
input: { fill: "forwards" },
|
|
expected: { fill: "forwards" } }
|
|
];
|
|
|
|
gGetComputedTimingTests.forEach(function(stest) {
|
|
test(function(t) {
|
|
var effect = new KeyframeEffectReadOnly(target,
|
|
{ left: ["10px", "20px"] },
|
|
stest.input);
|
|
|
|
// Helper function to provide default expected values when the test does
|
|
// not supply them.
|
|
var expected = function(field, defaultValue) {
|
|
return field in stest.expected ? stest.expected[field] : defaultValue;
|
|
};
|
|
|
|
var ct = effect.getComputedTiming();
|
|
assert_equals(ct.delay, expected("delay", 0),
|
|
"computed delay");
|
|
assert_equals(ct.fill, expected("fill", "none"),
|
|
"computed fill");
|
|
assert_equals(ct.iterations, expected("iterations", 1),
|
|
"computed iterations");
|
|
assert_equals(ct.duration, expected("duration", 0),
|
|
"computed duration");
|
|
assert_equals(ct.direction, expected("direction", "normal"),
|
|
"computed direction");
|
|
|
|
}, "values of getComputedTiming() when a KeyframeEffectReadOnly is " +
|
|
"constructed by " + stest.desc);
|
|
});
|
|
|
|
var gActiveDurationTests = [
|
|
{ desc: "an empty KeyframeEffectOptions object",
|
|
input: { },
|
|
expected: 0 },
|
|
{ desc: "a non-zero duration and default iteration count",
|
|
input: { duration: 1000 },
|
|
expected: 1000 },
|
|
{ desc: "a non-zero duration and integral iteration count",
|
|
input: { duration: 1000, iterations: 7 },
|
|
expected: 7000 },
|
|
{ desc: "a non-zero duration and fractional iteration count",
|
|
input: { duration: 1000, iterations: 2.5 },
|
|
expected: 2500 },
|
|
{ desc: "an non-zero duration and infinite iteration count",
|
|
input: { duration: 1000, iterations: Infinity },
|
|
expected: Infinity },
|
|
{ desc: "an non-zero duration and zero iteration count",
|
|
input: { duration: 1000, iterations: 0 },
|
|
expected: 0 },
|
|
{ desc: "a zero duration and default iteration count",
|
|
input: { duration: 0 },
|
|
expected: 0 },
|
|
{ desc: "a zero duration and fractional iteration count",
|
|
input: { duration: 0, iterations: 2.5 },
|
|
expected: 0 },
|
|
{ desc: "a zero duration and infinite iteration count",
|
|
input: { duration: 0, iterations: Infinity },
|
|
expected: 0 },
|
|
{ desc: "a zero duration and zero iteration count",
|
|
input: { duration: 0, iterations: 0 },
|
|
expected: 0 },
|
|
{ desc: "an infinite duration and default iteration count",
|
|
input: { duration: Infinity },
|
|
expected: Infinity },
|
|
{ desc: "an infinite duration and zero iteration count",
|
|
input: { duration: Infinity, iterations: 0 },
|
|
expected: 0 },
|
|
{ desc: "an infinite duration and fractional iteration count",
|
|
input: { duration: Infinity, iterations: 2.5 },
|
|
expected: Infinity },
|
|
{ desc: "an infinite duration and infinite iteration count",
|
|
input: { duration: Infinity, iterations: Infinity },
|
|
expected: Infinity },
|
|
];
|
|
|
|
gActiveDurationTests.forEach(function(stest) {
|
|
test(function(t) {
|
|
var effect = new KeyframeEffectReadOnly(target,
|
|
{ left: ["10px", "20px"] },
|
|
stest.input);
|
|
|
|
assert_equals(effect.getComputedTiming().activeDuration,
|
|
stest.expected);
|
|
|
|
}, "getComputedTiming().activeDuration for " + stest.desc);
|
|
});
|
|
|
|
var gEndTimeTests = [
|
|
{ desc: "an empty KeyframeEffectOptions object",
|
|
input: { },
|
|
expected: 0 },
|
|
{ desc: "a non-zero duration and default iteration count",
|
|
input: { duration: 1000 },
|
|
expected: 1000 },
|
|
{ desc: "a non-zero duration and non-default iteration count",
|
|
input: { duration: 1000, iterations: 2.5 },
|
|
expected: 2500 },
|
|
{ desc: "a non-zero duration and non-zero delay",
|
|
input: { duration: 1000, delay: 1500 },
|
|
expected: 2500 },
|
|
{ desc: "a non-zero duration, non-zero delay and non-default iteration",
|
|
input: { duration: 1000, delay: 1500, iterations: 2 },
|
|
expected: 3500 },
|
|
{ desc: "an infinite iteration count",
|
|
input: { duration: 1000, iterations: Infinity },
|
|
expected: Infinity },
|
|
{ desc: "an infinite duration",
|
|
input: { duration: Infinity, iterations: 10 },
|
|
expected: Infinity },
|
|
{ desc: "an infinite duration and delay",
|
|
input: { duration: Infinity, iterations: 10, delay: 1000 },
|
|
expected: Infinity },
|
|
{ desc: "an infinite duration and negative delay",
|
|
input: { duration: Infinity, iterations: 10, delay: -1000 },
|
|
expected: Infinity },
|
|
{ desc: "an non-zero duration and negative delay",
|
|
input: { duration: 1000, iterations: 2, delay: -1000 },
|
|
expected: 1000 },
|
|
{ desc: "an non-zero duration and negative delay greater than active " +
|
|
"duration",
|
|
input: { duration: 1000, iterations: 2, delay: -3000 },
|
|
expected: 0 },
|
|
{ desc: "a zero duration and negative delay",
|
|
input: { duration: 0, iterations: 2, delay: -1000 },
|
|
expected: 0 }
|
|
];
|
|
|
|
gEndTimeTests.forEach(function(stest) {
|
|
test(function(t) {
|
|
var effect = new KeyframeEffectReadOnly(target,
|
|
{ left: ["10px", "20px"] },
|
|
stest.input);
|
|
|
|
assert_equals(effect.getComputedTiming().endTime,
|
|
stest.expected);
|
|
|
|
}, "getComputedTiming().endTime for " + stest.desc);
|
|
});
|
|
|
|
done();
|
|
</script>
|
|
</body>
|