fkhadra / react-toastify

React notification made easy 🚀 !
https://fkhadra.github.io/react-toastify/introduction
MIT License
12.58k stars 692 forks source link

AutoClose doesn't work on update. Should be solved in #810? #918

Closed ratzownal closed 1 year ago

ratzownal commented 1 year ago

Do you want to request a feature or report a bug? Bug

What is the current behavior?

After updating the toast with autoClose the progress bar is not running and the toast is not closing. The time starts running after hovering over the toast.

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. Your bug will get fixed much faster if we can run your code and it doesn't have dependencies other than React. Paste the link to your CodeSandbox (https://codesandbox.io/s/new) example below:

https://codesandbox.io/s/quizzical-silence-n4mn9w?file=/src/App.jsx

What is the expected behavior?

After updating the toast with autoClose the progress bar should start running and the toast should be closed after the time is running up.

Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?

Chrome Version 109.0.5414.74

"dependencies": { "react": "^18.2.0", "react-dom": "^18.2.0", "react-intl": "^6.2.10", "react-redux": "^8.0.5", "react-router-dom": "^6.8.1", "react-scripts": "5.0.1", "react-toastify": "^9.1.1", "redux-persist": "^6.0.0", }

fkhadra commented 1 year ago

@ratzownal this is a known issue. Until it's fixed, you can workaround this by adding a delay

toast.update(id, {
      render: "All is good",
      type: "success",
      isLoading: false,
      autoClose: 2000,
     // artificial delay
      delay: 200
    });
boan-anbo commented 1 year ago

Thanks fkhadra. Hope the fix is released soon. Before that, set progress to 0 when updating the toast with autoClose also works around the problem. (If you set it to 1, it will immediately close. Seems autoClose is connected to progress somehow.)