<!DOCTYPE html>
<script src="../../../resources/js-test.js"></script>
<style type="text/css">
html, body, .workspace {
height: 100%;
}
button {
cursor: pointer;
padding: 0px;
margin: 0px;
}
.minbox {
height: 30px;
width: 1px;
}
#div1, #div2 {
height: 80px;
border: 1px solid #aaaaaa;
}
</style>
<body>
<div class="workspace"></div>
<div class="minbox">
<div id="test">
<button>POINTER</button>
</div>
</div>
<p id="description"></p>
<div id="console"></div>
<script>
var events = [];
var targets = [];
window.scrollTo(0, 200);
// A position over to the right of <button> and #test.
var button = document.getElementById("test").children[0];
var x = button.getBoundingClientRect().right + 1;
var y = button.getBoundingClientRect().top;
if (window.eventSender) {
function appendEventLog(e) {
events.push(e.type);
targets.push(e.currentTarget.nodeName);
}
function runNextTest(eventType1, eventType2)
{
document.addEventListener(eventType1, appendEventLog);
document.body.addEventListener(eventType1, appendEventLog);
document.addEventListener(eventType2, appendEventLog);
document.body.addEventListener(eventType2, appendEventLog);
eventSender.mouseMoveTo(x, y); // html element in iframe
eventSender.mouseMoveTo(x, y + 200); // out of iframe
eventSender.mouseMoveTo(x, y - 100); // body element in iframe
eventSender.mouseMoveTo(x, y + 200); // out of iframe
document.removeEventListener(eventType1, appendEventLog);
document.body.removeEventListener(eventType1, appendEventLog);
document.removeEventListener(eventType2, appendEventLog);
document.body.removeEventListener(eventType2, appendEventLog);
}
runNextTest('mousemove', '');
runNextTest('mouseover', '');
runNextTest('mouseout', '');
runNextTest('mouseenter', 'mouseleave');
}
var i = 0;
function verifyEventLog(eventType, target)
{
shouldBeEqualToString('events[' + i + ']', eventType);
shouldBeEqualToString('targets[' + i + ']', target);
i++;
}
verifyEventLog('mousemove', '#document'); // x, y
verifyEventLog('mousemove', 'BODY'); // x, y - 100
verifyEventLog('mousemove', '#document'); // x, y - 100
verifyEventLog('mouseover', '#document'); // x, y
verifyEventLog('mouseover', 'BODY'); // x, y - 100
verifyEventLog('mouseover', '#document'); // x, y - 100
verifyEventLog('mouseout', '#document'); // x, y
verifyEventLog('mouseout', 'BODY'); // x, y - 100
verifyEventLog('mouseout', '#document'); // x, y - 100
verifyEventLog('mouseenter', '#document');// x, y
verifyEventLog('mouseleave', '#document');// x, y
verifyEventLog('mouseenter', '#document');// x, y - 100
verifyEventLog('mouseenter', 'BODY'); // x, y - 100
verifyEventLog('mouseleave', 'BODY'); // x, y + 200
verifyEventLog('mouseleave', '#document');// x, y + 200
</script>
</body>
Codebase Browser
chromium