third_party/WebKit/LayoutTests/fast/events/touch/compositor-touch-hit-rects-many.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <link rel="stylesheet" href="resources/compositor-touch-hit-rects.css">
   5 <style>
   6 #layer {
   7   transform: translateZ(0);
   8 }
   9 #manychildren {
  10   height: 10px;
  11 }
  12 .child:first-child {
  13   margin-top: 20px;
  14 }
  15 .child {
  16   height: 5px;
  17   width: 5px;
  18   margin: 5px;
  19   margin-left: 300px;
  20 }
  21 </style>
  22 </head>
  23 <body>
  24 <p id="description">
  25 Tests that there is an upper limit on the number of hit rects generated per layer.  http://crbug.com/299177.
  26 </p>
  27
  28 <div id="tests">
  29   <div id="layer">
  30     <div id="manychildren" class="testcase">
  31       <div class="child"></div>
  32     </div>
  33   </div>
  34 </div>
  35
  36 <div id="console"></div>
  37 <script src="resources/compositor-touch-hit-rects.js"></script>
  38 <script>
  39
  40 const kMaxRects = 100;
  41 const kFixedRects = 1;
  42
  43 function verifyRectCount(expectedRects) {
  44   var rects = window.internals.touchEventTargetLayerRects(document);
  45   log('Test node has ' + document.querySelectorAll('.child').length + ' children with ' + rects.length + ' rects');
  46   if (rects.length != expectedRects) {
  47     log('FAIL - got ' + rects.length + ' rects, expected ' + expectedRects + '.');
  48   }
  49 }
  50
  51 preRunHandlerForTest['manychildren'] = function(e) {
  52   var template = document.querySelector('.child');
  53   for( var i = 0; i < kMaxRects - kFixedRects - 1; i++) {
  54     template.parentElement.appendChild(template.cloneNode());
  55   }
  56
  57   // Make sure the test is working properly.
  58   verifyRectCount(kMaxRects);
  59
  60   // Now push us over the limit.
  61   template.parentElement.appendChild(template.cloneNode());
  62   verifyRectCount(1);
  63
  64   // Verify that any additional rects get subsumed.
  65   template.parentElement.appendChild(template.cloneNode());
  66   verifyRectCount(1);
  67 };
  68
  69 </script>
  70 </body>