<style>
.box { width: 100px; height: 90px; margin-bottom: 10px; background-color: lightblue; }
.drag-element { -webkit-user-drag: element; }
.drag-none { -webkit-user-drag: none; }
a { display: block; width: 80px; height: 80px; background-color: yellow; font-family: Ahem; font-size: 25px; }
a span { color: orange; }
a img { vertical-align: bottom; }
</style>
<div id="container" style="position: relative;">
<div class="box" expect="IMG nil">
<img src="resources/greenbox.png">
</div>
<div class="box" expect="nil nil">
<img class="drag-none" src="resources/greenbox.png">
</div>
<div class="box drag-element" expect="DIV DIV">
<img class="drag-none" src="resources/greenbox.png">
</div>
<div class="box" expect="IMG A A A nil">
<a href="#"><img src="resources/greenbox.png">x<br><span>y</span></a>
</div>
<div class="box" expect="IMG A A A nil">
<a href="#" class="drag-element"><img src="resources/greenbox.png">x<br><span>y</span></a>
</div>
<div class="box" expect="IMG nil nil nil nil">
<a href="#" class="drag-none"><img src="resources/greenbox.png">x<br><span>y</span></a>
</div>
<div class="box" expect="A A A A nil">
<a href="#"><img class="drag-none" src="resources/greenbox.png">x<br><span>y</span></a>
</div>
<div class="box" expect="A A A A nil">
<a href="#" class="drag-element"><img class="drag-none" src="resources/greenbox.png">x<br><span>y</span></a>
</div>
<div class="box drag-element" expect="IMG DIV DIV DIV DIV">
<a href="#" class="drag-none"><img src="resources/greenbox.png">x<br><span>y</span></a>
</div>
<div class="box drag-element" expect="A A A A DIV">
<a href="#"><img class="drag-none" src="resources/greenbox.png">x<br><span>y</span></a>
</div>
<div class="box drag-element" expect="A A A A DIV">
<a href="#" class="drag-element"><img class="drag-none" src="resources/greenbox.png">x<br><span>y</span></a>
</div>
</div>
<pre id="console"></pre>
<script>
function log(message)
{
document.getElementById("console").appendChild(document.createTextNode(message + "\n"));
}
onload = window.testRunner ? function()
{
testRunner.dumpAsText();
var container = document.getElementById("container");
var y = container.getBoundingClientRect().top;
for (var i = 0; i < container.childElementCount; ++i) {
var listener = function(event)
{
result = event.target.nodeType === Node.TEXT_NODE ? "text" : event.target.tagName;
};
container.addEventListener("dragstart", listener);
var child = container.children[i];
log("Test #" + i);
var expectedResults = child.getAttribute("expect").split(" ");
var result;
function test(h, v)
{
if (expectedResults.length) {
getSelection().empty();
result = "nil";
eventSender.mouseMoveTo(h, y - scrollY + v);
eventSender.mouseDown();
eventSender.mouseMoveTo(220, y - scrollY + v);
eventSender.mouseUp();
var expected = expectedResults.shift();
log(result === expected ? "PASS" : "FAIL: expected " + expected + " but got " + result);
}
}
test(20, 20);
test(45, 20);
test(20, 45);
test(45, 45);
test(95, 85);
container.removeEventListener("dragstart", listener);
y += 100;
scrollBy(0, 100);
}
} : undefined;
</script>