11cb0ef41Sopenharmony_ci<!DOCTYPE HTML>
21cb0ef41Sopenharmony_ci<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1">
31cb0ef41Sopenharmony_ci<script src="/resources/testharness.js"></script>
41cb0ef41Sopenharmony_ci<script src="/resources/testharnessreport.js"></script>
51cb0ef41Sopenharmony_ci<script src="/resources/testdriver.js"></script>
61cb0ef41Sopenharmony_ci<script src="/resources/testdriver-actions.js"></script>
71cb0ef41Sopenharmony_ci<script src="/resources/testdriver-vendor.js"></script>
81cb0ef41Sopenharmony_ci<script src="scroll_support.js"></script>
91cb0ef41Sopenharmony_ci<style>
101cb0ef41Sopenharmony_ci#scrollableDiv {
111cb0ef41Sopenharmony_ci  width: 200px;
121cb0ef41Sopenharmony_ci  height: 200px;
131cb0ef41Sopenharmony_ci  overflow: scroll;
141cb0ef41Sopenharmony_ci}
151cb0ef41Sopenharmony_ci
161cb0ef41Sopenharmony_ci#innerDiv {
171cb0ef41Sopenharmony_ci  width: 400px;
181cb0ef41Sopenharmony_ci  height: 400px;
191cb0ef41Sopenharmony_ci}
201cb0ef41Sopenharmony_ci</style>
211cb0ef41Sopenharmony_ci
221cb0ef41Sopenharmony_ci<body style="margin:0" onload=runTest()>
231cb0ef41Sopenharmony_ci<div id="scrollableDiv">
241cb0ef41Sopenharmony_ci  <div id="innerDiv">
251cb0ef41Sopenharmony_ci  </div>
261cb0ef41Sopenharmony_ci</div>
271cb0ef41Sopenharmony_ci</body>
281cb0ef41Sopenharmony_ci
291cb0ef41Sopenharmony_ci<script>
301cb0ef41Sopenharmony_civar scrolling_div = document.getElementById('scrollableDiv');
311cb0ef41Sopenharmony_civar horizontal_scrollend_arrived = false;
321cb0ef41Sopenharmony_civar vertical_scrollend_arrived = false;
331cb0ef41Sopenharmony_cifunction onHorizontalScrollEnd(event) {
341cb0ef41Sopenharmony_ci  assert_false(event.cancelable);
351cb0ef41Sopenharmony_ci  assert_false(event.bubbles);
361cb0ef41Sopenharmony_ci  horizontal_scrollend_arrived = true;
371cb0ef41Sopenharmony_ci}
381cb0ef41Sopenharmony_cifunction onVerticalScrollEnd(event) {
391cb0ef41Sopenharmony_ci  assert_false(event.cancelable);
401cb0ef41Sopenharmony_ci  assert_false(event.bubbles);
411cb0ef41Sopenharmony_ci  vertical_scrollend_arrived = true;
421cb0ef41Sopenharmony_ci}
431cb0ef41Sopenharmony_ciscrolling_div.addEventListener("scrollend", onHorizontalScrollEnd);
441cb0ef41Sopenharmony_ciscrolling_div.addEventListener("scrollend", onVerticalScrollEnd);
451cb0ef41Sopenharmony_ci
461cb0ef41Sopenharmony_cifunction runTest() {
471cb0ef41Sopenharmony_ci  promise_test (async (t) => {
481cb0ef41Sopenharmony_ci    // Make sure that no scrollend event is sent to document.
491cb0ef41Sopenharmony_ci    document.addEventListener("scrollend",
501cb0ef41Sopenharmony_ci        t.unreached_func("Document got unexpected scrollend event."));
511cb0ef41Sopenharmony_ci    await waitForCompositorCommit();
521cb0ef41Sopenharmony_ci
531cb0ef41Sopenharmony_ci    // Do a horizontal scroll and wait for scrollend event.
541cb0ef41Sopenharmony_ci    await touchScrollInTarget(300, scrolling_div, 'right');
551cb0ef41Sopenharmony_ci    await waitFor(() => { return horizontal_scrollend_arrived; },
561cb0ef41Sopenharmony_ci        'Scroller did not receive scrollend event after horizontal scroll.');
571cb0ef41Sopenharmony_ci    assert_equals(scrolling_div.scrollWidth - scrolling_div.scrollLeft,
581cb0ef41Sopenharmony_ci                scrolling_div.clientWidth);
591cb0ef41Sopenharmony_ci
601cb0ef41Sopenharmony_ci    // Do a vertical scroll and wait for scrollend event.
611cb0ef41Sopenharmony_ci    await touchScrollInTarget(300, scrolling_div, 'down');
621cb0ef41Sopenharmony_ci    await waitFor(() => { return vertical_scrollend_arrived; },
631cb0ef41Sopenharmony_ci        'Scroller did not receive scrollend event after vertical scroll.');
641cb0ef41Sopenharmony_ci    assert_equals(scrolling_div.scrollHeight - scrolling_div.scrollTop,
651cb0ef41Sopenharmony_ci                scrolling_div.clientHeight);
661cb0ef41Sopenharmony_ci  }, 'Tests that the scrolled element gets scrollend event at the end of touch scrolling.');
671cb0ef41Sopenharmony_ci}
681cb0ef41Sopenharmony_ci</script>
69