react-toastify: Animations not working, autoClose not working
Oddly, animations are not working for me at all. When the toast appears, there is no animation. Similarly, when I manually close the toast, there is an abrupt close with no animation. And because autoClose is dependent on the animation, the toast will never close until triggered manually.
I have the CSS file referenced correctly, and styling seems to work otherwise. My implementation is as follows:
Container:
<ToastContainer
position="top-right"
type="error"
autoClose={4000}
hideProgressBar={false}
closeOnClick={true}
pauseOnHover={true}
/>
Trigger code (tried placing this in various areas in my code with the same result):
toast('message', {
type: toast.TYPE.ERROR,
autoClose: 3000,
hideProgressBar: false,
pauseOnHover: true,
});

I’ve tried every variation of settings to no avail. This was attempted using the newest versions of Chrome and Safari. What could be going wrong here?
About this issue
- Original URL
- State: closed
- Created 7 years ago
- Reactions: 1
- Comments: 16 (3 by maintainers)
I have
CSS modulesin my project, and just copied all CSS from the module and added :global prefix to each one. I do not have animations nor autoClose working.