React-toastify: autoClose doesn't work with react 0.14.*

Created on 2 Feb 2018  Â·  21Comments  Â·  Source: fkhadra/react-toastify

Hi,

I'm facing an issue with autoClose. I follow your example, everything works but the toast will never close until triggered manually. I also try your custom animation, The enter event fired, but the exit didn't.

Here is my code snippet:

– Toast Container settings:

<ToastContainer
    position="top-right"
    type="error"
    autoClose={4000}
/>

– I create a toast by:

toast("Hello", { autoClose: 4000 });

What did I do wrong here?

question

All 21 comments

Hey @khacminh,

I made a sample on codesanbox. I don't notice any issue. Could you modify it to fit your use case?

Edit n00qkkr68m

Thanks.

I am also running into the same issue. I tested your code in the sandbox and it seems to work but, I cannot get my implementation to work.

toast.success("City found!",{ autoClose: 3000 });

Hello @tjacks3,

Could you share your project if it's public? If not, could you share more details like the component where you mounted ToastContainer and the options you use.

Thanks

Hello the current project is private. I mounted the ToastContainer inside of the my apps.js file. I am calling the toast.success(); inside of one of my containers/components.

I'm having the same exact issue with autoClose. Everything else seems to work except autoClose.

Are you using multiple ToastContainer ?

Yup, in older versions of react this don't works.
Example i used react and react-dom 0.14.3 (tutorial stuff) and it dont autoclose.

@fkhadra
Yeah, I have the same problem too.
I used React and React-dom 0.14.8. It doesn't work.
Edit 4qrom4932w

Thanks for the sample. I don't support react 0.14 but I'll definitely have a look and try to fix the issue.

Hello,

React v0.14 don't implement ontransitionend event. The event is available since react v0.15.

Are you not planning to upgrade?

I have the same problem and my team doesnt plan to upgrade since there will be an amount of change in our codebase

I have same issue with React 16.3 It just ignores autoClose. Please help.

Hello @JustFly1984,

The autoClose works without any issue on react 16.3.
Edit y3xq288wk9

Could you share a sample?

As for react 0.14 I'm working on a way to support it

It doesn’t work for me. I’m handling errors in Thunks, and passing
autoClose: 5000 to both - toast call and ToasterManager component, and it
does not work.

@JustFly1984 could you reproduce the issue on codesandbox, so I can help you?

Thanks.

i have this issue, too. i also just tried to replicate it with pretty much my whole relevant code, but it worked in codesandbox. gonna try tomorrow to find out, what else could cause this behavior.

maybe this issue is related with tihs: https://github.com/fkhadra/react-toastify/issues/47

In my case, autoClose was not working because I had not imported all of the CSS files. If you are manually copying the CSS, make sure to include the ProgressBar styles, even if you aren't actually displaying the progress bar. The component relies on the ProgressBar styling to know when to close the toast (when the ProgressBar animation ends)

Hey,

I'm closing this issue, supporting react 0.14 require too much effort.

I am also experiencing this issue on React 16.2

Me too facing the same issue. Does anyone know how to fix this webpack issue . The progressbar and auto close is not working

Was this page helpful?
0 / 5 - 0 ratings

Related issues

JaLe29 picture JaLe29  Â·  5Comments

shirbr510 picture shirbr510  Â·  5Comments

SmileSydney picture SmileSydney  Â·  4Comments

joetidee picture joetidee  Â·  3Comments

spiritedfang picture spiritedfang  Â·  3Comments