[useScrollLock] cause enexpected behavior on Safari besides other browsers

[Mister-Hope]

Describe the bug

• when in Chrome based browers, the useScrollLock only lock that element

• when in safari, the useScrollLock locks elment and any elements in it.

I think this should be consider as a bug, and if this is not fixable, I do think we'd better add some warnings in docs.

Related to #1558

My case is that I am locking body to prevent page scroll, while trying to like an fix modal be able to scroll.

I am building a feature extactly like vitepress. See NavScreen Component:

This NavScreen component will lock body scroll, and try to let the modal scrollable. And vitepress itself is not using @vueuse, instead it use body-scroll-lock package. (See: https://github.com/vuejs/vitepress/blob/main/src/client/theme-default/components/VPNavScreen.vue)

While I am trying to build a similar layout with useScrollLock, I am getting the same behavior with Chrome. But on Safari, the NavScreen Component is not scrollable:

You can try https://vuepress-theme-hope.github.io/v2/

I am sure the issue only appears in safari, and:

• Switching vitepress NavScreen component to useScrollLock has same issues on Safari
• Using body-scroll-lock in my theme works well on Safari like vitepress default theme

I can provide a real "minimal reproduction" and system info if you do need this.

Used Package Manager

pnpm

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a VueUse issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion.
• The provided reproduction is a minimal reproducible example of the bug.

[robinscholz]

Ran into the same bug with a current project. The modal that should be scrollable can’t be scrolled, as soon as the body scroll is locked.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[dpschen]

I have the same issue

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[dpschen]

For me this works now since #2699