react-remove-scroll icon indicating copy to clipboard operation
react-remove-scroll copied to clipboard

RemoveScroll is broken inside a shadow dom

Open circlingthesun opened this issue 3 years ago β€’ 2 comments

Elements inside of RemoveScroll doesn't scroll when React is mounted inside a shadow dom. I've reproduced the issue here:

https://codesandbox.io/s/cranky-solomon-ox8po?file=/src/App.js

circlingthesun avatar Jun 24 '21 07:06 circlingthesun

Same for the other way around. If the scrollable area is inside a custom element with shadow DOM with is a child of RemoveScroll, it won't work.

EyMaddis avatar Feb 15 '22 23:02 EyMaddis

Thanks for the use case easy to reproduce. It's not clear which logic is preventing the scroll, but there are a few places obviously not compatible with shadow dom concepts.

theKashey avatar Feb 16 '22 04:02 theKashey

I believe I have also run into this issue using chakra modal in a shadow dom

austintackaberry avatar Feb 19 '23 23:02 austintackaberry

using radix-ui/react-select in shadow dom and having the same issue

sandro768 avatar Feb 21 '23 11:02 sandro768

This issue has been marked as "stale" because there has been no activity for 2 months. If you have any new information or would like to continue the discussion, please feel free to do so. If this issue got buried among other tasks, maybe this message will reignite the conversation. Otherwise, this issue will be closed in 7 days. Thank you for your contributions so far.

stale[bot] avatar Apr 30 '23 07:04 stale[bot]

This is still an issue 😭

theomessin avatar May 12 '23 14:05 theomessin

I am also having this issue. When attempting to remove scroll from everything outside of a dropdown component It removes scroll on the conditionally mounted dropdown component.

nwilkie07 avatar May 31 '23 16:05 nwilkie07

Also having this issue.

reify-benjamin-solum avatar Jul 28 '23 21:07 reify-benjamin-solum

Still a problem here

pethel avatar Sep 14 '23 14:09 pethel

Can anyone give me a hand? πŸ™ Any help would be quite appreciated.

theKashey avatar Sep 14 '23 22:09 theKashey

Can anyone give me a hand? πŸ™ Any help would be quite appreciated.

@theKashey Hi, I think I managed to fix this in PR #97

csorfab avatar Sep 21 '23 12:09 csorfab

Update example provided by @circlingthesun to use v.2.5.7 - https://codesandbox.io/s/dreamy-paper-dd269d And look like it solves the problem.

All kudos goes to @csorfab, without their efforts this issue will be unsolved for another year πŸ‘

theKashey avatar Oct 10 '23 02:10 theKashey