91 lines
2.0 KiB
HTML
91 lines
2.0 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<style>
|
|
|
|
.scroll {
|
|
height: 100px;
|
|
overflow: auto;
|
|
}
|
|
|
|
.filler {
|
|
height: 200px;
|
|
}
|
|
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<p>Ensure that simulated click on label elements uses the original mouse coordinates.</p>
|
|
<input type="checkbox" id="target" onclick="validateEventProperties(event)">
|
|
<label for="target" onclick="storeEvent(event)">Click Me</label>
|
|
|
|
<div class="scroll">
|
|
<div class="filler"></div>
|
|
<input type="radio" id="target2" onclick="validateEventProperties(event)">
|
|
<label for="target2" onclick="storeEvent(event)">Click Me</label>
|
|
</div>
|
|
|
|
<pre id="out"></pre>
|
|
<script>
|
|
|
|
if (window.testRunner)
|
|
testRunner.dumpAsText();
|
|
|
|
function clickOn(element)
|
|
{
|
|
if (!window.eventSender)
|
|
return;
|
|
var rect = element.getBoundingClientRect();
|
|
var x = rect.left + rect.width / 2;
|
|
var y = rect.top + rect.height / 2;
|
|
eventSender.mouseMoveTo(x, y);
|
|
eventSender.mouseDown();
|
|
eventSender.mouseUp();
|
|
}
|
|
|
|
function print(s)
|
|
{
|
|
document.getElementById('out').textContent += s + '\n';
|
|
}
|
|
|
|
var realClickEvent, simulatedEvent;
|
|
|
|
function storeEvent(event)
|
|
{
|
|
realClickEvent = event;
|
|
}
|
|
|
|
function validateEventProperty(name)
|
|
{
|
|
if (realClickEvent[name] === simulatedEvent[name])
|
|
print('PASS: event.' + name + ' is same for both real and simulated event.');
|
|
else
|
|
print('FAIL: event.' + name + ' is ' + simulatedEvent[name] + ', expected ' + realClickEvent[name]);
|
|
}
|
|
|
|
function validateEventProperties(event)
|
|
{
|
|
simulatedEvent = event;
|
|
|
|
validateEventProperty('clientX');
|
|
validateEventProperty('clientY');
|
|
validateEventProperty('layerX');
|
|
validateEventProperty('layerY');
|
|
validateEventProperty('pageX');
|
|
validateEventProperty('pageY');
|
|
validateEventProperty('screenX');
|
|
validateEventProperty('screenY');
|
|
validateEventProperty('x');
|
|
validateEventProperty('y');
|
|
}
|
|
|
|
clickOn(document.querySelector('label'));
|
|
|
|
print('');
|
|
document.querySelector('.scroll').scrollTop = 999;
|
|
clickOn(document.querySelector('.scroll label'));
|
|
|
|
</script>
|
|
</body>
|
|
</html>
|