[Web Animations] Turn Web Animations with CSS integration on for test runners
[WebKit-https.git] / LayoutTests / compositing / animation / layer-for-filling-animation.html
1 <!DOCTYPE html>
2
3 <html>
4 <head>
5     <style>
6         .box {
7             position: relative;
8             height: 100px;
9             width: 100px;
10             margin: 50px;
11             background-color: blue;
12             box-shadow: 0 0 10px black;
13         }
14         
15         .animating {
16             -webkit-animation: spin 1 0.1s forwards;
17         }
18
19         @-webkit-keyframes spin {
20             from { -webkit-transform: rotate(0); }
21             to   { -webkit-transform: rotate(3deg); }
22         }
23     </style>
24     <script>
25         if (window.testRunner) {
26             testRunner.dumpAsText();
27             testRunner.waitUntilDone();
28         }
29             
30         function doTest()
31         {
32             document.getElementById('box').addEventListener('webkitAnimationEnd', function() {
33                 if (window.testRunner) {
34                     document.getElementById('results').innerText = window.internals.layerTreeAsText(document);
35                     testRunner.notifyDone();
36                 }
37             })
38         }
39         window.addEventListener('load', doTest, false);
40     </script>
41 </head>
42 <body>
43 <div id="box" class="animating box"></div>
44
45 <pre id="results">Layer tree dump goes here</pre>
46 </body>
47 </html>