OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 | 2 |
3 <html> | 3 <html> |
4 <head> | 4 <head> |
5 <style> | 5 <style> |
6 #fixed1, #fixed2 { | 6 #fixed1, #fixed2 { |
7 background-color: silver; | 7 background-color: silver; |
8 } | 8 } |
9 </style> | 9 </style> |
10 <script type="text/javascript"> | 10 <script type="text/javascript"> |
11 if (window.testRunner && window.internals) { | 11 if (window.testRunner && window.internals) { |
12 testRunner.dumpAsText(); | 12 testRunner.dumpAsText(); |
13 internals.settings.setAcceleratedCompositingForFixedPositionEnabled(true); | 13 internals.settings.setAcceleratedCompositingForFixedPositionEnabled(true); |
14 internals.settings.setFixedPositionCreatesStackingContext(true); | |
15 | 14 |
16 addEventListener("load", function() { | 15 addEventListener("load", function() { |
17 document.getElementById("layerTree1").innerText = internals.layerTreeAsT
ext(document); | 16 document.getElementById("layerTree1").innerText = internals.layerTreeAsT
ext(document); |
18 document.getElementById("fixed1").style.top = "50px"; | 17 document.getElementById("fixed1").style.top = "50px"; |
19 document.getElementById("fixed2").style.height = "10px"; | 18 document.getElementById("fixed2").style.height = "10px"; |
20 document.getElementById("layerTree2").innerText = internals.layerTreeAsT
ext(document); | 19 document.getElementById("layerTree2").innerText = internals.layerTreeAsT
ext(document); |
21 document.getElementById("fixed1").style.top = "-100px"; | 20 document.getElementById("fixed1").style.top = "-100px"; |
22 document.getElementById("fixed2").style.height = "0px"; | 21 document.getElementById("fixed2").style.height = "0px"; |
23 document.getElementById("layerTree3").innerText = internals.layerTreeAsT
ext(document); | 22 document.getElementById("layerTree3").innerText = internals.layerTreeAsT
ext(document); |
24 }, false); | 23 }, false); |
25 } | 24 } |
26 </script> | 25 </script> |
27 </head> | 26 </head> |
28 | 27 |
29 <!-- Fixed position elements may skip compositing without a scrollable | 28 <!-- Fixed position elements may skip compositing without a scrollable |
30 ancestor. To make sure this test covers the intended scenario, we force the | 29 ancestor. To make sure this test covers the intended scenario, we force the |
31 body element to be tall, so that the FrameView is scrolling. --> | 30 body element to be tall, so that the FrameView is scrolling. --> |
32 <body style="height: 4000px;"> | 31 <body style="height: 4000px;"> |
33 Layer tree when the fixed elements are out-of-view (should be blank): | 32 Layer tree when the fixed elements are out-of-view (should be blank): |
34 <pre id="layerTree1"></pre> | 33 <pre id="layerTree1"></pre> |
35 Layer tree when the fixed elements are in-view (both fixed elements should hav
e layers): | 34 Layer tree when the fixed elements are in-view (both fixed elements should hav
e layers): |
36 <pre id="layerTree2"></pre> | 35 <pre id="layerTree2"></pre> |
37 Layer tree when the fixed elements are out-of-view again (should be blank): | 36 Layer tree when the fixed elements are out-of-view again (should be blank): |
38 <pre id="layerTree3"></pre> | 37 <pre id="layerTree3"></pre> |
39 <div id="fixed1" style="position: fixed; top: -100px; left: 100px; width: 10px
; height: 10px"></div> | 38 <div id="fixed1" style="position: fixed; top: -100px; left: 100px; width: 10px
; height: 10px"></div> |
40 <div id="fixed2" style="position: fixed; top: 100px; left: 100px; width: 10px;
height: 0px"></div> | 39 <div id="fixed2" style="position: fixed; top: 100px; left: 100px; width: 10px;
height: 0px"></div> |
41 </body> | 40 </body> |
42 </html> | 41 </html> |
43 | 42 |
OLD | NEW |