Question/Issue about the overflow management

[keul]

Not sure if this is an issue or simply a request for clarify me how the code is working, is not easy to me to understand the logic behind the library (hint: maybe some comments could help! 😄 )

I've an issue in another project that use scrollparent.js as a dependency (see https://github.com/gilbarbara/react-joyride/issues/376).

After lot of debugging the issue seems related to the management of CSS overflow that is done here: https://github.com/olahol/scrollparent.js/blob/dd25def14fa307cd4dc0c71460808232cb797100/scrollparent.js#L23

I'm trying to understand how this should work, why overflow is special for you, as every DOM element that use overflow are giving me issues.

Any tips will be appreciated!

[danoc]

I'm not the author, but the function checks to see if getComputedStyle(myDomNode).overflow, getComputedStyle(myDomNode).overflowX, or getComputedStyle(myDomNode).overflowY contain either auto or scroll. If it does, then it means that the parent is scrollable.

Elements default to overflow-x: visible and overflow-y: visible. What is less know is that adding overflow-x: hidden will cause overflow-y' to become autoand AFAIK there's no way to then changeoverflow-yto hidden as well. This library then seesoverflow-y: auto` and thinks that you meant for the container to be scrollable.

More on this here: https://github.com/civiccc/react-waypoint/issues/118 https://stackoverflow.com/questions/18135204/setting-overflow-y-causes-overflow-x-to-change-as-well