OLD | NEW |
| (Empty) |
1 <!DOCTYPE html> | |
2 <html> | |
3 <head> | |
4 <style> | |
5 .squashed { | |
6 height: 40px; | |
7 width: 40px; | |
8 background-color: lightgreen; | |
9 position: absolute; | |
10 top: 90px; | |
11 } | |
12 .composited { | |
13 position: absolute; | |
14 margin-top: 5px; | |
15 height: 100px; | |
16 width: 100px; | |
17 background-color: lightblue; | |
18 -webkit-transform: translateZ(1px); | |
19 } | |
20 </style> | |
21 <script> | |
22 onload = function() { | |
23 if (window.testRunner) { | |
24 testRunner.waitUntilDone(); | |
25 internals.settings.setLayerSquashingEnabled(true); | |
26 } | |
27 | |
28 var target = document.getElementById('target3'); | |
29 requestAnimationFrame(function() { | |
30 target.style.backgroundColor = 'green'; | |
31 getComputedStyle(target).backgroundColor; | |
32 setTimeout(function() { | |
33 if (window.testRunner) | |
34 testRunner.notifyDone(); | |
35 }); | |
36 }); | |
37 } | |
38 </script> | |
39 </head> | |
40 <body> | |
41 <div id="target2" class="second composited"> | |
42 </div> | |
43 <div id="target3" class="squashed"></div> | |
44 </body> | |
45 </html> | |
OLD | NEW |