113 lines
3.5 KiB
HTML
113 lines
3.5 KiB
HTML
<html>
|
|
<head>
|
|
<title>Listbox scrollbar hit testing</title>
|
|
<style type="text/css" media="screen">
|
|
select {
|
|
border: 20px inset gray;
|
|
padding: 10px;
|
|
}
|
|
|
|
#results {
|
|
margin-top: 50px;
|
|
}
|
|
</style>
|
|
<script type="text/javascript" charset="utf-8">
|
|
function sendClick(element, clientX, clientY)
|
|
{
|
|
if (window.eventSender) {
|
|
eventSender.mouseMoveTo(clientX, clientY);
|
|
eventSender.mouseDown();
|
|
eventSender.mouseUp();
|
|
}
|
|
}
|
|
|
|
function mouseDownOnSelect(selId, translateX, translateY)
|
|
{
|
|
log('Testing clicks on ' + selId);
|
|
|
|
var selectElement = document.getElementById(selId);
|
|
var itemHeight = 14;
|
|
var border = 20;
|
|
var scrollbarWidth = 10;
|
|
var scrollbarButtonHeight = 12;
|
|
|
|
var scrollbarMidX = translateX + selectElement.offsetLeft + selectElement.offsetWidth - border - scrollbarWidth / 2;
|
|
// Recall that DRT runs with both scroll arrows at the end of the scrollbar
|
|
var scrollbarTopArrowY = translateY + selectElement.offsetTop + selectElement.offsetHeight - border - scrollbarButtonHeight - 3;
|
|
var scrollbarBottomArrowY = translateY + selectElement.offsetTop + selectElement.offsetHeight - border - 3;
|
|
|
|
sendClick(selectElement, scrollbarMidX, scrollbarBottomArrowY);
|
|
sendClick(selectElement, scrollbarMidX, scrollbarBottomArrowY);
|
|
if (selectElement.scrollTop == 2 * itemHeight)
|
|
log('Scrolled down by itemHeight on down arrow click: PASS');
|
|
else
|
|
log('Failed to scroll down - scrollTop is ' + selectElement.scrollTop + ': FAIL');
|
|
|
|
sendClick(selectElement, scrollbarMidX, scrollbarTopArrowY);
|
|
if (selectElement.scrollTop == itemHeight)
|
|
log('Scrolled up by itemHeight on up arrow click: PASS');
|
|
else
|
|
log('Failed to scroll up - scrollTop is ' + selectElement.scrollTop + ': FAIL');
|
|
|
|
log('');
|
|
}
|
|
|
|
function log(msg)
|
|
{
|
|
var results = document.getElementById('results');
|
|
results.innerHTML += msg + '<br>';
|
|
}
|
|
|
|
function test()
|
|
{
|
|
if (window.testRunner) {
|
|
testRunner.dumpAsText();
|
|
testRunner.waitUntilDone();
|
|
}
|
|
|
|
if (!window.eventSender) {
|
|
log('This test only runs in DRT');
|
|
}
|
|
|
|
// Have to wait for the select to be painted before the
|
|
// scrollbar is sized correctly.
|
|
setTimeout(function() {
|
|
mouseDownOnSelect('select1', 0, 0);
|
|
mouseDownOnSelect('select2', 50, 50);
|
|
if (window.testRunner)
|
|
testRunner.notifyDone();
|
|
}, 0);
|
|
}
|
|
</script>
|
|
</head>
|
|
<body onload="test()">
|
|
|
|
<select id="select1" size="5">
|
|
<option selected value="0">item 0</option>
|
|
<option value="1">item 1</option>
|
|
<option value="2">item 2</option>
|
|
<option value="3">item 3</option>
|
|
<option value="4">item 4</option>
|
|
<option value="5">item 5</option>
|
|
<option value="6">item 6</option>
|
|
<option value="7">item 7</option>
|
|
<option value="8">item 8</option>
|
|
</select>
|
|
|
|
<select id="select2" size="5" style="-webkit-transform: translate(50px, 50px);">
|
|
<option selected value="0">item 0</option>
|
|
<option value="1">item 1</option>
|
|
<option value="2">item 2</option>
|
|
<option value="3">item 3</option>
|
|
<option value="4">item 4</option>
|
|
<option value="5">item 5</option>
|
|
<option value="6">item 6</option>
|
|
<option value="7">item 7</option>
|
|
<option value="8">item 8</option>
|
|
</select>
|
|
|
|
<div id="results">
|
|
</div>
|
|
</body>
|
|
</html>
|