1<!DOCTYPE HTML>
2<script src="/resources/testharness.js"></script>
3<script src="/resources/testharnessreport.js"></script>
4<script src="/resources/testdriver.js"></script>
5<script src="/resources/testdriver-actions.js"></script>
6<script src="/resources/testdriver-vendor.js"></script>
7<script src="scroll_support.js"></script>
8<style>
9#targetDiv {
10  width: 200px;
11  height: 200px;
12  overflow: scroll;
13}
14
15#innerDiv {
16  width: 400px;
17  height: 400px;
18}
19</style>
20
21<body style="margin:0" onload=runTest()>
22<div id="targetDiv">
23  <div id="innerDiv">
24  </div>
25</div>
26</body>
27
28<script>
29var target_div = document.getElementById('targetDiv');
30var overscrolled_x_delta = 0;
31var overscrolled_y_delta = 0;
32function onOverscroll(event) {
33  assert_false(event.cancelable);
34  // overscroll events are bubbled when the target node is document.
35  assert_true(event.bubbles);
36  overscrolled_x_delta = event.deltaX;
37  overscrolled_y_delta = event.deltaY;
38}
39document.addEventListener("overscroll", onOverscroll);
40
41function runTest() {
42  promise_test (async (t) => {
43    // Make sure that no overscroll event is sent to target_div.
44    target_div.addEventListener("overscroll",
45        t.unreached_func("target_div got unexpected overscroll event."));
46    await waitForCompositorCommit();
47
48    // Scroll up on target div and wait for the doc to get overscroll event.
49    await touchScrollInTarget(300, target_div, 'up');
50    await waitFor(() => { return overscrolled_y_delta < 0; },
51        'Document did not receive overscroll event after scroll up on target.');
52    assert_equals(target_div.scrollTop, 0);
53
54    // Scroll left on target div and wait for the doc to get overscroll event.
55    await touchScrollInTarget(300, target_div, 'left');
56    await waitFor(() => { return overscrolled_x_delta < 0; },
57        'Document did not receive overscroll event after scroll left on target.');
58    assert_equals(target_div.scrollLeft, 0);
59  }, 'Tests that the document gets overscroll event when no element scrolls ' +
60      'after touch scrolling.');
61}
62</script>
63