third_party/WebKit/LayoutTests/compositing/overflow/overflow-scroll-with-pointer-events-toggle.html

   1 <!DOCTYPE html>
   2 <style>
   3 .composited {
   4   transform: translateZ(0);
   5 }
   6 .scroller {
   7   width: 300px;
   8   height: 300px;
   9   overflow: scroll;
  10 }
  11 .scroller > div {
  12   height: 1000px;
  13   width: 1000px;
  14   background-color: green;
  15 }
  16 </style>
  17
  18 <div id='scroller' class='composited scroller' style='pointer-events: none;'>
  19   <div>It should be possible to scroll this div.</div>
  20 </div>
  21
  22 <script src='../../resources/js-test.js'></script>
  23 <script src='../../resources/run-after-layout-and-paint.js'></script>
  24
  25 <script type='text/javascript'>
  26 jsTestIsAsync = true;
  27 description('Verifies that toggling pointer-events correctly updates scrolling ' +
  28             'layers in compositor.');
  29
  30 if (window.internals)
  31   internals.settings.setPreferCompositingToLCDTextEnabled(true);
  32
  33 function isUsingCompositedScrolling(layer) {
  34   if (layer.bounds[1] == 1000)
  35     return true;
  36   if (layer.children) {
  37     for (var i = 0; i < layer.children.length; i++) {
  38       if (isUsingCompositedScrolling(layer.children[i]))
  39         return true;
  40     }
  41   }
  42   return false;
  43 }
  44
  45 onload = function() {
  46   documentLayerTree = JSON.parse(window.internals.layerTreeAsText(document));
  47   shouldBe('isUsingCompositedScrolling(documentLayerTree)', 'false');
  48
  49   // removing 'pointer-events: none' should cause composited scrolling
  50   document.getElementById('scroller').style.pointerEvents = '';
  51   runAfterLayoutAndPaint(function() {
  52     documentLayerTree = JSON.parse(window.internals.layerTreeAsText(document));
  53     shouldBe('isUsingCompositedScrolling(documentLayerTree)', 'true');
  54     finishJSTest();
  55   });
  56 };
  57 </script>