third_party/WebKit/LayoutTests/fast/events/touch/gesture/touch-gesture-scroll-div.html

   1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
   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   position: relative;
  11   background: white;
  12 }
  13
  14 ::-webkit-scrollbar {
  15     width: 0px;
  16     height: 0px;
  17 }
  18
  19 #movingbox {
  20   width: 100%;
  21   height: 100%;
  22   position: absolute;
  23   word-wrap: break-word;
  24   overflow-y: scroll;
  25   overflow-x: scroll;
  26   display: block;
  27 }
  28
  29 #greenbox {
  30   width: 100px;
  31   height: 100px;
  32   background: green;
  33   padding: 0px;
  34   margin: 0px;
  35 }
  36
  37 #redbox {
  38   width: 100px;
  39   height: 100px;
  40   background: red;
  41   padding: 0px;
  42   margin: 0px;
  43 }
  44
  45 td {
  46   padding: 0px;
  47 }
  48 </style>
  49 </head>
  50 <body style="margin:0" onload="runTest();">
  51 <div id="touchtarget">
  52   <div id="movingbox">
  53     <table border="0" cellspacing="0px" id="tablefoo">
  54       <tr>
  55         <td><div id="redbox"></div></td>
  56         <td><div id="greenbox"></div></td>
  57       </tr>
  58       <tr>
  59         <td><div id="greenbox"></div></td>
  60         <td><div id="greenbox"></div></td>
  61       </tr>
  62     </table>
  63   </div>
  64 </div>
  65
  66 <p id="description"></p>
  67 <div id="console"></div>
  68 <script type="text/javascript">
  69
  70 var movingdiv;
  71 var expectedGesturesTotal = 2;
  72 var gesturesOccurred = 0;
  73 var scrollAmountX = ['90', '90'];
  74 var scrollAmountY = ['0', '95'];
  75 var wheelEventsOccurred = 0;
  76 var expectedWheelEventsOccurred = ['0', '0'];
  77 var scrollEventsOccurred = 0;
  78 var expectedScrollEventsOccurred = '1';
  79 var scrolledElement = 'movingdiv'
  80
  81 function firstGestureScroll()
  82 {
  83     debug("first gesture");
  84     eventSender.gestureScrollBegin(95, 12);
  85     eventSender.gestureScrollUpdate(-90, 0);
  86     eventSender.gestureScrollEnd(0, 0);
  87
  88     // Wait for layout.
  89     checkScrollOffset();
  90 }
  91
  92 function secondGestureScroll()
  93 {
  94     debug("second gesture");
  95     eventSender.gestureScrollBegin(12, 97);
  96     eventSender.gestureScrollUpdate(0, -95);
  97     eventSender.gestureScrollEnd(0, 0);
  98
  99     // Wait for layout.
 100     checkScrollOffset();
 101 }
 102
 103 if (window.testRunner)
 104     testRunner.waitUntilDone();
 105
 106 function runTest()
 107 {
 108     movingdiv = document.getElementById('movingbox');
 109     movingdiv.addEventListener("scroll", recordScroll);
 110     window.addEventListener("mousewheel", recordWheel);
 111
 112     if (window.eventSender) {
 113         description('This tests gesture event scrolling of an overflow div.');
 114
 115         if (checkTestDependencies())
 116             firstGestureScroll();
 117         else
 118             exitIfNecessary();
 119     } else {
 120         debug("This test requires DumpRenderTree.  Touch scroll the red rect to log.");
 121     }
 122 }
 123 </script>
 124 </body>
 125 </html>