2009-03-11 Simon Fraser <simon.fraser@apple.com>
[WebKit-https.git] / LayoutTests / animations / keyframes-to-missing.html
1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
2    "http://www.w3.org/TR/html4/loose.dtd">
3
4 <html lang="en">
5 <head>
6   <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
7   <title>Keyframes test with 'to' keyframe missing</title>
8   <style type="text/css" media="screen">
9     #box {
10         position: absolute;
11         left: 0;
12         top: 100px;
13         height: 100px;
14         width: 100px;
15         background-color: blue;
16         -webkit-animation-duration: 1s;
17         -webkit-animation-timing-function: linear;
18         -webkit-animation-name: "anim";
19     }
20     @-webkit-keyframes "anim" {
21         from { left: 50px; }
22         20%  { left: 100px; }
23         40%  { left: 100px; }
24         60%  { left: 200px; }
25         80%  { left: 200px; }
26     }
27     </style>
28     <script type="text/javascript" charset="utf-8">
29     
30     function start()
31     {
32         layoutTestController.dumpAsText();
33         
34         if (layoutTestController.pauseAnimationAtTimeOnElementWithId("anim", 0.5, "box"))
35             document.getElementById('result').innerHTML = "FAIL: animation is running";
36         else
37             document.getElementById('result').innerHTML = "PASS";
38     }
39     
40     if (window.layoutTestController)
41         window.addEventListener('load', start, false);
42     
43   </script>
44 </head>
45 <body>
46 This test performs an animation of the left property. The 'to' keyframe is missing so it should not animate
47 <div id="box">
48 </div>
49 <div id="result">
50 </div>
51 </body>
52 </html>