<!DOCTYPE html>
<script src="../../../../resources/testharness.js"></script>
<script src="../../../../resources/testharnessreport.js"></script>
<script src="../../../../resources/gesture-util.js"></script>
<style type="text/css">
#touchtarget {
width: 100px;
height: 100px;
background: white;
overflow:hidden;
}
::-webkit-scrollbar {
width: 0px;
height: 0px;
}
#greenbox {
width: 100px;
height: 100px;
background: green;
padding: 0px;
margin: 0px;
}
#redbox {
width: 100px;
height: 100px;
background: red;
padding: 0px;
margin: 0px;
}
td {
padding: 0px;
}
</style>
<body style="margin:0; overflow-y:hidden;" onload="buildPage();">
<table id="horizontal_table_to_fill">
<tr id="firstrow">
<td><div id="redbox"></div></td>
<td><div id="greenbox"></div></td>
</tr>
</table>
<table id="vertical_table_to_fill">
<tr><td><div id="greenbox"></div></td></tr>
<tr><td><div id="redbox"></div></td></tr>
</table>
</body>
<script type="text/javascript">
var expectedGesturesTotal = 2;
var gesturesOccurred = 0;
var scrollAmountX = [55, 97];
var scrollAmountY = [0, 0];
var scrollEventsOccurred = 0;
var expectedScrollEventsOccurred = 2;
var scrolledElement = document.scrollingElement;
// Always construct a page larger than the vertical height of the window.
function buildPage() {
// build vertical table
var table = document.getElementById('vertical_table_to_fill');
var targetHeight = document.body.offsetHeight;
var cellPairHeight = table.offsetHeight;
var numberOfReps = targetHeight / cellPairHeight * 2;
var i;
for (i = 0; i < numberOfReps; i++) {
var p = document.createElement('tr');
p.innerHTML = '<td><div id="greenbox"></div></td>';
table.appendChild(p);
var p = document.createElement('tr');
p.innerHTML = '<td><div id="redbox"></div></td>';
table.appendChild(p);
}
// build horizontal table
var horizontalTable = document.getElementById('horizontal_table_to_fill');
var tableRow = document.getElementById('firstrow');
var targetWidth = document.body.offsetWidth;
var cellPairWidth = horizontalTable.offsetWidth;
numberOfReps = targetWidth / cellPairWidth * 2;
for (i = 0; i < numberOfReps; i++) {
var p = document.createElement('td');
p.innerHTML = '<div id="redbox"></div>';
tableRow.appendChild(p);
var p = document.createElement('td');
p.innerHTML = '<div id="greenbox"></div>';
tableRow.appendChild(p);
}
window.addEventListener("scroll", recordScroll);
}
var x = 195;
var y = 12;
function firstGestureScroll() {
return smoothScroll(55, x, y, GestureSourceType.TOUCH_INPUT, "downright",
SPEED_INSTANT);
}
function secondGestureScroll() {
x = 120;
y = 255;
return smoothScroll(42, x, y, GestureSourceType.TOUCH_INPUT, "downright",
SPEED_INSTANT);
}
promise_test (async () => {
await firstGestureScroll();
await waitFor(checkScrollOffset);
await secondGestureScroll();
await waitFor(checkScrollOffset);
},'This tests that a page cannot be scrolled vertically with touch ' +
'(but can still be scrolled horizontally) if its body has style ' +
'overflow-y:hidden. The scroll events in this test have both an x and y ' +
'component.');
</script>
Codebase Browser
chromium