Content initially hidden when mounting as opened

[asbjornh]

When Collapse mounts with isOpened={true}, the initial render applies the style overflow:hidden;height:0. This style means that with js disabled, no content is visible (I'm doing server side rendering and want to support users without js) . It's possible but cumbersome to get around this.

Even with js enabled this is kind of annoying, because you'll get one render with the content invisible, and then the content will pop into existence half a second later.

I think it would be good if no styles or height:auto was applied on the initial render if open.

If you're actively maintaining this, I'd be more than happy to submit a PR 🙂

[nkbt]

I think it may be much harder problem to solve tbh. I even made a talk one time for our local meetup how to fix this. It was related to ssr with responsive, where we should avoid animation on the first render and pre-open/pre-close things with no animations.

Tbh, if you look at master branch you will see entirely different component that I wrote from scratch and I am not much into supporting 4.x version anymore. There are some issues related with the way new react batches updates, so I found it would be better just to rewrite it again. It does not have all 4.x functionality, which I eventually planned to add (at least most essential features).

[asbjornh]

Ah, I see 🙂 I didn't realize you were working on 5. Looks like the above issue would be easier to avoid in the new version. I've actually been thinking about creating my own expand/collapse package without react-motion for a while so let me know if you'd like help with completing v5! Closing this.

[skizzo]

Ran into the same problem just now, fixed it by setting the min-width to 1px on the Collapse component's first child div ;)