| <!DOCTYPE html> |
| <html> |
| <head> |
| <style> |
| #draggableContainer { |
| -webkit-user-drag: element; |
| } |
| #draggableContainer img { |
| -webkit-user-drag: none; |
| } |
| #drop { |
| border: 1px solid black; |
| height: 200px; |
| width: 200px; |
| } |
| </style> |
| <script> |
| function runTest() { |
| var drag = document.getElementById('drag'); |
| var drop = document.getElementById('drop'); |
| |
| drop.addEventListener('dragenter', onDragEnterOrOver); |
| drop.addEventListener('dragover', onDragEnterOrOver); |
| drop.addEventListener('drop', onDrop); |
| |
| if (!window.testRunner) |
| return; |
| |
| testRunner.dumpAsText(); |
| testRunner.waitUntilDone(); |
| |
| var x; |
| var y; |
| |
| x = drag.offsetLeft + drag.offsetWidth / 2; |
| y = drag.offsetTop + drag.offsetHeight / 2; |
| eventSender.mouseMoveTo(x, y); |
| eventSender.mouseDown(); |
| eventSender.leapForward(500); |
| x = drop.offsetLeft + drop.offsetWidth / 2; |
| y = drop.offsetTop + drop.offsetHeight / 2; |
| eventSender.mouseMoveTo(x, y); |
| eventSender.mouseUp(); |
| } |
| |
| function onDragEnterOrOver(e) { |
| e.preventDefault(); |
| } |
| |
| function onDrop() { |
| var console = document.getElementById('console'); |
| console.appendChild(document.createTextNode('PASS')); |
| console.appendChild(document.createElement('br')); |
| |
| if (window.testRunner) |
| testRunner.notifyDone(); |
| } |
| </script> |
| </head> |
| <body onload="runTest()"> |
| <p>This test verifies that starting a drag on an image inside a |
| -webkit-user-drag: element container succeeds. To run this test manually, |
| try dragging the image to the box below. You should see the word "PASS" |
| appear if it succeeds.</p> |
| <div id="draggableContainer"> |
| <img id="drag" src="resources/apple.gif"> |
| </div> |
| <div id="drop"></div> |
| <div id="console"></div> |
| </body> |
| </html> |
