third_party/WebKit/LayoutTests/compositing/scrollbars/nested-overlay-scrollbars.html

   1 <!DOCTYPE HTML>
   2 <style>
   3 #outer {
   4     position: absolute;
   5     z-index: 0;
   6     width: 400px;
   7     height: 400px;
   8     border: 2px solid black;
   9     overflow: scroll;
  10 }
  11
  12 #inner {
  13     top: 500px;
  14     width: 200px;
  15     height: 200px;
  16     border: 2px solid black;
  17     overflow-y: scroll;
  18     position: absolute;
  19 }
  20
  21 #scrolled {
  22     width: 2000px;
  23     height: 9000px;
  24     color: papayawhip;
  25 }
  26
  27 #grey {
  28     position: absolute;
  29     background: grey;
  30     width: 100px;
  31     height: 800px;
  32 }
  33
  34 #spacer {
  35     width: 5000px;
  36     height: 1000px;
  37     position: absolute;
  38     top: 2000px;
  39 }
  40 </style>
  41 <script>
  42 if (window.internals) {
  43     window.internals.settings.setOverlayScrollbarsEnabled(true);
  44     window.internals.settings.setPreferCompositingToLCDTextEnabled(true);
  45 }
  46
  47 if (window.testRunner)
  48     window.testRunner.dumpAsTextWithPixelResults();
  49
  50 onload = function() {
  51     document.getElementById("outer").scrollTop = 600;
  52     if (window.internals && window.testRunner)
  53         window.testRunner.setCustomTextOutput(window.internals.layerTreeAsText(document));
  54 };
  55 </script>
  56 <div id="outer">
  57   <div id="inner">
  58     <div id="scrolled">
  59     <div id="grey"></div>
  60   </div>
  61   <div id="spacer"></div>
  62 </div>