70 lines
1.8 KiB
HTML
70 lines
1.8 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<style type="text/css">
|
|
span, div { display: block; }
|
|
span {
|
|
background: green;
|
|
padding: 10px;
|
|
}
|
|
div {
|
|
background: red;
|
|
padding: 50px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<p>This test ensures we clear the drag state at the end of each drag. To test manually, drag the green box below twice.
|
|
You should observe the same list of events in the same order twice.</p>
|
|
<div contenteditable>
|
|
<span>Drag me down twice!</span>
|
|
</div>
|
|
<pre id="log">
|
|
</pre>
|
|
<script>
|
|
|
|
function log(event) {
|
|
document.getElementById('log').textContent += event.target.localName + ':' + this.localName + ':' + event.type + '\n';
|
|
}
|
|
|
|
function setLog(log) {
|
|
var value = document.getElementById('log').textContent;
|
|
document.getElementById('log').textContent = log;
|
|
return value;
|
|
}
|
|
|
|
var div = document.querySelector('div');
|
|
div.addEventListener('dragover', function (event) { event.preventDefault(); });
|
|
div.addEventListener('dragenter', log);
|
|
div.addEventListener('dragleave', log);
|
|
|
|
var span = document.querySelector('span');
|
|
span.addEventListener('dragenter', log);
|
|
span.addEventListener('dragleave', log);
|
|
|
|
function dragSpan() {
|
|
var x = span.offsetLeft + span.offsetWidth / 2;
|
|
eventSender.mouseMoveTo(x, span.offsetTop + span.offsetHeight / 2);
|
|
eventSender.mouseDown();
|
|
eventSender.mouseMoveTo(x, span.offsetTop + 2 * span.offsetHeight / 3);
|
|
eventSender.leapForward(200);
|
|
eventSender.mouseMoveTo(x, span.offsetTop + 3 * span.offsetHeight / 2);
|
|
eventSender.leapForward(200);
|
|
eventSender.mouseUp();
|
|
}
|
|
|
|
if (window.eventSender) {
|
|
testRunner.dumpAsText();
|
|
getSelection().selectAllChildren(span);
|
|
dragSpan();
|
|
var firstLog = setLog('');
|
|
dragSpan();
|
|
var secondLog = setLog('PASS');
|
|
if (firstLog != secondLog)
|
|
setLog('FAIL:\nFirst drag:\n' + firstLog + '\nSecond drag:\n' + secondLog);
|
|
}
|
|
|
|
</script>
|
|
</body>
|
|
</html>
|