Collections are not scrolling if scroll on body in the Chrome browser

[ValeraS]

Provide a general summary of the issue here

After changes in #8715, keyboard navigation does not scroll collection's items into viewport if scroll on the body in Chrome browser.

🤔 Expected Behavior?

Collection's items scroll into viewport.

😯 Current Behavior

subj

💁 Possible Solution

react-spectrum/packages/@react-aria/utils/src/scrollIntoView.ts

Line 152 in 76e8dd1

let scrollParents = getScrollParents(targetElement);

let scrollParents = getScrollParents(targetElement);
if (!isScrollPrevented) {
    scrollParent.push(root);
}

🔦 Context

No response

🖥️ Steps to Reproduce

https://codesandbox.io/p/sandbox/xenodochial-dream-kdff5w

Screen.Recording.2025-10-06.at.17.23.22.mov

Version

react-aria-components@1.13.0

What browsers are you seeing the problem on?

Chrome

If other, please specify.

No response

What operating system are you using?

macos

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

[LFDanLu]

Thanks for catching this, reproduced locally. I think your proposed fix makes sense since we were previously relying on the assumption that that portion of the scroll code would only fire if scrolling was being prevented, would you like to make a PR for it?

[ValeraS]

@LFDanLu Hi, it's again does not work on react-aria-components v.1.16.0

[LFDanLu]

@ValeraS thanks for catching this, looks like it broke as a part of #9146. We actually don't include the root as a part of the scrollParents anymore due to the change in

react-spectrum/packages/@react-aria/utils/src/getScrollParents.ts

Lines 19 to 24 in 4b48a50

	do {
	if (isScrollable(node, checkForOverflow)) {
	parentElements.push(node);
	}
	node = node.parentElement as Element;
	} while (node && node !== root);

, so that will need to be updated to bring that back.

However, doing that seems to be insufficient. It now seems to attempt to scroll the table body itself as you get partially down the table and triggers

react-spectrum/packages/@react-aria/utils/src/scrollIntoView.ts

Lines 159 to 164 in 4b48a50

	// Account for sub pixel differences from rounding
	if ((Math.abs(originalLeft - newLeft) > 1) || (Math.abs(originalTop - newTop) > 1)) {
	scrollParents = containingElement ? getScrollParents(containingElement, true) : [];
	for (let scrollParent of scrollParents) {
	scrollIntoView(scrollParent as HTMLElement, containingElement as HTMLElement, {block: 'center', inline: 'center'});
	}

even though the item you are keyboard navigating to is already in view. I think

react-spectrum/packages/@react-aria/utils/src/scrollIntoView.ts

Line 76 in 4b48a50

let scrollBarHeight = scrollView.offsetHeight - scrollView.clientHeight - scrollBarOffsetY;

needs to return 0 if the scrollView is the root since we already use clientHeight here:

react-spectrum/packages/@react-aria/utils/src/scrollIntoView.ts

Line 49 in 4b48a50

let viewBottom = scrollView === root ? scrollView.clientHeight : view.bottom;

which should exclude the horizontal scrollbar. That seems to improve behavior but the scrolling isn't quite working, it scrolls to the proper position but then undos its progress with another scrollIntoView call

[LFDanLu]

I've opened a PR for this #9780. Still needs to go through some through testing/logic check, feel free to take a look if you'd like