Skip to content

Bug in usePreventScroll hook #9172

@nivanavi

Description

@nivanavi

Provide a general summary of the issue here

devongovett Did a great job in this MR, but the issue still persists. If you open the modal, focus on the date, and then close the keyboard by tapping on an empty area in the modal (I’ve marked this spot with a red arrow), then refocus on the date — the modal shifts upward. This can also be reproduced by opening the modal then several times tapping on an empty area, and then focusing on the date — the modal will move up again. IOS 26, on IOS 18 work fine.

Image

🤔 Expected Behavior?

damn safari never scroll the viewport

😯 Current Behavior

damn safari scroll the viewport

💁 Possible Solution

idk, for now i do this, but hope there some other solutions

`

const debouncedScrollToTop = lodash.debounce(() => {
document.documentElement.scrollTo({ top: 0 });
}, 50);

const onVisualScroll = () => {
if (document.documentElement.scrollTop !== 0 || (visualViewport?.offsetTop || 0) !== 0) {
debouncedScrollToTop();
}
};

visualViewport?.addEventListener('scroll', onVisualScroll);
`

🔦 Context

No response

🖥️ Steps to Reproduce

  1. open https://react-spectrum.adobe.com/react-aria/index.html on ios26
  2. open test modal
  3. focus on date input
  4. close the keyboard by tap on empty space
  5. focus on date input again
  6. safari did this again(

or

  1. open https://react-spectrum.adobe.com/react-aria/index.html on ios26
  2. open test modal
  3. tap on empty space several times
  4. focus on date input
  5. safari did this again(

Version

latest i guess

What browsers are you seeing the problem on?

Safari

If other, please specify.

No response

What operating system are you using?

ios

🧢 Your Company/Team

No response

🕷 Tracking Issue

Image

IMG_1689.MP4

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions