ESM build broken, causes scroll-to-top on iOS

[claus]

So the reason this package still has problems on iOS (it does not move the position: fixed body up scrollY pixels; it "scrolls to top" and stays there) is because the ESM build is broken. I haven't debugged what exactly is broken, but if I just grab the source from /src/bodyScrollLock.js and paste it into my project and import from there, the scroll to top problem on iOS is gone, it just works then.

That's probably why Vercel forked and published it without major changes.

[ondrakoupil]

I bumped into this issue as well. The cause is in function setPositionFixed():

      document.body.style.top = -scrollY;
      document.body.style.left = -scrollX;

ScrollX and scrollY are numbers, document.body.style.top expects CSS value with unit. This code practically tries to set invalid unitless value, which is OK in many browsers, but iOS Safari is strict and discards it. Adding unit fixes the issue.

      document.body.style.top = -scrollY + 'px';
      document.body.style.left = -scrollX + 'px';

Current source already has this change implemented, but the published ESM build is stuck to older version for some reason.

[minicatsCB]

A think the bug is partially fixed. This line is still missing the px suffix.

Found these alternatives, both seem to be a fork of the original body-scroll-lock:

• https://github.com/vercel/body-scroll-lock
• https://github.com/rick-liruixin/body-scroll-lock-upgrade

[rick-liruixin]

They stopped the repairs. I had to do it myself, in the same way, with a new version of typeScript. And fix these problems for everyone to use. add react hooks、vue3 example

npm i body-scroll-lock-upgrade

repair log，Refer to the releases page.