Tapping after CSS-based table casues an infinite loop in wordRangeFromPosition
[WebKit-https.git] / LayoutTests / compositing / layers-inside-overflow-scroll.html
1 <!DOCTYPE html>
2 <html>
3   <head>
4     <title>Layers inside overflow-scroll</title>
5
6     <style type="text/css" media="screen">
7
8     #container {
9       width: 300px;
10       margin: 10px;
11       border: 1px solid black;
12     }
13     
14     #details {
15      width: 300px;
16      height: 150px;
17      margin: 10px;
18      overflow: auto;
19      border: 1px solid black;
20     }
21
22     #details > div {
23       width: 100%;
24       height: 500px;
25       font-size: 24pt;
26       line-height: 150%;
27     }
28     
29     .compositing {
30       height: 100px;
31       width: 100px;
32       background-color: red;
33       -webkit-transform: translateZ(0);
34     }
35     </style>
36     <script src="resources/media-testing.js"></script>
37     <script src="../media/media-file.js"></script>
38
39     <script type="text/javascript" charset="utf-8">
40       function testDone()
41       {
42         if (window.testRunner)
43           testRunner.notifyDone();
44       }
45       
46       function modifyDocument()
47       {
48           document.getElementById('details').scrollTop = 100;
49       }
50       
51       function doTest()
52       {
53           var video = document.getElementsByTagName('video')[0];
54           setupVideo(video, 'resources/video', modifyDocument, testDone);
55       }
56     </script>
57   </head>
58   <body onload="doTest()">
59       <p>The red box in the overflow:scroll div should be scrolled out of view.</p>
60         <div id="container">
61           <video width="300" height="200"></video>
62         </div>
63
64         <div id="details">
65             <div>
66               <div class="compositing"></div>
67             </div>
68         </div>
69
70   </body>
71 </html>