third_party/WebKit/LayoutTests/compositing/rtl/rtl-absolute-overflow-scrolled.html

   1 <html>
   2 <head>
   3 <style>
   4     body {
   5         direction: rtl;
   6         margin: 0px;
   7         background-color: red;
   8     }
   9
  10     .positioned {
  11         position: absolute;
  12         top: 50px;
  13         left: 50px;
  14         width: 100px;
  15         height: 100px;
  16     }
  17
  18     #indicator {
  19         background-color: red;
  20     }
  21
  22     #layer {
  23         transform:translateZ(0);
  24         background-color: green;
  25     }
  26
  27     #root {
  28         width: 1000px;
  29         height: 1000px;
  30         background-color: white;
  31     }
  32
  33     #layertree {
  34         position: absolute;
  35         top: 10000px;
  36         left: 0px;
  37     }
  38 </style>
  39 <script>
  40     function doTest() {
  41         if (window.testRunner) {
  42             testRunner.waitUntilDone();
  43             testRunner.dumpAsTextWithPixelResults();
  44         }
  45
  46         // The far left coordinate of the document varies by window width.
  47         var offset = document.body.clientWidth - document.scrollingElement.scrollWidth + 1;
  48         document.getElementById('layer').style.left = offset + 50;
  49         document.getElementById('indicator').style.left = offset + 50;
  50
  51         window.setTimeout(function() {
  52             window.scrollTo(offset, 0);
  53             if (window.testRunner) {
  54                 if (top == self)
  55                     document.getElementById('layertree').innerText = window.internals.layerTreeAsText(document);
  56                 testRunner.notifyDone();
  57             }
  58         }, 0);
  59     }
  60     window.addEventListener('load', doTest, false);
  61 </script>
  62 <body>
  63     <div id="root"></div>
  64     <div class="positioned" id="indicator"></div>
  65     <div class="positioned" id="layer"></div>
  66
  67     <pre id="layertree"></pre>
  68 </body>
  69 </html>