| <!DOCTYPE html> |
| <style> |
| #image { |
| width: 200px; |
| height: 200px; |
| image-rendering: pixelated; |
| } |
| </style> |
| <body> |
| <!-- Simulate dragging an image and dump the generated drag image. --> |
| <img id="image" src="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 100 100'><rect width='100%' height='100%' fill='white'/><circle cx='50' cy='50' r='25' fill='green'/></svg>"> |
| </body> |
| <script> |
| function drag() { |
| testRunner.dumpDragImage(); |
| |
| var bbox = document.getElementById('image').getBoundingClientRect(); |
| var startX = bbox.left + bbox.width / 2; |
| var startY = bbox.top + bbox.height / 2; |
| var destX = bbox.right; |
| var destY = bbox.bottom; |
| |
| eventSender.dragMode = true; |
| eventSender.mouseMoveTo(startX, startY); |
| eventSender.mouseDown(); |
| eventSender.mouseMoveTo(destX, destY); |
| eventSender.mouseUp(); |
| } |
| |
| if (!window.testRunner || !window.eventSender) { |
| document.write("<p>Click the green circle and drag.</p>"); |
| document.write("<p>The test passes if the drag image is hi-res (looks the same as the original).</p>"); |
| } else { |
| window.onload = drag; |
| } |
| </script> |