third_party/WebKit/LayoutTests/fast/events/panScroll-panIcon.html

   1 <html>
   2 <head>
   3 <style type="text/css">
   4 #draggable {
   5   padding: 5pt;
   6   border: 3px solid #00cc00;
   7   background: #00cccc;
   8   width: 80px;
   9   cursor: hand;
  10 }
  11
  12 #scrollable {
  13     height: 200px;
  14     overflow: auto;
  15     border: solid 3px #cc0000;
  16     font-size: 80px;
  17 }
  18 </style>
  19 <script>
  20 function $(id) { return document.getElementById(id); }
  21 var MIDDLE_BUTTON = 1;
  22 var PAN_SCROLL_RADIUS = 15; // from FrameView::noPanScrollRadius
  23
  24 function setUpTest()
  25 {
  26     var scrollable = $('scrollable');
  27     for (var i = 0; i < 10; ++i) {
  28       var line = document.createElement('div');
  29       line.innerHTML = "line " + i;
  30       scrollable.appendChild(line);
  31     }
  32
  33     if (!window.eventSender)
  34         return;
  35
  36     // Start pan scroll by click
  37     eventSender.mouseMoveTo(scrollable.offsetLeft + 5, scrollable.offsetTop + 5);
  38     eventSender.mouseDown(MIDDLE_BUTTON);
  39     eventSender.mouseUp(MIDDLE_BUTTON);
  40
  41     // Stop pan scroll by click
  42     eventSender.mouseDown(MIDDLE_BUTTON);
  43     eventSender.mouseUp(MIDDLE_BUTTON);
  44 }
  45 </script>
  46 </head>
  47 <body>
  48 You should run this test in DRT.
  49 <br>
  50 For manual testing, hold middle button in scrollable and move aroudn mouse pointer for scrolling, then release middle button to stop scrolling.
  51 You won't see pan icon after pan scroll.
  52 <div id="container">
  53 Scrollable
  54 <div id="scrollable">
  55 </div>
  56 </div>
  57 <script>
  58 setUpTest();
  59 </script>
  60 </body>
  61 </html>