Source code
Revision control
Copy as Markdown
Other Tools
Test Info:
- This WPT test may be referenced by the following Test IDs:
- /css/cssom-view/scrollIntoView-then-scrollBy.html - WPT Dashboard Interop Dashboard
<!DOCTYPE html>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
<title>CSSOM View - scrollIntoView() then a deferred scrollBy() correction</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/dom/events/scrolling/scroll_support.js"></script>
<div style="height: 200px;"></div>
<h1 id="a">A</h1>
<div style="height: 200vh;"></div>
<script>
const OFFSET = 80;
promise_test(async t => {
const target = document.getElementById("a");
await waitForCompositorReady();
await waitForCompositorCommit();
window.addEventListener("scroll", () => {
step_timeout(() => window.scrollBy(0, -OFFSET), 1);
}, { once: true });
target.scrollIntoView();
await waitForDelayWithoutScrollEvent(window);
await waitForCompositorCommit();
assert_equals(target.getBoundingClientRect().top, OFFSET,
"#a should rest OFFSET below the top after the deferred scrollBy()");
}, "scrollIntoView() followed by a deferred scrollBy() preserves the scroll correction");
</script>