90 lines
3.1 KiB
HTML
90 lines
3.1 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html>
|
||
|
|
<head>
|
||
|
|
<style>
|
||
|
|
.box {
|
||
|
|
width: 200px;
|
||
|
|
height: 200px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gallery {
|
||
|
|
overflow: scroll;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<script src="../../resources/js-test.js"></script>
|
||
|
|
<script src="../../resources/ui-helper.js"></script>
|
||
|
|
<script>
|
||
|
|
window.jsTestIsAsync = true;
|
||
|
|
|
||
|
|
function clickOnElement(targetElement) {
|
||
|
|
var clientRect = targetElement.getBoundingClientRect();
|
||
|
|
eventSender.mouseMoveTo(clientRect.x + 5, clientRect.y + 5);
|
||
|
|
eventSender.mouseDown();
|
||
|
|
}
|
||
|
|
|
||
|
|
async function runTests()
|
||
|
|
{
|
||
|
|
try {
|
||
|
|
var container = document.getElementById("container");
|
||
|
|
|
||
|
|
clickOnElement(container);
|
||
|
|
await UIHelper.keyDown("pageDown");
|
||
|
|
|
||
|
|
expectTrue(container.scrollTop != 0, "paging moved container");
|
||
|
|
let defaultPagePosition = container.scrollTop;
|
||
|
|
let pageProportion = container.scrollTop / container.clientHeight;
|
||
|
|
|
||
|
|
container.scrollTop = 0;
|
||
|
|
container.style.scrollPaddingTop = "10px";
|
||
|
|
await UIHelper.keyDown("pageDown");
|
||
|
|
|
||
|
|
let expected = (container.clientHeight - 10) * pageProportion;
|
||
|
|
expectTrue(container.scrollTop != 0, "paging moved padded container");
|
||
|
|
shouldBeCloseTo("container.scrollTop", expected, 1);
|
||
|
|
|
||
|
|
container.scrollTop = 0;
|
||
|
|
container.style.scrollPaddingTop = "0px";
|
||
|
|
container.style.scrollPaddingBottom = "10px";
|
||
|
|
await UIHelper.keyDown("pageDown");
|
||
|
|
|
||
|
|
expectTrue(container.scrollTop != 0, "paging moved padded container");
|
||
|
|
shouldBeCloseTo("container.scrollTop", expected, 1);
|
||
|
|
|
||
|
|
container.scrollTop = 0;
|
||
|
|
container.style.scrollPaddingTop = "10px";
|
||
|
|
container.style.scrollPaddingBottom = "10px";
|
||
|
|
await UIHelper.keyDown("pageDown");
|
||
|
|
|
||
|
|
expected = (container.clientHeight - 20) * pageProportion;
|
||
|
|
expectTrue(container.scrollTop != 0, "paging moved padded container");
|
||
|
|
shouldBeCloseTo("container.scrollTop", expected, 1);
|
||
|
|
} catch (e) {
|
||
|
|
console.log(e);
|
||
|
|
} finally {
|
||
|
|
finishJSTest();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
function onLoad()
|
||
|
|
{
|
||
|
|
if (window.eventSender) {
|
||
|
|
runTests();
|
||
|
|
} else {
|
||
|
|
var console = document.getElementById('console');
|
||
|
|
console.innerText = "This test cannot be run manually."
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
</head>
|
||
|
|
<body onload="onLoad();">
|
||
|
|
<div id="console"></div>
|
||
|
|
<div id="container" class="box" style="overflow: scroll;">
|
||
|
|
<div class="box" style="background: green;"></div>
|
||
|
|
<div class="box" style="background: red;"></div>
|
||
|
|
<div class="box" style="background: pink;"></div>
|
||
|
|
<div class="box" style="background: yellow;"></div>
|
||
|
|
<div class="box" style="background: orange;"></div>
|
||
|
|
</div>
|
||
|
|
</body>
|
||
|
|
</html>
|