| <!DOCTYPE html> |
| |
| <html> |
| <head> |
| <style> |
| #fixed1, #fixed2 { |
| background-color: silver; |
| } |
| </style> |
| <script type="text/javascript"> |
| if (window.testRunner && window.internals) { |
| testRunner.dumpAsText(); |
| internals.settings.setPreferCompositingToLCDTextEnabled(true); |
| |
| addEventListener("load", function() { |
| document.getElementById("layerTree1").innerText = internals.layerTreeAsText(document); |
| document.getElementById("fixed1").style.top = "50px"; |
| document.getElementById("fixed2").style.height = "10px"; |
| document.getElementById("layerTree2").innerText = internals.layerTreeAsText(document); |
| document.getElementById("fixed1").style.top = "-100px"; |
| document.getElementById("fixed2").style.height = "0px"; |
| document.getElementById("layerTree3").innerText = internals.layerTreeAsText(document); |
| }, false); |
| } |
| </script> |
| </head> |
| |
| <!-- Fixed position elements may skip compositing without a scrollable |
| ancestor. To make sure this test covers the intended scenario, we force the |
| body element to be tall, so that the FrameView is scrolling. --> |
| <body style="height: 4000px;"> |
| Layer tree when the fixed elements are out-of-view (should have just a root layer): |
| <pre id="layerTree1"></pre> |
| Layer tree when the fixed elements are in-view (both fixed elements should have layers): |
| <pre id="layerTree2"></pre> |
| Layer tree when the fixed elements are out-of-view again (should have just a root layer): |
| <pre id="layerTree3"></pre> |
| <div id="fixed1" style="position: fixed; top: -100px; left: 100px; width: 10px; height: 10px"></div> |
| <div id="fixed2" style="position: fixed; top: 100px; left: 100px; width: 10px; height: 0px"></div> |
| </body> |
| </html> |
| |
