<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<script src="../../../../resources/testharness.js"></script>
<script src="../../../../resources/testharnessreport.js"></script>
<script src="../../../../resources/gesture-util.js"></script>
<style type="text/css">
#gesturetarget {
width: 100px;
height: 100px;
position: relative;
background: white;
}
::-webkit-scrollbar {
width: 0px;
height: 0px;
}
#movingbox {
width: 100%;
height: 100%;
position: absolute;
word-wrap: break-word;
overflow-y: scroll;
overflow-x: scroll;
display: block;
}
#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">
<div id="gesturetarget">
<div id="movingbox">
<table border="0" cellspacing="0px">
<tr>
<td><div id="redbox"></div></td>
<td><div id="greenbox"></div></td>
</tr>
<tr>
<td><div id="greenbox"></div></td>
<td><div id="greenbox"></div></td>
</tr>
</table>
</div>
</div>
</body>
<script type="text/javascript">
var movingdiv = document.getElementById('movingbox');
var expectedScrollsTotal = 2;
var scrollsOccurred = 0;
var scrollAmountX = [90, 90];
var scrollAmountY = [0, 95];
function checkScrollOffset() {
// Allow up to two pixels off to avoid flakiness.
var pixels = 2;
return approx_equals(movingdiv.scrollTop,
scrollAmountY[scrollsOccurred], pixels) &&
approx_equals(movingdiv.scrollLeft,
scrollAmountX[scrollsOccurred], pixels);
}
promise_test (async () => {
var x = 95;
var y = 12;
await smoothScroll(90, x, y, GestureSourceType.TOUCH_INPUT, "right",
SPEED_INSTANT);
await waitFor(checkScrollOffset);
scrollsOccurred++;
}, "firstGestureScrollSequence");
promise_test (async () => {
var x = 12;
var y = 97;
await smoothScroll(95, x, y, GestureSourceType.TOUCH_INPUT, "down",
SPEED_INSTANT);
await waitFor(checkScrollOffset);
}, "secondGestureScrollSequence");
</script>