LayoutTests/fast/events/drag-image-filename.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <script>
   5 function runTest() {
   6     if (window.testRunner) {
   7         testRunner.dumpAsText();
   8         testRunner.waitUntilDone();
   9     } else
  10         return;
  11
  12     e = document.getElementById("source");
  13     x = e.offsetLeft + e.offsetWidth / 2;
  14     y = e.offsetTop + e.offsetHeight / 2;
  15
  16     eventSender.mouseMoveTo(x, y);
  17     eventSender.mouseDown();
  18     e = document.getElementById("target");
  19     x = e.offsetLeft + e.offsetWidth / 2;
  20     y = e.offsetTop + e.offsetHeight / 2;
  21
  22     eventSender.mouseMoveTo(x, y);
  23     eventSender.mouseUp();
  24 }
  25
  26 function dragEnterOrOver(event) {
  27     event.dataTransfer.dropEffect = "copy";
  28     event.preventDefault();
  29 }
  30
  31 function drop(event) {
  32     event.preventDefault();
  33     eventSender.dumpFilenameBeingDragged();
  34     testRunner.notifyDone();
  35 }
  36 </script>
  37 <style>
  38 #target {
  39     height: 100px;
  40     width: 100px;
  41 }
  42 </style>
  43 </head>
  44
  45 <body onload="runTest()">
  46
  47 <p>This test requires DumpRenderTree. To test manually, drag the image to the desktop. It should receive the name "onload-image.png".
  48
  49 <div id="target" ondragenter="dragEnterOrOver(event)" ondragover="dragEnterOrOver(event)" ondrop="drop(event)"></div>
  50 <img id="source" src="resources/onload-image.png" alt="Does it work?">
  51
  52 </body>
  53 </html>