108 lines
3.5 KiB
HTML
108 lines
3.5 KiB
HTML
<!DOCTYPE HTML>
|
|
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1">
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<script src="/resources/testdriver.js"></script>
|
|
<script src="/resources/testdriver-actions.js"></script>
|
|
<script src="/resources/testdriver-vendor.js"></script>
|
|
<script src="scroll_support.js"></script>
|
|
<style>
|
|
html, body {
|
|
margin: 0
|
|
}
|
|
|
|
body {
|
|
height: 3000px;
|
|
width: 3000px;
|
|
}
|
|
|
|
#targetDiv {
|
|
width: 200px;
|
|
height: 200px;
|
|
overflow: scroll;
|
|
}
|
|
|
|
#innerDiv {
|
|
width: 400px;
|
|
height: 400px;
|
|
}
|
|
</style>
|
|
|
|
<body onload=runTest() onscrollend="failOnScrollEnd(event)">
|
|
<div id="targetDiv" onscrollend="onElementScrollEnd(event)">
|
|
<div id="innerDiv">
|
|
</div>
|
|
</div>
|
|
</body>
|
|
<script>
|
|
let element_scrollend_arrived = false;
|
|
|
|
function onElementScrollEnd(event) {
|
|
assert_false(event.cancelable);
|
|
assert_false(event.bubbles);
|
|
element_scrollend_arrived = true;
|
|
}
|
|
|
|
function failOnScrollEnd(event) {
|
|
assert_true(false, "Scrollend should not be called on: " + event.target);
|
|
}
|
|
|
|
function runTest() {
|
|
let target_div = document.getElementById("targetDiv");
|
|
|
|
promise_test (async (t) => {
|
|
await waitForCompositorCommit();
|
|
|
|
target_div.scrollTo({top: 200, left: 200});
|
|
await waitFor(() => { return element_scrollend_arrived; },
|
|
target_div.tagName + " did not receive scrollend event.");
|
|
assert_equals(target_div.scrollLeft, 200, target_div.tagName + " scrollLeft");
|
|
assert_equals(target_div.scrollTop, 200, target_div.tagName + " scrollTop");
|
|
}, "Tests scrollend event is handled by event handler content attribute.");
|
|
|
|
promise_test (async (t) => {
|
|
await waitForCompositorCommit();
|
|
|
|
document.scrollingElement.scrollTo({top: 200, left: 200});
|
|
// The document body onscrollend event handler content attribute will fail
|
|
// here, if it is fired.
|
|
await waitForCompositorCommit();
|
|
assert_equals(document.scrollingElement.scrollLeft, 200,
|
|
"Document scrolled on horizontal axis");
|
|
assert_equals(document.scrollingElement.scrollTop, 200,
|
|
"Document scrolled on vertical axis");
|
|
}, "Tests scrollend event is not fired to document body event handler content attribute.");
|
|
|
|
promise_test (async (t) => {
|
|
await waitForCompositorCommit();
|
|
|
|
// Reset the scroll position.
|
|
document.scrollingElement.scrollTo({top: 0, left: 0});
|
|
|
|
let scrollend_event = new Promise(resolve => document.onscrollend = resolve);
|
|
document.scrollingElement.scrollTo({top: 200, left: 200});
|
|
await scrollend_event;
|
|
|
|
assert_equals(document.scrollingElement.scrollTop, 200,
|
|
"Document scrolled on horizontal axis");
|
|
assert_equals(document.scrollingElement.scrollLeft, 200,
|
|
"Document scrolled on vertical axis");
|
|
}, "Tests scrollend event is fired to document event handler property");
|
|
|
|
promise_test (async (t) => {
|
|
await waitForCompositorCommit();
|
|
|
|
// Reset the scroll position.
|
|
target_div.scrollTo({top: 0, left: 0});
|
|
|
|
let scrollend_event = new Promise(resolve => target_div.onscrollend = resolve);
|
|
target_div.scrollTo({top: 200, left: 200});
|
|
await scrollend_event;
|
|
|
|
assert_equals(target_div.scrollLeft, 200,
|
|
target_div.tagName + " scrolled on horizontal axis");
|
|
assert_equals(target_div.scrollLeft, 200,
|
|
target_div.tagName + " scrolled on vertical axis");
|
|
}, "Tests scrollend event is fired to element event handler property");
|
|
}
|
|
</script>
|