1b4a7626abb65ea3feb4508656bc7f29e697ad99
[WebKit-https.git] / LayoutTests / compositing / layer-creation / fixed-position-change-out-of-view-in-view.html
1 <!DOCTYPE html>
2
3 <html>
4 <head>
5   <style>
6     #fixed1, #fixed2 {
7         background-color: silver;
8     }
9   </style>
10   <script type="text/javascript">
11     if (window.testRunner && window.internals) {
12       testRunner.dumpAsText();
13       internals.settings.setAcceleratedCompositingForFixedPositionEnabled(true);
14
15       addEventListener("load", function() {
16         document.getElementById("layerTree1").innerText = internals.layerTreeAsText(document);
17         document.getElementById("fixed1").style.top = "50px";
18         document.getElementById("fixed2").style.height = "10px";
19         document.getElementById("layerTree2").innerText = internals.layerTreeAsText(document);
20         document.getElementById("fixed1").style.top = "-100px";
21         document.getElementById("fixed2").style.height = "0px";
22         document.getElementById("layerTree3").innerText = internals.layerTreeAsText(document);
23       }, false);
24     }
25   </script>
26 </head>
27
28 <body>
29   Layer tree when the fixed elements are out-of-view (should be blank):
30   <pre id="layerTree1"></pre>
31   Layer tree when the fixed elements are in-view (both fixed elements should have layers):
32   <pre id="layerTree2"></pre>
33   Layer tree when the fixed elements are out-of-view again (should be blank):
34   <pre id="layerTree3"></pre>
35   <div id="fixed1" style="position: fixed; top: -100px; left: 100px; width: 10px; height: 10px"></div>
36   <div id="fixed2" style="position: fixed; top: 100px; left: 100px; width: 10px; height: 0px"></div>
37 </body>
38 </html>
39