<!DOCTYPE html>
<html>
<head>
<script>
function log(s)
{
document.getElementById('console')
.appendChild(document.createElement('div'))
.appendChild(document.createTextNode(s));
}
function onDragStart(e)
{
if (e.target.id == 'textInput')
log('PASS');
else
log('FAIL: target element was ' + e.target);
}
function runTest()
{
document.getElementById('draggableElement').addEventListener('dragstart', onDragStart);
if (!window.testRunner)
return;
testRunner.dumpAsText();
var textInput = document.getElementById('textInput');
textInput.focus();
textInput.select();
var startX = textInput.offsetLeft + textInput.offsetWidth / 2;
var startY = textInput.offsetTop + textInput.offsetHeight / 2;
eventSender.mouseMoveTo(startX, startY);
eventSender.mouseDown();
eventSender.leapForward(200);
eventSender.mouseMoveTo(startX + 100, startY + 100);
eventSender.mouseUp();
}
</script>
</head>
<body onload="runTest()">
<p>Simple test that dragging selected text in an input box nested in a draggable element works.
<div id="draggableElement" draggable="true">
Draggable div wrapping a text input box:
<input id="textInput" type="text" value="Select and drag me"></input>
</div>
<div id="console"></div>
</body>
</html>