<!DOCTYPE html>
<script src='../../resources/testharness.js'></script>
<script src='../../resources/testharnessreport.js'></script>
<script src='../../resources/gesture-util.js'></script>
<script src="resources/hover-on-scroll-checker.js"></script>
<script src="../../resources/testdriver.js"></script>
<script src="../../resources/testdriver-actions.js"></script>
<script src="../../resources/testdriver-vendor.js"></script>
<style>
body, html {
margin: 0;
height: 500vh;
}
div {
height: 50px;
width: 100%;
}
.hoverme {
background-color: rgb(0, 0, 255);
}
.hoverme:hover {
background-color: rgb(255, 255, 0);
}
.message {
width: 100%;
text-align: left;
}
</style>
<div class="hoverme">hover over me</div>
<div class="hoverme">hover over me</div>
<div class="hoverme">hover over me</div>
<div class="hoverme">hover over me</div>
<div class="hoverme">hover over me</div>
<script>
window.onload = async () => {
if (!window.internals) {
// Test requires window.internals to hide cursor.
return;
}
promise_test(async () => {
const scrollAmount = 150;
const postScrollHoverIndex = 0;
const scrollCallback = (x, y) => {
internals.setIsCursorVisible(document, false);
return wheelScroll(x, y, 0, scrollAmount);
};
return runHoverStateOnScrollTest(scrollCallback, postScrollHoverIndex);
}, 'crbug.com/153784 New hover effects should not be invoked during ' +
'scroll if the mouse cursor is not visible.');
}
</script>