Implement backing-sharing in compositing layers, allowing overlap layers to paint...
[WebKit-https.git] / LayoutTests / compositing / shared-backing / overflow-scroll / scrolled-contents-unconstrained-clip.html
1 <!DOCTYPE html> <!-- webkit-test-runner [ internal:AsyncOverflowScrollingEnabled=true ] -->
2 <html>
3 <head>
4     <style>
5         .scroller {
6             overflow: scroll;
7             width: 300px;
8             height: 300px;
9             border: 2px solid black;
10         }
11         
12         .relative {
13             position: relative;
14             margin: 200px 20px 0 10px;
15             padding: 10px;
16             height: 100px;
17             border: 4px solid green;
18             background-color: silver;
19         }
20         
21         .spacer {
22             height: 400px;
23         }
24
25         .scrollbar-hider {
26             position: absolute;
27             width: 16px;
28             height: 300px;
29             top: 10px;
30             left: calc(310px - 16px);
31             background-color: gray;
32         }
33     </style>
34     <script>
35         if (window.testRunner)
36             testRunner.waitUntilDone();
37
38         window.addEventListener('load', () => {
39             setTimeout(() => {
40                 document.getElementById('scroller').scrollTop = 200;
41                 if (window.testRunner)
42                     testRunner.notifyDone();
43             }, 0);
44         }, false);
45     </script>
46 </head>
47 <body>
48     <div id="scroller" class="scroller">
49             <div class="relative">
50                 Relative foreground
51             </div>
52             <div class="spacer"></div>
53         </div>
54     </div>
55     <div class="scrollbar-hider"></div>
56 </body>
57 </html>