85 lines
3.1 KiB
HTML
85 lines
3.1 KiB
HTML
<!DOCTYPE HTML>
|
|
<html id="html" style="height:100%">
|
|
<head>
|
|
<title>Testing effect of listener on body</title>
|
|
<script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
|
|
<script type="application/javascript" src="/tests/SimpleTest/EventUtils.js"></script>
|
|
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
|
|
<style>
|
|
.target { position:absolute; left:200px; top:200px; width:200px; height:200px; background:blue; }
|
|
</style>
|
|
</head>
|
|
<body id="body" onload="setTimeout(runTest, 0)" style="margin:0; width:100%; height:100%; overflow:hidden">
|
|
<div id="content">
|
|
<div id="ruler" style="position:absolute; left:0; top:0; width:1mozmm; height:0;"></div>
|
|
<div class="target" id="t"></div>
|
|
</div>
|
|
<pre id="test">
|
|
<script type="application/javascript">
|
|
var eventTarget;
|
|
window.onmousedown = function(event) { eventTarget = event.target; };
|
|
|
|
// Make sure the target div is "clickable" by adding a click listener on it.
|
|
document.getElementById('t').addEventListener('click', function(e) {
|
|
parent.ok(true, "target was clicked on");
|
|
}, false);
|
|
|
|
// Helper functions
|
|
|
|
function testMouseClick(aX, aY, aExpectedId, aMsg) {
|
|
eventTarget = null;
|
|
synthesizeMouseAtPoint(aX, aY, {});
|
|
try {
|
|
parent.is(eventTarget.id, aExpectedId,
|
|
"checking offset " + aX + "," + aY + " hit " + aExpectedId + " [" + aMsg + "]");
|
|
} catch (ex) {
|
|
parent.ok(false, "checking offset " + aX + "," + aY + " hit " + aExpectedId + " [" + aMsg + "]; got " + eventTarget);
|
|
}
|
|
}
|
|
|
|
function testWithAndWithoutBodyListener(aX, aY, aExpectedId, aMsg) {
|
|
var func = function(e) {
|
|
// no-op function
|
|
parent.ok(true, "body was clicked on");
|
|
};
|
|
testMouseClick(aX, aY, aExpectedId, aMsg + " without listener on body");
|
|
document.body.addEventListener("click", func, false);
|
|
testMouseClick(aX, aY, aExpectedId, aMsg + " with listener on body");
|
|
document.body.removeEventListener("click", func, false);
|
|
}
|
|
|
|
// Main tests
|
|
|
|
var mm;
|
|
function runTest() {
|
|
mm = document.getElementById("ruler").getBoundingClientRect().width;
|
|
parent.ok(4*mm >= 10, "WARNING: mm " + mm + " too small in this configuration. Test results will be bogus");
|
|
|
|
// Test near the target, check it hits the target
|
|
testWithAndWithoutBodyListener(200 - 2*mm, 200 - 2*mm, "t", "basic click retargeting");
|
|
// Test on the target, check it hits the target
|
|
testWithAndWithoutBodyListener(200 + 2*mm, 200 + 2*mm, "t", "direct click");
|
|
// Test outside the target, check it hits the root
|
|
testWithAndWithoutBodyListener(40, 40, "body", "click way outside target");
|
|
|
|
SpecialPowers.pushPrefEnv({"set": [["ui.mouse.radius.enabled", false]]}, runTest2);
|
|
}
|
|
|
|
function runTest2() {
|
|
// In this test, mouse event retargeting is disabled.
|
|
|
|
// Test near the target, check it hits the body
|
|
testWithAndWithoutBodyListener(200 - 2*mm, 200 - 2*mm, "body", "basic click retargeting");
|
|
// Test on the target, check it hits the target
|
|
testWithAndWithoutBodyListener(200 + 2*mm, 200 + 2*mm, "t", "direct click");
|
|
// Test outside the target, check it hits the root
|
|
testWithAndWithoutBodyListener(40, 40, "body", "click way outside target");
|
|
|
|
parent.finishTest();
|
|
}
|
|
|
|
</script>
|
|
</pre>
|
|
</body>
|
|
</html>
|