script: Remove absolute positioning workaround from scrollIntoView implementation (#39441)

This isn't needed as the border box query already takes into account the
containing block chain. Instead, consistently calculate the new
scroll position for a scroller relative to its current scroll offset.

In addition, fix a small bug where the border of a scroll container was
considered part of scrollport.

Testing: A new WPT test is added.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Oriol Brufau <obrufau@igalia.com>
This commit is contained in:
Martin Robinson 2025-09-23 12:10:00 +02:00 committed by GitHub
parent 16d2e030eb
commit c63311af02
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 104 additions and 119 deletions

View file

@ -632462,6 +632462,13 @@
{}
]
],
"scrollIntoView-scrolling-box-with-large-border.html": [
"424c6f56bd0b8fb01e268184533a6b081253be71",
[
null,
{}
]
],
"scrollIntoView-scrolling-container.html": [
"9f7c88aaeb39610d5adffd046f72bb3a10491fb4",
[

View file

@ -0,0 +1,2 @@
[focus-large-element-in-overflow-hidden-container.html]
expected: FAIL

View file

@ -0,0 +1,22 @@
<!DOCTYPE html>
<title>CSSOM View - scrollIntoView should account for the border of scrollable elements.</title>
<link rel="help" href="https://drafts.csswg.org/cssom-view/#dom-element-scrollintoview">
<link rel="author" title="Martin Robinson" href="mailto:mrobinson@igalia.com">
<link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<div id="scroller" style="overflow: scroll; border: solid 100px; width: 100px; height: 100px;">
<div style="height: 1000px;"></div>
<div id="target" style="background: green; width: 100px; height: 100px"></div>
<div style="height: 1000px;"></div>
</div>
<script>
test(function() {
target.scrollIntoView();
assert_equals(1000, scroller.scrollTop, "Should scroll the target into view.");
}, "scrollIntoView takes into account the border of the scroller");
</script>