OLD | NEW |
---|---|
(Empty) | |
1 <!DOCTYPE html> | |
2 <html> | |
3 <head> | |
esprehn
2014/05/23 01:05:58
We normally leave off the <html>, <head> and <body
ajuma
2014/05/23 14:38:31
Done.
| |
4 <style> | |
5 .shouldNotComposite { | |
6 width: 30px; | |
7 height: 30px; | |
8 margin: 4px; | |
9 background-color: blue; | |
10 } | |
11 | |
12 .positioned { | |
13 position: relative; | |
14 left: 40px; | |
15 } | |
16 | |
17 #willChangeContents { | |
18 will-change: contents; | |
19 } | |
20 | |
21 #willChangeOpacity { | |
22 will-change: opacity; | |
23 } | |
24 | |
25 #willChangeTransform { | |
26 will-change: -webkit-transform; | |
27 } | |
28 | |
29 #willChangeTop { | |
30 will-change: top; | |
31 } | |
32 | |
33 #willChangeLeft { | |
34 will-change: left; | |
35 } | |
36 | |
37 #animateOpacity { | |
38 -webkit-animation: fade-in-out 0.1s linear infinite alternate; | |
39 } | |
40 | |
41 @-webkit-keyframes fade-in-out { from { opacity: 0.3; } to { opacity: 0.9; } } | |
42 </style> | |
43 | |
44 <script> | |
45 if (window.testRunner) { | |
46 testRunner.dumpAsText(); | |
47 testRunner.waitUntilDone(); | |
48 } | |
49 | |
50 function animationEventListener() { | |
51 if (window.testRunner) { | |
52 document.getElementById('layertree').innerText = window.internals.layerT reeAsText(document); | |
53 testRunner.notifyDone(); | |
54 } | |
55 } | |
56 | |
57 window.addEventListener('load', function() { | |
esprehn
2014/05/23 01:05:58
I'd just do onload = function() { it's shorter
ajuma
2014/05/23 14:38:31
Done.
| |
58 document.getElementById('animateOpacity').addEventListener('webkitAnimatio nIteration', animationEventListener); | |
59 }, false); | |
60 </script> | |
61 </head> | |
62 <body> | |
63 <div id="willChangeContents"> | |
64 <div id="willChangeOpacity" class="shouldNotComposite"></div> | |
65 <div> | |
66 <div id="willChangeLeft" class="positioned shouldNotComposite"></div> | |
67 </div> | |
68 <div> | |
69 <div> | |
70 <div id="willChangeTransform" class="shouldNotComposite"> | |
71 <div id="willChangeTop" class="positioned shouldNotComposite"></div> | |
72 </div> | |
73 </div> | |
74 </div> | |
75 <div id="animateOpacity" class="shouldNotComposite"></div> | |
76 </div> | |
77 | |
78 <pre id="layertree"></pre> | |
79 </body> | |
80 </html> | |
OLD | NEW |