third_party/WebKit/LayoutTests/editing/selection/drag-selection-nodes.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <script>
   5 function log(s)
   6 {
   7     document.getElementById('console')
   8         .appendChild(document.createElement('div'))
   9         .appendChild(document.createTextNode(s));
  10 }
  11
  12 function onDragStart1(e)
  13 {
  14     if (e.target.parentNode.id == 'drag1'
  15         && e.target.nodeType == Node.TEXT_NODE)
  16         log('Test 1: PASS');
  17     else
  18         log('Test 1: FAIL: target element was ' + e.target);
  19 }
  20
  21 function onDragStart2(e)
  22 {
  23     if (e.target.id == 'drag2')
  24         log('Test 2: PASS');
  25     else
  26         log('Test 2: FAIL: target element was ' + e.target);
  27 }
  28
  29 function onDragStart3(e)
  30 {
  31     if (e.target.id == 'dragImage')
  32         log('Test 3: PASS');
  33     else
  34         log('Test 3: FAIL: target element was ' + e.target);
  35 }
  36
  37 function dragAndDrop(n)
  38 {
  39     var startX = n.offsetLeft + n.offsetWidth / 2;
  40     var startY = n.offsetTop + n.offsetHeight / 2;
  41     eventSender.mouseMoveTo(startX, startY);
  42     eventSender.mouseDown();
  43     eventSender.leapForward(200);
  44     eventSender.mouseMoveTo(startX + 400, startY);
  45     eventSender.mouseUp();
  46 }
  47
  48 function runTest()
  49 {
  50     var drag1 = document.getElementById('drag1');
  51     var drag2 = document.getElementById('drag2');
  52     var drag3 = document.getElementById('drag3');
  53
  54     drag1.addEventListener('dragstart', onDragStart1);
  55     drag2.addEventListener('dragstart', onDragStart2);
  56     drag3.addEventListener('dragstart', onDragStart3);
  57
  58     if (!window.testRunner)
  59         return;
  60     testRunner.dumpAsText();
  61
  62     var s = window.getSelection();
  63     var r;
  64
  65     s.removeAllRanges();
  66     r = document.createRange();
  67     r.selectNode(drag1);
  68     s.addRange(r);
  69     dragAndDrop(drag1);
  70
  71     s.removeAllRanges();
  72     drag2.focus();
  73     drag2.select();
  74     dragAndDrop(drag2);
  75
  76     s.removeAllRanges();
  77     r = document.createRange();
  78     r.selectNode(drag3);
  79     dragAndDrop(document.getElementById('dragImage'));
  80 }
  81 </script>
  82 </head>
  83 <body onload="runTest()">
  84 <p>Simple test that dragging and dropping a selection targets the right node.
  85 <div id="drag1">Test 1: select this line and drag me.</div>
  86 <p>Test 2: <input id="drag2" type="text" value="Select the text in this input and drag me"></input>
  87 <div id="drag3">Test 3: select this line and <img id="dragImage" src="../resources/abe.png"> drag me from the image.</div>
  88 <div id="console"></div>
  89 </body>
  90 </html>