Block stays expenaded with isOpened=false

[ascrazy]

There appears to be a bug for the case when isOpened value changes to true and then immediatelly changes back to false (because of useEffect). Please see Demo2Inner in this Codepen - https://codepen.io/ascrazy/pen/MWmJWYR?editors=0010

[ascrazy]

If I postpone syncyng up value and initialValue just for 50ms (so isOpened becomes true then switches back to false in ~50ms) - problem is gone.

    React.useEffect(() => {
      setTimeout(() => setValue(initialValue), 50);
    }, [initialValue]);

[bot19]

Also had the same issue. Can't believe something as obvious as this is a persisting bug. Fixed it by debouncing the state that is tied to Collapse opening & closing (https://thewebdev.info/2021/03/14/how-to-use-the-react-useeffect-hook-with-debounce/).

[nkbt]

Hey @bot19, if that is so obvious and this is a solution you believe is worth having - feel free to fork library, publish with your own namespace and use it. I am not getting paid for anything done here and I have spent a lot of my personal free time working on these libs and maintaining them as much as I could. Good luck with your open-source journey 👌🏻

[tobia]

The reason for this and other bugs is that the container's height is fixed into px every time React calls getSnapshotBeforeUpdate(), which happens a bunch of times during the normal application lifecycle.

This is fixed in kir4ik's pull request: https://github.com/nkbt/react-collapse/pull/310