src/third_party/WebKit/LayoutTests/fast/events/drag-and-drop-autoscroll-inner-frame.html

   1 <!DOCTYPE html>
   2 <head>
   3 <style type="text/css">
   4 #scrollable {
   5     height: 200px;
   6     overflow: auto;
   7     border: solid 3px #cc0000;
   8     font-size: 80px;
   9 }
  10 </style>
  11 <script>
  12
  13 var x, y, middleTermScrollOffset;
  14 var iframe, iframeDocument, draggable;
  15
  16 function log(msg)
  17 {
  18     document.getElementById('console').appendChild(document.createTextNode(msg + '\n'));
  19 }
  20
  21 function setUpTest()
  22 {
  23     if (!window.eventSender) {
  24         log('Please run within DumpRenderTree');
  25         return;
  26     }
  27
  28     window.jsTestIsAsync = true;
  29     setTimeout(testIt, 0);
  30 }
  31
  32 function testIt()
  33 {
  34     eventSender.dragMode = false;
  35
  36     iframe = document.getElementById('scrollable');
  37     iframeDocument = iframe.contentDocument;
  38     draggable = iframeDocument.getElementById('draggable');
  39
  40     iframeDocument.addEventListener("scroll", recordScroll);
  41
  42     // Grab draggable.
  43     x = iframe.offsetLeft + draggable.offsetLeft + 7;
  44     y = iframe.offsetTop + draggable.offsetTop + 7;
  45
  46     eventSender.mouseMoveTo(x, y);
  47     eventSender.mouseDown();
  48
  49     // Move mouse to the bottom autoscroll border belt.
  50     y = iframe.offsetTop + iframe.offsetHeight - 10;
  51     eventSender.mouseMoveTo(x, y);
  52 }
  53
  54 function recordScroll(e)
  55 {
  56     autoscrollTestPart1();
  57     iframeDocument.removeEventListener("scroll", recordScroll);
  58 }
  59
  60 function recordScroll2(e)
  61 {
  62     autoscrollTestPart2();
  63     iframeDocument.removeEventListener("scroll", recordScroll);
  64 }
  65
  66 function autoscrollTestPart1()
  67 {
  68     if (iframe.contentDocument.body.scrollTop == 0) {
  69         testFailed("Autoscroll should have scrolled the iframe downwards, but did not");
  70         finishTest();
  71         return;
  72     }
  73
  74     testPassed("Autoscroll should have scrolled the iframe downwards, and did.");
  75
  76     middleTermScrollOffset = iframe.contentDocument.body.scrollTop;
  77     iframeDocument.addEventListener("scroll", recordScroll2);
  78
  79     // Move mouse to the upper autoscroll border belt.
  80     y = iframe.offsetTop + 10;
  81     eventSender.mouseMoveTo(x, y);
  82 }
  83
  84 function autoscrollTestPart2()
  85 {
  86     shouldBeTrue("iframe.contentDocument.body.scrollTop < middleTermScrollOffset")
  87     finishTest();
  88 }
  89
  90 function finishTest()
  91 {
  92     eventSender.mouseUp();
  93     finishJSTest();
  94 }
  95
  96 var successfullyParsed = true;
  97 </script>
  98 </head>
  99 <body>
 100 For manual testing, drag and drop "Drop Me" downwards and then upwards.
 101 <iframe id="scrollable" src="data:text/html,
 102 <p id='draggable' draggable='true' style='cursor: hand;'>
 103     <b>Drag me!</b>
 104 </p>
 105 Try to drag and drop the text above in the input element at the bottom of this iframe. It should scroll. Then, try the way back.
 106 <br><br>more<br>more<br>more<br>more<br>more<br>more<br>more<br>more<br>more<br>more<br>more<br>more<br><input>
 107 "></iframe><br>
 108 </div>
 109 <div id="console"></div>
 110 <script src="../../resources/js-test.js"></script>
 111 <script>
 112 description('Check autoscroll within an inner frame by drag-and-drop');
 113 setUpTest();
 114 </script>
 115 </body>
 116 </html>