davidmfoley / react-router-modal

Simple modals for react-router 4
MIT License
153 stars 20 forks source link

Component is unmounted before outDelay is over #38

Open ekabolotina opened 5 years ago

ekabolotina commented 5 years ago

Hi everyone! Here is an example: <ModalRoute component={Component} path="/path" /> <ModalContainer backdropClassName="modal__backdrop" modalClassName="modal modal_animation_to-right" modalInClassName="modal_in" modalOutClassName="modal_out" outDelay={30000} />

When navigate to /path modal gets modal_in class. Then click 'Back' button in browser => modal gets modal_out class and Component unmount immediately, then after 30000s modal unmounts too. Is it normal behavour? I expect Component to be unmounted at the same time with modal after outDelay.

Also the last modal unmounting without any delay specified in outDelay.

Using

ekabolotina commented 5 years ago

I found this problem occurs in version 2.0.0-rc1 and later.

davidmfoley commented 5 years ago

Thanks for the report.

MindRave commented 5 years ago

@davidmfoley 👋 hello! Any progress on this? Or a possible solution we could implement on our end while waiting on a fix? I confirm, this issue isn't present on previous versions of the library, e.g 1.5.1.

davidmfoley commented 5 years ago

This is kind of a difficult one due to the portal lifecycle in react. I hacked around the problem by copying the content (innerHTML) that is rendered in the modal at the time the unmount begins, and then rendering that content statically during the transition out. I don't love this solution but it's better than a blank modal during the out transition. Let me know how it works for you. (v2.0.0rc3 or next)