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

   1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
   2 <html>
   3 <head>
   4 <script src="../../../../resources/js-test.js"></script>
   5 <style type="text/css">
   6 #gesturetarget {
   7   width: 100px;
   8   height: 100px;
   9   position: relative;
  10   background: white;
  11 }
  12
  13 ::-webkit-scrollbar {
  14     width: 0px;
  15     height: 0px;
  16 }
  17
  18 #movingbox {
  19   width: 100%;
  20   height: 100%;
  21   position: absolute;
  22   word-wrap: break-word;
  23   overflow-y: scroll;
  24   overflow-x: scroll;
  25   display: block;
  26 }
  27
  28 #greenbox {
  29   width: 100px;
  30   height: 100px;
  31   background: green;
  32   padding: 0px;
  33   margin: 0px;
  34 }
  35
  36 #redbox {
  37   width: 100px;
  38   height: 100px;
  39   background: red;
  40   padding: 0px;
  41   margin: 0px;
  42 }
  43
  44 td {
  45   padding: 0px;
  46 }
  47 </style>
  48 </head>
  49 <body style="margin:0" onload="runTest();">
  50 <div id="gesturetarget">
  51   <div id="movingbox">
  52     <table border="0" cellspacing="0px">
  53       <tr>
  54         <td><div id="redbox"></div></td>
  55         <td><div id="greenbox"></div></td>
  56       </tr>
  57       <tr>
  58         <td><div id="greenbox"></div></td>
  59         <td><div id="greenbox"></div></td>
  60       </tr>
  61     </table>
  62   </div>
  63 </div>
  64
  65 <p id="description"></p>
  66 <div id="console"></div>
  67 <script type="text/javascript">
  68
  69 var movingdiv;
  70 var expectedScrollsTotal = 2;
  71 var scrollsOccurred = 0;
  72 var scrollAmountX = ['90', '90'];
  73 var scrollAmountY = ['0', '95'];
  74
  75 function checkScrollOffset()
  76 {
  77     movingdiv = document.getElementById('movingbox');
  78     if (window.eventSender) {
  79         shouldBe('movingdiv.scrollTop', scrollAmountY[scrollsOccurred]);
  80         shouldBe('movingdiv.scrollLeft', scrollAmountX[scrollsOccurred]);
  81         scrollsOccurred++;
  82     }
  83
  84     if (scrollsOccurred == expectedScrollsTotal) {
  85         // If we've got here, we've passed.
  86         isSuccessfullyParsed();
  87         if (window.testRunner)
  88             testRunner.notifyDone();
  89     } else {
  90         secondGestureScrollSequence();
  91     }
  92 }
  93
  94 function firstGestureScrollSequence()
  95 {
  96     debug("first gesture");
  97
  98     eventSender.gestureScrollBegin(95, 12);
  99     eventSender.gestureScrollUpdate(-90, 0);
 100     eventSender.gestureScrollEnd(0, 0);
 101
 102     // Wait for layout.
 103     checkScrollOffset();
 104 }
 105
 106 function secondGestureScrollSequence()
 107 {
 108     debug("second gesture");
 109
 110     eventSender.gestureScrollBegin(12, 97);
 111     eventSender.gestureScrollUpdate(0, -95);
 112     eventSender.gestureScrollEnd(0, 0);
 113
 114     // Wait for layout.
 115     checkScrollOffset();
 116 }
 117
 118 function exitIfNecessary()
 119 {
 120     debug('Gesture events not implemented on this platform or broken');
 121     isSuccessfullyParsed();
 122     if (window.testRunner)
 123         testRunner.notifyDone();
 124 }
 125
 126 if (window.testRunner)
 127     testRunner.waitUntilDone();
 128
 129 function runTest()
 130 {
 131     var movingdiv = document.getElementById('movingbox');
 132
 133     if (window.eventSender) {
 134         description('This tests scroll gesture events. ' +
 135             'Square is (mostly) green on pass');
 136
 137         if (eventSender.clearTouchPoints)
 138             firstGestureScrollSequence();
 139         else
 140             exitIfNecessary();
 141     } else {
 142         debug("This test requires DumpRenderTree.");
 143     }
 144 }
 145 </script>
 146 </body>
 147 </html>