react-spectrum icon indicating copy to clipboard operation
react-spectrum copied to clipboard

Bug in usePreventScroll hook

Open nivanavi opened this issue 1 month ago • 0 comments

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

https://github.com/user-attachments/assets/08fdc3cd-9c3e-40f5-94cd-75de5baff1c0

nivanavi avatar Nov 12 '25 08:11 nivanavi