third_party/WebKit/LayoutTests/fast/events/touch/gesture/touch-gesture-noscroll-body-propagated.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <script src="../../../../resources/js-test.js"></script>
   5 <script src="resources/gesture-helpers.js"></script>
   6 <style type="text/css">
   7 #touchtarget {
   8   width: 100px;
   9   height: 100px;
  10   background: white;
  11   overflow:scroll;
  12 }
  13
  14 ::-webkit-scrollbar {
  15     width: 0px;
  16     height: 0px;
  17 }
  18
  19 #greenbox {
  20   width: 100px;
  21   height: 100px;
  22   background: green;
  23   padding: 0px;
  24   margin: 0px;
  25 }
  26
  27 #redbox {
  28   width: 100px;
  29   height: 100px;
  30   background: red;
  31   padding: 0px;
  32   margin: 0px;
  33 }
  34
  35 td {
  36   padding: 0px;
  37 }
  38 </style>
  39 </head>
  40 <body style="margin:0; overflow-y:hidden;" onload="runTest();">
  41
  42 <div id="touchtarget">
  43   <table border="0" cellspacing="0px" id="tablefoo">
  44     <tr>
  45       <td><div id="redbox"></div></td>
  46       <td><div id="greenbox"></div></td>
  47     </tr>
  48     <tr>
  49       <td><div id="greenbox"></div></td>
  50       <td><div id="greenbox"></div></td>
  51     </tr>
  52   </table>
  53 </div>
  54
  55 <table id="table_to_fill">
  56     <tr><td><div id="greenbox"></div></td></tr>
  57     <tr><td><div id="redbox"></div></td></tr>
  58 </table>
  59
  60 <p id="description"></p>
  61 <div id="console"></div>
  62 <script type="text/javascript">
  63
  64 var expectedGesturesTotal = 2;
  65 var gesturesOccurred = 0;
  66 var scrollAmountX = ['0', '0'];
  67 var scrollAmountY = ['0', '0'];
  68 var wheelEventsOccurred = 0;
  69 var expectedWheelEventsOccurred = ['0', '0'];
  70 var scrollEventsOccurred = 0;
  71 var expectedScrollEventsOccurred = '0';
  72 var scrolledElement = 'document.documentElement';
  73
  74 // Always construct a page larger than the vertical height of the window.
  75 function buildPage()
  76 {
  77     var table = document.getElementById('table_to_fill');
  78     var targetHeight = document.body.offsetHeight;
  79     var cellPairHeight = table.offsetHeight;
  80     var numberOfReps = targetHeight / cellPairHeight * 2;
  81     var i;
  82     for (i = 0; i < numberOfReps; i++) {
  83         var p = document.createElement('tr');
  84         p.innerHTML = '<td><div id="greenbox"></div></td>';
  85         table.appendChild(p);
  86         var p = document.createElement('tr');
  87         p.innerHTML = '<td><div id="redbox"></div></td>';
  88         table.appendChild(p);
  89     }
  90
  91     window.addEventListener("scroll", recordScroll);
  92     window.addEventListener("mousewheel", recordWheel);
  93 }
  94
  95 function firstGestureScroll()
  96 {
  97     debug("first gesture");
  98     eventSender.gestureScrollBegin(95, 12);
  99     eventSender.gestureScrollUpdate(0, -100);
 100     eventSender.gestureScrollUpdate(0, -10);
 101     eventSender.gestureScrollEnd(0, 0);
 102
 103     // Wait for layout.
 104     checkScrollOffset();
 105 }
 106
 107 function secondGestureScroll()
 108 {
 109     debug("second gesture");
 110     eventSender.gestureScrollBegin(12, 97);
 111     eventSender.gestureScrollUpdate(0, -95);
 112     eventSender.gestureScrollUpdate(0, -200);
 113     eventSender.gestureScrollEnd(0, 0);
 114
 115     // Wait for layout.
 116     checkScrollOffset();
 117
 118     // In this test we do not expect any scroll events to
 119     // be received by the event listener, so we signal
 120     // the end of the test by calling this function instead
 121     // of relying on recordScroll() to do it.
 122     finishTest();
 123 }
 124
 125 window.jsTestIsAsync = true;
 126 if (window.testRunner)
 127     testRunner.waitUntilDone();
 128
 129 function runTest()
 130 {
 131     buildPage();
 132     if (window.eventSender) {
 133         description('This tests that a page cannot be scrolled vertically with touch if its body has style overflow-y:hidden ' +
 134                     'and the scroll event is propogated from a scrollable child div.');
 135
 136         if (checkTestDependencies())
 137             firstGestureScroll();
 138         else
 139             exitIfNecessary();
 140     } else {
 141         debug("This test requires DumpRenderTree.  Touch scroll the red rect to log.");
 142     }
 143 }
 144
 145 function finishTest()
 146 {
 147     if (window.eventSender) {
 148         if (gesturesOccurred == expectedGesturesTotal) {
 149             shouldBe('scrollEventsOccurred', expectedScrollEventsOccurred);
 150             successfullyParsed = true;
 151             finishJSTest();
 152         }
 153     }
 154 }
 155 </script>
 156 </body>
 157 </html>