src/third_party/WebKit/LayoutTests/compositing/overflow/accelerated-overflow-scroll-should-not-affect-perspective.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <style>
   5     .container {
   6         width: 200px;
   7         height: 200px;
   8         position: absolute;
   9         overflow: scroll;
  10         -webkit-perspective: 100px;
  11         -webkit-transform-style: preserve-3d;
  12     }
  13
  14     .child {
  15         position: absolute;
  16         top: 65px;
  17         width: 60px;
  18         height: 200px;
  19     }
  20
  21     .first {
  22         left: 0px;
  23         background-color: green;
  24         transform: translateZ(10px);
  25     }
  26
  27     .second {
  28         left: 65px;
  29         background-color: blue;
  30         transform: translateZ(20px);
  31     }
  32 </style>
  33 <script>
  34     if (window.testRunner)
  35         testRunner.dumpAsText();
  36
  37     if (window.internals) {
  38         window.internals.settings.setPreferCompositingToLCDTextEnabled(true);
  39     }
  40
  41     function runTest() {
  42         var pre = document.createElement('pre');
  43         if (!window.internals) {
  44             var description = "This test ensures that the accelerated overflow "
  45                 + "scrolling machinery is not invoked for the body element.";
  46             pre.innerHTML = description;
  47         } else {
  48             document.body.offsetTop;
  49             pre.innerHTML = internals.layerTreeAsText(document);
  50         }
  51         document.body.appendChild(pre);
  52     }
  53     window.onload = runTest;
  54 </script>
  55 </head>
  56 <body>
  57   <div class="container">
  58     <div class="child first"> </div>
  59     <div class="child second"> </div>
  60   </div>
  61 </body>
  62 </html>