third_party/WebKit/LayoutTests/fast/events/touch/gesture/touch-gesture-scroll-div-propagated-diagonally.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
   8 ::-webkit-scrollbar {
   9     width: 0px;
  10     height: 0px;
  11 }
  12
  13 #contents {
  14   width:500px;
  15   height:150px;
  16   border-right:700px solid black;
  17   background:red;
  18 }
  19
  20 #horizontal {
  21   width:600px;
  22   height:600px;
  23   overflow:scroll;
  24   background:green;
  25 }
  26
  27 #vertical {
  28   height:300px;
  29   overflow:scroll;
  30 }
  31
  32 </style>
  33 </head>
  34 <body style="margin:0" onload="runTest();">
  35
  36 <div id="vertical">
  37   <div id="horizontal">
  38     <div id="contents"></div>
  39   </div>
  40 </div>
  41
  42 <p id="description"></p>
  43 <div id="console"></div>
  44 <script type="text/javascript">
  45
  46 if (window.testRunner)
  47     testRunner.waitUntilDone();
  48
  49 function runTest()
  50 {
  51     if (window.eventSender) {
  52         description('This tests that a gesture scroll is propagated from an ' +
  53                 'inner div to an outer div when the inner div has ' +
  54                 'remaining scroll offset on one axis, but not on the other.');
  55         if (checkTestDependencies()) {
  56             eventSender.gestureScrollBegin(10, 10);
  57             eventSender.gestureScrollUpdate(-15, -20);
  58             eventSender.gestureScrollEnd(0, 0);
  59             shouldBe("horizontal.scrollLeft", "15");
  60             shouldBe("vertical.scrollTop", "20");
  61             if (window.testRunner)
  62               testRunner.notifyDone();
  63         } else {
  64             exitIfNecessary();
  65         }
  66     } else {
  67         debug("This test requires DumpRenderTree.  Gesture-scroll the page diagonally to validate the implementation.");
  68     }
  69 }
  70 </script>
  71
  72 </body>
  73 </html>