Merge Chromium + Blink git repositories
[chromium-blink-merge.git] / third_party / WebKit / LayoutTests / compositing / overflow / composited-scrolling-paint-phases.html
blob6b625e5a389e249d215d9eba462378bf50c51339
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
5 <title>Composited scrolling paint phases</title>
6 <style type="text/css" media="screen">
7 .container {
8 width: 200px;
9 height: 200px;
10 overflow: scroll;
11 margin: 20px;
12 border: 1px solid black;
15 .composited {
16 width: 80px;
17 height: 10px;
18 position: relative;
19 top: 10px;
20 transform: translateZ(0);
21 background-color: green;
22 z-index: -1;
25 .not-composited {
26 width: 80px;
27 height: 20px;
28 margin: 5px;
29 background-color: blue;
31 </style>
32 <script>
33 if (window.testRunner)
34 window.testRunner.dumpAsText();
36 if (window.internals)
37 window.internals.settings.setPreferCompositingToLCDTextEnabled(true);
39 function write(str)
41 var pre = document.getElementById('console');
42 var text = document.createTextNode(str + '\n');
43 pre.appendChild(text);
46 function doTest()
48 write(window.internals.layerTreeAsText(document, window.internals.LAYER_TREE_INCLUDES_PAINTING_PHASES));
49 if (window.testRunner)
50 window.testRunner.notifyDone();
53 window.addEventListener('load', doTest, false);
55 if (window.testRunner)
56 window.testRunner.waitUntilDone();
57 </script>
58 </head>
59 <body>
60 <div class="container">
61 <div class="composited"></div>
62 <div class="not-composited"></div>
63 <div class="not-composited"></div>
64 <div class="not-composited"></div>
65 <div class="not-composited"></div>
66 <div class="not-composited"></div>
67 <div class="not-composited"></div>
68 <div class="not-composited"></div>
69 <div class="not-composited"></div>
70 <div class="not-composited"></div>
71 <div class="not-composited"></div>
72 <div class="not-composited"></div>
73 <div class="not-composited"></div>
74 <div class="not-composited"></div>
75 <div class="not-composited"></div>
76 <div class="not-composited"></div>
77 <div class="not-composited"></div>
78 <div class="not-composited"></div>
79 <div class="not-composited"></div>
80 <div class="not-composited"></div>
81 <div class="not-composited"></div>
82 <div class="not-composited"></div>
83 <div class="not-composited"></div>
84 <div class="not-composited"></div>
85 <div class="not-composited"></div>
86 <div class="not-composited"></div>
87 <div class="not-composited"></div>
88 <div class="not-composited"></div>
89 <div class="not-composited"></div>
90 </div>
91 <pre id="console"></pre>
92 </body>
93 </html>