Use background color for GraphicsLayers when applicable
[WebKit-https.git] / LayoutTests / compositing / overflow / content-gains-scrollbars.html
1 <!DOCTYPE html>
2 <style>
3 .container {
4 width: 100px;
5 height:100px;
6 position:absolute;
7 -webkit-transform:translateZ(0);
8 overflow:auto;
9 }
10
11 .content {
12 -webkit-transform: translateZ(0);
13 position:absolute;
14 width:10px;
15 height:10px;
16 }
17
18 .tall {
19 height:200px;
20 }
21
22 .wide {
23 width:200px;
24 }
25
26 .resizeWidget {
27 resize: both;
28 }
29
30 </style>
31 <pre id="layerTree"></pre>
32 <div class="container">
33   <div id="vertical" class="content"></div>
34 </div>
35 <div class="container">
36   <div id="horizontal" class="content"></div>
37 </div>
38 <div class="container">
39   <div id="both" class="content"></div>
40 </div>
41 <div id="corner" class="container">
42   <div class="content"></div>
43 </div>
44 <script>
45 function finishTest() {
46     document.getElementById("vertical").classList.add("tall"); // topmost div gets a vertical scrollbar
47     document.getElementById("horizontal").classList.add("wide"); // second div gets a horizontal scrollbar
48     document.getElementById("both").classList.add("wide"); // third div gets both
49     document.getElementById("both").classList.add("tall"); // vertical and horizontal scrollbars
50     document.getElementById("corner").classList.add("resizeWidget"); // bottom div gets a resize corner but no scrollbars
51     if (window.testRunner) {
52         testRunner.display(); // Ensure compositor tree is up to date.
53         document.getElementById("layerTree").innerText = window.internals.layerTreeAsText(document);
54     }
55 }
56
57 if (window.testRunner) {
58     testRunner.dumpAsText();
59     testRunner.display(); // Force compositor state to be updated before the container needs any overflow controls
60     finishTest();
61 } else
62     window.setTimeout(finishTest, 0);
63 </script>