third_party/WebKit/LayoutTests/editing/selection/drag-start-event-client-x-y.html

   1 <html>
   2     <head>
   3         <title>Test for WebKit bug 26723: clientX,Y , screenX , Y always (0, 0) in dragstart event</title>
   4         <style type="text/css">
   5             #draggable {
   6                 background-color: #ccc;
   7                 border: 1px solid #333;
   8                 width: 200px;
   9                 text-align: center;
  10                 margin: 10px;
  11                 -webkit-user-drag: element;
  12                 -webkit-user-select: none;
  13             }
  14
  15             .fail {
  16                 color: red;
  17             }
  18
  19             .success {
  20                 color: green;
  21             }
  22         </style>
  23
  24         <script type="text/javascript">
  25
  26         Function.prototype.bind = function(thisObject) {
  27             var func = this;
  28             var args = Array.prototype.slice.call(arguments, 1);
  29             return function() { return func.apply(thisObject, args.concat(Array.prototype.slice.call(arguments, 0))) };
  30         }
  31
  32         function shouldBe(resultElement, name, expected, actual) {
  33             var msg = document.createElement('p');
  34             if (Math.abs(expected - actual) < 1) {
  35                 msg.innerHTML = "<span class='success'>SUCCESS</span> Expected " + expected + " for " + name + " and got it.";
  36             } else {
  37                 msg.innerHTML = "<span class='fail'>FAIL</span> Expected " + expected + " for " + name + " but got " + actual + ".";
  38             }
  39             resultElement.appendChild(msg);
  40         }
  41
  42         var Test = {
  43
  44             dragStartHandler: function(dragStart, dragDistance) {
  45                 var resultElement = document.getElementById("result");
  46                 shouldBe(resultElement, "clientX", dragStart.x, event.clientX);
  47                 shouldBe(resultElement, "clientY", dragStart.y, event.clientY);
  48                 shouldBe(resultElement, "pageX", dragStart.x, event.pageX);
  49                 shouldBe(resultElement, "pageY", dragStart.y, event.pageY);
  50             },
  51
  52             runTest: function() {
  53                 if (!window.eventSender)
  54                     return;
  55
  56                 if (window.testRunner)
  57                     testRunner.dumpAsText();
  58
  59                 var element = document.getElementById("draggable");
  60                 var dragStart = { x: element.offsetLeft + element.offsetWidth / 2, y:  element.offsetTop + 1.0 };
  61                 var dragDistance = 10.0;
  62                 element.ondragstart = this.dragStartHandler.bind(this, dragStart, dragDistance);
  63
  64                 eventSender.mouseMoveTo(dragStart.x, dragStart.y);
  65                 eventSender.mouseDown();
  66                 eventSender.mouseMoveTo(dragStart.x + dragDistance, dragStart.y + dragDistance);
  67                 eventSender.mouseUp();
  68              }
  69
  70         }
  71         </script>
  72     </head>
  73     <body onload="Test.runTest()">
  74         <h3>Test for <a href='https://bugs.webkit.org/show_bug.cgi?id=26723'>WebKit bug 26723</a>: clientX,Y , screenX , Y always (0, 0) in dragstart event</h3>
  75         <div id="draggable" class="test">
  76             DRAG ME!
  77         </div>
  78         <div id="result"></div>
  79     </body>
  80 </html>