third_party/WebKit/LayoutTests/fast/events/only-valid-drop-targets-receive-file-drop.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <style>
   5 div, span {
   6     border: 1px solid black;
   7 };
   8 </style>
   9 <script>
  10 var dropReceived;
  11 var beforeUnloadReceived = false;
  12 function log(str)
  13 {
  14     var result = document.getElementById('result');
  15     result.appendChild(document.createTextNode(str));
  16     result.appendChild(document.createElement('br'));
  17 }
  18 function dragDrop(target)
  19 {
  20     log('Starting drag...');
  21     eventSender.beginDragWithFiles(['test']);
  22     eventSender.leapForward(100);
  23     eventSender.mouseMoveTo(target.offsetLeft + target.offsetWidth / 2,
  24                             target.offsetTop + target.offsetHeight / 2);
  25     eventSender.mouseUp();
  26 }
  27 window.onload = function()
  28 {
  29     var drop1 = document.getElementById('drop1');
  30     var drop2 = document.getElementById('drop2');
  31
  32     document.body.addEventListener('dragover', function () {
  33         dropReceived = false;
  34     }, false);
  35
  36     drop1.addEventListener('dragover', function(e) {
  37         e.preventDefault();
  38     }, false);
  39     drop1.addEventListener('drop', function(e) {
  40         e.preventDefault();
  41         dropReceived = true;
  42         log('Drop received in drop target 1');
  43     }, false);
  44
  45     drop2.addEventListener('dragover', function() {
  46     }, false);
  47     drop2.addEventListener('drop', function(e) {
  48         e.preventDefault();
  49         dropReceived = true;
  50         log('Drop received in drop target 2');
  51     }, false);
  52
  53     if (!window.testRunner)
  54         return;
  55     testRunner.dumpAsText();
  56     testRunner.waitUntilDone();
  57
  58     window.addEventListener('beforeunload', function (e) {
  59         if (!dropReceived)
  60             log('Drop not received');
  61         beforeUnloadReceived = true;
  62         e.preventDefault();
  63         testRunner.notifyDone();
  64     });
  65
  66     dragDrop(drop1);
  67     dragDrop(drop2);
  68     window.setTimeout(function () {
  69         // Deadman's switch to fail quickly.
  70         if (!beforeUnloadReceived)
  71             log('FAIL: navigation expected');
  72         testRunner.notifyDone();
  73     }, 0);
  74 }
  75 </script>
  76 </head>
  77 <body>
  78 <p>To run this test manually, drag a file to one of the two boxes below.
  79 <div id="drop1">Dropping in drop target 1 should result in a drop event.</div>
  80 <div id="drop2">Dropping in drop target 2 should NOT result in a drop event (page will navigate).</div>
  81 <div id="result">
  82 </div>
  83 </body>
  84 </html>