LayoutTests/fast/events/drag-customData.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <style>
   5 #drag {
   6     border: 1px solid black;
   7     height: 200px;
   8     width: 200px;
   9 }
  10 #drop {
  11     border: 1px solid black;
  12     height: 200px;
  13     width: 200px;
  14 }
  15 </style>
  16 <script>
  17 function log(str)
  18 {
  19     var result = document.getElementById('result');
  20     result.appendChild(document.createTextNode(str));
  21     result.appendChild(document.createElement('br'));
  22 }
  23 function dragstart(event) {
  24     event.dataTransfer.setData('text', 'sample');
  25     event.dataTransfer.setData('custom-data', 'hello world');
  26 }
  27 function dragenter(event) {
  28     event.preventDefault();
  29 }
  30 function dragover(event) {
  31     event.preventDefault();
  32 }
  33 function drop(event) {
  34     var failed = false;
  35     if (event.dataTransfer.types.indexOf('text/plain') < 0
  36         || event.dataTransfer.types.indexOf('custom-data') < 0)
  37         failed = true;
  38     if (event.dataTransfer.getData('text') != 'sample'
  39         || event.dataTransfer.getData('custom-data') != 'hello world')
  40         failed = true;
  41     log(failed ? 'FAILURE' : 'SUCCESS');
  42     if (window.testRunner)
  43         testRunner.notifyDone();
  44 }
  45 window.onload = function()
  46 {
  47     if (!window.testRunner)
  48         return;
  49     testRunner.dumpAsText();
  50     testRunner.waitUntilDone();
  51
  52     var dragElement = document.getElementById('drag');
  53     eventSender.mouseMoveTo(dragElement.offsetLeft + dragElement.offsetWidth / 2,
  54                             dragElement.offsetTop + dragElement.offsetHeight / 2);
  55     eventSender.mouseDown();
  56     eventSender.leapForward(100);
  57     var dropElement = document.getElementById('drop');
  58     eventSender.mouseMoveTo(dropElement.offsetLeft + dropElement.offsetWidth / 2,
  59                             dropElement.offsetTop + dropElement.offsetHeight / 2);
  60     eventSender.mouseUp();
  61 }
  62 </script>
  63 </head>
  64 <body>
  65 <p>To manually test, drag 'Drag Me' to 'Drop Here' and drop. The word 'SUCCESS' should appear.
  66 <div draggable="true" id="drag" ondragstart="dragstart(event)">Drag Me</div>
  67 <div id="drop" ondragenter="dragenter(event)" ondragover="dragover(event)" ondrop="drop(event)">Drop Here</div>
  68 </div>
  69 <div id="result"></div>
  70 </body>
  71 </html>