blob: 0b4fd99cc90ae51bdf22f9266abc8e21db18a4e6 [file] [log] [blame]
<!DOCTYPE html> <!-- webkit-test-runner [ internal:AsyncOverflowScrollingEnabled=true ] -->
<html>
<head>
<style>
body {
height: 1000px;
}
.scroller {
margin: 20px;
height: 200px;
width: 200px;
border: 20px solid gray;
padding: 5px;
overflow: scroll;
}
.horizontal {
overflow-y: hidden;
}
.vertical {
overflow-x: hidden;
}
.content {
width: 300%;
height: 300%;
}
</style>
<script src="../../../resources/js-test-pre.js"></script>
<script src="../../../resources/ui-helper.js"></script>
<script>
var jsTestIsAsync = true;
var horizontalScroller;
var verticalScroller;
var horizontalScrollerEventCount = 0;
var verticalScrollerEventCount = 0;
var windowScrollEventCount = 0;
const horizontalScrollerMouseX = 100;
const horizontalScrollerMouseY = 100;
const verticalScrollerMouseX = 100;
const verticalScrollerMouseY = 400;
async function resetScrollPositions()
{
window.scrollTo(0, 0);
horizontalScroller.scrollTop = 0;
verticalScroller.scrollTop = 0;
// Wait for scroll events to fire.
await UIHelper.animationFrame();
horizontalScrollerEventCount = 0;
verticalScrollerEventCount = 0;
windowScrollEventCount = 0;
}
async function testScrollInScroller(debugMessage, x, y, beginXDelta, beginYDelta, deltaX, deltaY, expectationsFunction)
{
debug('');
debug(debugMessage);
await resetScrollPositions();
await UIHelper.mouseWheelScrollAt(x, y, beginXDelta, beginYDelta, deltaX, deltaY);
expectationsFunction();
}
async function testHorizontalScrollInHorizontalScroller()
{
await testScrollInScroller('Test horizontal scroll in horizontal scroller', horizontalScrollerMouseX, horizontalScrollerMouseY, -1, 0, -10, 0, () => {
shouldBe('horizontalScrollerEventCount > 0', 'true');
shouldBe('verticalScrollerEventCount', '0');
shouldBe('windowScrollEventCount', '0');
});
}
async function testVerticalScrollInHorizontalScroller()
{
await testScrollInScroller('Test horizontal scroll in horizontal scroller', horizontalScrollerMouseX, horizontalScrollerMouseY, 0, -1, 0, -10, () => {
shouldBe('horizontalScrollerEventCount', '0');
shouldBe('verticalScrollerEventCount', '0');
shouldBe('windowScrollEventCount > 0', 'true');
});
}
async function testHorizontalScrollInVerticalScroller()
{
await testScrollInScroller('Test horizontal scroll in vertical scroller', verticalScrollerMouseX, verticalScrollerMouseY, -1, 0, -10, 0, () => {
shouldBe('horizontalScrollerEventCount', '0');
shouldBe('verticalScrollerEventCount', '0');
shouldBe('windowScrollEventCount > 0', 'true'); // Rubberbanding
});
}
async function testVerticalScrollInVerticalScroller()
{
await testScrollInScroller('Test vertical scroll in vertical scroller', verticalScrollerMouseX, verticalScrollerMouseY, 0, -1, 0, -10, () => {
shouldBe('horizontalScrollerEventCount', '0');
shouldBe('verticalScrollerEventCount > 0', 'true');
shouldBe('windowScrollEventCount', '0');
});
}
async function scrollTest()
{
await testHorizontalScrollInHorizontalScroller();
await testVerticalScrollInHorizontalScroller();
await testHorizontalScrollInVerticalScroller();
await testVerticalScrollInVerticalScroller();
finishJSTest();
}
window.addEventListener('load', () => {
horizontalScroller = document.querySelector('.horizontal.scroller');
horizontalScroller.addEventListener('scroll', () => {
++horizontalScrollerEventCount;
}, false);
verticalScroller = document.querySelector('.vertical.scroller');
verticalScroller.addEventListener('scroll', () => {
++verticalScrollerEventCount;
}, false);
window.addEventListener('scroll', () => {
++windowScrollEventCount;
}, false);
setTimeout(scrollTest, 0);
}, false);
var successfullyParsed = true;
</script>
</head>
<body>
<div class="scroller horizontal">
<div class="content"></div>
</div>
<div class="scroller vertical">
<div class="content"></div>
</div>
<div id="console"></div>
<script src="../../../resources/js-test-post.js"></script>
</body>
</html>