blob: db549bf83a70ecd928c2ecc288d03423992793b3 [file] [log] [blame]
<!DOCTYPE html>
<html>
<script src="../../resources/js-test-pre.js"></script>
<script>
description("Tests that padding-bottom is respected in non-dropdown listbox'es. Once a listbox is scrolled to its end, clicking on the padding-bottom area should hit an item only after the listbox is scrolled upwards some steps.");
window.jsTestIsAsync = true;
var i = 0;
var maxAttempts = 20;
function runTest()
{
var scrollAmount = 0;
var select = document.getElementById("sl");
select.scrollTop = select.scrollHeight;
var maxScrollOffset = select.scrollTop;
var x = select.offsetLeft + (select.offsetLeft + select.offsetWidth) / 2;
var y = select.offsetTop + select.offsetHeight - 15;
for ( ; i < maxAttempts; i++) {
var el = document.elementFromPoint(x, y);
if (el instanceof HTMLOptionElement)
break;
scrollAmount += 10;
select.scrollTop = maxScrollOffset - scrollAmount;
}
shouldBeTrue("i > 5 && i < maxAttempts");
finishJSTest();
}
</script>
<body onload="runTest()">
<select id="sl" multiple="multiple" style="padding-bottom: 100px; font-size: 15px;">
<option>January (0)</option>
<option>February (1)</option>
<option>March (2)</option>
<option>April (3)</option>
<option>May (4)</option>
<option>June (5) </option>
<option>July (6)</option>
<option>August (7)</option>
<option>September (8)</option>
<option>October (9)</option>
<option>November (10)</option>
<option>December (11)</option>
</select>
</body>
<script src="../../resources/js-test-post.js"></script>
</html>