Skip to content
Find file
Fetching contributors…
Cannot retrieve contributors at this time
184 lines (144 sloc) 5.14 KB
<html>
<head>
<style type="text/css" media="screen">
@-webkit-keyframes test1 {
from { left: 10px; }
to { left: 20px; }
}
@-webkit-keyframes test2 {
0% { left: 10px; }
50% { left: 30px; }
100% { left: 20px; }
}
#a {
-webkit-animation-name: test1;
-webkit-animation-duration: 1s;
}
#b {
-webkit-animation-name: test1;
-webkit-animation-duration: 2s;
-webkit-animation-delay: 3s;
-webkit-animation-iteration-count: 4;
-webkit-animation-direction: normal;
-webkit-animation-fill-mode: none;
}
#c {
-webkit-animation-name: test2;
-webkit-animation-duration: 5s;
-webkit-animation-delay: -1s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-direction: alternate;
-webkit-animation-fill-mode: forwards;
}
#d {
-webkit-animation-name: test1, test2;
-webkit-animation-duration: 1s, 2s;
-webkit-animation-delay: 0s, 1s;
-webkit-animation-iteration-count: 10, infinite;
-webkit-animation-direction: normal, alternate;
-webkit-animation-fill-mode: backwards, both;
}
</style>
<script src="../fast/js/resources/js-test-pre.js"></script>
</head>
<body>
<div id="a"></div>
<div id="b"></div>
<div id="c"></div>
<div id="d"></div>
<p id="description"></p>
<div id="console"></div>
<script>
description("This tests the WebKitAnimation interface.");
shouldBeDefined("window.WebKitAnimation");
shouldBeDefined("window.WebKitAnimationList");
/* *********************************************** */
debug("");
debug("Test an almost-default animation");
var a = document.getElementById("a");
var a_animations = a.webkitGetAnimations();
shouldBe("a_animations.length", "1");
var a_animation_0 = a_animations[0];
shouldBeDefined("a_animation_0");
debug("");
shouldBe("a_animation_0.name", "'test1'");
shouldBe("a_animation_0.duration", "1");
shouldBe("a_animation_0.delay", "0");
shouldBe("a_animation_0.iterationCount", "1");
shouldBe("a_animation_0.paused", "false");
shouldBe("a_animation_0.ended", "false");
shouldBe("a_animation_0.direction", "window.WebKitAnimation.DIRECTION_NORMAL");
shouldBe("a_animation_0.fillMode", "window.WebKitAnimation.FILL_NONE");
/* *********************************************** */
debug("");
debug("Test a specified animation");
var b = document.getElementById("b");
var b_animations = b.webkitGetAnimations();
shouldBe("b_animations.length", "1");
var b_animation_0 = b_animations[0];
shouldBeDefined("b_animation_0");
debug("");
shouldBe("b_animation_0.name", "'test1'");
shouldBe("b_animation_0.duration", "2");
shouldBe("b_animation_0.delay", "3");
shouldBe("b_animation_0.iterationCount", "4");
shouldBe("b_animation_0.paused", "false");
shouldBe("b_animation_0.ended", "false");
shouldBe("b_animation_0.direction", "window.WebKitAnimation.DIRECTION_NORMAL");
shouldBe("b_animation_0.fillMode", "window.WebKitAnimation.FILL_NONE");
/* *********************************************** */
debug("");
debug("Test negative delay, fill mode, direction and infinite iterations");
var c = document.getElementById("c");
var c_animations = c.webkitGetAnimations();
shouldBe("c_animations.length", "1");
var c_animation_0 = c_animations[0];
shouldBeDefined("c_animation_0");
debug("");
shouldBe("c_animation_0.name", "'test2'");
shouldBe("c_animation_0.duration", "5");
shouldBe("c_animation_0.delay", "-1");
shouldBe("c_animation_0.iterationCount", "Number.POSITIVE_INFINITY");
shouldBe("c_animation_0.paused", "false");
shouldBe("c_animation_0.ended", "false");
shouldBe("c_animation_0.direction", "window.WebKitAnimation.DIRECTION_ALTERNATE");
shouldBe("c_animation_0.fillMode", "window.WebKitAnimation.FILL_FORWARDS");
/* *********************************************** */
debug("");
debug("Test multiple animations");
var d = document.getElementById("d");
var d_animations = d.webkitGetAnimations();
shouldBe("d_animations.length", "2");
var d_animation_0 = d_animations[0];
shouldBeDefined("d_animation_0");
debug("");
shouldBe("d_animation_0.name", "'test1'");
shouldBe("d_animation_0.duration", "1");
shouldBe("d_animation_0.delay", "0");
shouldBe("d_animation_0.iterationCount", "10");
shouldBe("d_animation_0.paused", "false");
shouldBe("d_animation_0.ended", "false");
shouldBe("d_animation_0.direction", "window.WebKitAnimation.DIRECTION_NORMAL");
shouldBe("d_animation_0.fillMode", "window.WebKitAnimation.FILL_BACKWARDS");
var d_animation_1 = d_animations[1];
shouldBeDefined("d_animation_1");
debug("");
shouldBe("d_animation_1.name", "'test2'");
shouldBe("d_animation_1.duration", "2");
shouldBe("d_animation_1.delay", "1");
shouldBe("d_animation_1.iterationCount", "Number.POSITIVE_INFINITY");
shouldBe("d_animation_1.paused", "false");
shouldBe("d_animation_1.ended", "false");
shouldBe("d_animation_1.direction", "window.WebKitAnimation.DIRECTION_ALTERNATE");
shouldBe("d_animation_1.fillMode", "window.WebKitAnimation.FILL_BOTH");
/* *********************************************** */
debug("");
debug("Test element with no animations");
var e = document.getElementById("description");
var e_animations = e.webkitGetAnimations();
shouldBeNull("e_animations");
debug("");
</script>
<script src="../fast/js/resources/js-test-post.js"></script>
</body>
</html>
Jump to Line
Something went wrong with that request. Please try again.