Update To 11.40.268.0
[platform/framework/web/crosswalk.git] / src / third_party / WebKit / LayoutTests / animations / pause-crash.html
1 <html>
2 <head>
3   <title>Pause and resume animation should not crash</title>
4   <style type="text/css" media="screen">
5     .box {
6       height: 100px;
7       width: 100px;
8       margin: 10px;
9       background-color: blue;
10       -webkit-animation-duration: 2s;
11       -webkit-animation-direction: alternate;
12       -webkit-animation-iteration-count: infinite;
13     }
14     
15     @-webkit-keyframes anim {
16         from { transform: matrix3d(1,0,0,0, 0,1,0,0, 0,0,1,0, 0,0,0,1); }
17         to   { transform: matrix3d(1,0,0,0, 0,1,0,0, 0,0,1,0, 400,0,0,1); }
18     }
19   </style>
20   <script type="text/javascript" charset="utf-8">
21     if (window.testRunner) {
22         testRunner.dumpAsText();
23         testRunner.waitUntilDone();
24     }
25
26     function animationStarted()
27     {
28         setTimeout(function() {
29             document.getElementById('box1').style.webkitAnimationPlayState = "paused";
30             setTimeout(function() {
31                 document.getElementById('box1').style.webkitAnimationPlayState = "running";
32                 setTimeout(function() {
33                     document.getElementById('results').innerHTML = 'Did not crash, so PASSED';
34                     if (window.testRunner)
35                         testRunner.notifyDone();
36                 }, 50);
37             }, 50);
38         }, 50);
39     }
40     
41     function startTest()
42     {
43         document.getElementById('box1').addEventListener('webkitAnimationStart', animationStarted);
44         document.getElementById('box1').style.webkitAnimationName = "anim";
45     }
46
47     window.addEventListener('load', startTest, false);
48   </script>
49 </head>
50 <body>
51
52 <p>Tests pause and resume animation. Should not crash. (https://bugs.webkit.org/show_bug.cgi?id=67510)</p>
53
54 <div id="container">
55   <div id="box1" class="box"></div>
56 </div>
57 <div id="results"></div>
58 </body>
59 </html>