Calling enableBodyScroll can disable body scroll depending on situation about body-scroll-lock HOT 5 OPEN

from body-scroll-lock.

Hey, thanks @willmcpo for the quick response!

Elaborating on my scenario
So I did some more digging into this and there seems to have been more to it then I thought. So the problem starts already when I call disableBodyScroll as this will set the restore values that you mention. In my case these saved restore values are incorrect due to material-ui/Dialog setting overflow: hidden to document.body before disableBodyScroll is fired, and therefore calling enableBodyScroll does not work. Don't really know how to go about this issue but I somehow expected that enableBodyScroll would enable body scrolling regardless of when I might have called disableBodyScroll.

The issue
Incorrect restore values being saved and no way to correct them.

Suggestion
What if the library exposed a function to either update the previousBody... vars or one that set some similar initialBody... vars to be used instead if defined?

Demo
I recreated a condensed example of the issue in this CodeSandbox where I use your library within the ScrollLock component.
https://codesandbox.io/s/50nkpljo9l

from body-scroll-lock.

Since this is a compatibility issue with handling of overflow: hidden on document.body, another solution would be to let lib users opt in/out of the css/js solutions of scroll canceling.

from body-scroll-lock.

I see that you already forward the options object to the function setOverflowHidden. What if this function was updated to something like below to allow control of the restore values.

const setOverflowHidden = (options = {}) => {
  const {
    reserveScrollBarGap,
    restoreBodyPaddingRight: optionsBPR,
    restoreBodyOverflowSetting: optionsBOS,
  } = options

  // Setting overflow on body/documentElement synchronously in Desktop Safari slows down
  // the responsiveness for some reason. Setting within a setTimeout fixes this.
  setTimeout(() => {
    // If previousBodyPaddingRight is already set, don't set it again.
    if (previousBodyPaddingRight === undefined) {
      const scrollBarGap = window.innerWidth - document.documentElement.clientWidth

      if (reserveScrollBarGap && scrollBarGap > 0) {
        // type-check against undefined to allow falsy values
        previousBodyPaddingRight = optionsBPR !== undefined
            ? optionsBPR
            : document.body.style.paddingRight
        document.body.style.paddingRight = `${scrollBarGap}px`
      }
    }

    // If previousBodyOverflowSetting is already set, don't set it again.
    if (previousBodyOverflowSetting === undefined) {
      // type-check against undefined to allow falsy values
      previousBodyOverflowSetting = optionsBOS !== undefined
        ? optionsBOS
        : document.body.style.overflow
      document.body.style.overflow = 'hidden'
    }
  })
}

from body-scroll-lock.

from a quick glimpse, seems ok and intuitive.

would you mind putting that in a PR ? =) 👍

from body-scroll-lock.