<!DOCTYPE html>
<title>Tests mouse interactions on a non-custom composited div scrollbar.</title>
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../resources/gesture-util.js"></script>
<script src="../../../resources/scrollbar-util.js"></script>
<style>
.appearance {
width: 100px;
height: 100px;
overflow: scroll;
border: 1px solid black;
}
.standardLocation {
position: absolute;
top: 100px;
left: 100px;
}
.space {
height: 1000px;
width: 1000px;
}
</style>
<div id="root" class="space"></div>
<div id="standard" class="appearance standardLocation">
<div class="space"></div>
</div>
<script>
window.onload = () => {
const standardDivFast = document.getElementById("standard");
const standardRectFast = standardDivFast.getBoundingClientRect();
const TRACK_WIDTH = calculateScrollbarThickness();
const BUTTON_WIDTH = TRACK_WIDTH;
const SCROLL_CORNER = TRACK_WIDTH;
const SCROLL_DELTA = 50;
promise_test (async () => {
await waitForCompositorCommit();
resetScrollOffset(standardDivFast);
// Click on the forward arrow of the div scroller and expect that the root scroller
// should not scroll.
let x = standardRectFast.right - BUTTON_WIDTH / 2;
let y = standardRectFast.bottom - SCROLL_CORNER - BUTTON_WIDTH / 2;
const max_div_offset = 915;
standardDivFast.scrollTop = max_div_offset;
await mouseClickOn(x, y);
await conditionHolds(() => { return standardDivFast.scrollTop == max_div_offset; }, "Not expected to scroll because already at max offset.");
await conditionHolds(() => { return window.scrollY == 0; }, "Root should scroll when a div (at max offset) is scrolled.");
}, "Test that scroll chaining doesn't happen for scrollbar interactions.");
}
</script>
Codebase Browser
chromium