timolins / react-hot-toast

Smoking Hot React Notifications 🔥
https://react-hot-toast.com
MIT License
9.55k stars 313 forks source link

Toast is not closed automatically when browser tab is inactive #273

Open algosdev opened 1 year ago

algosdev commented 1 year ago

Hey! First of all, thank you guys for the awesome toast package! I'm having an issue with toasts:

Environment

Version of package: 2.2.0 Application: ReactJS based website

Case

In our project (ReactJS based website), depending on Websocket status (close, open events) we show warning and success toasts (saying "Connection is lost" and "Reconnected"). When connection is restored, we do close warning toast manually with dismiss, show success toast which has duration: 2000ms.

Problem

When laptop goes asleep (but has internet) and has the website open in browser, there are few reconnections happening, and after few hours laptop is opened, there are multiple success toasts shown.

Expected behaviour

There should not be any success toasts because in cofig, duration is set and they should have been closed after 2 seconds.

Thoughts

I explored the source code of the package, it seems setTimeout is used to close toasts with duration, and found from the internet that while the machine is asleep, to save battery, browsers may throttle setTimeout/setInterval which makes them unreliable. Probably setTimeout is not being excuted and that's why there are multiple success toasts.

Question

Do you confirm that the reason above I mentioned is valid? If yes, can we plan fix for it in the feature? Maybe using Web Worker? If no, what can be the cause? How I can resolve the issue?

Limitless-Kode commented 1 year ago

Personally I don't think this is an issue. When your computer goes to sleep it is programmed to pause all processes. And that includes browser processes. Maybe if you can get your computer to keep the browser process running then your issue would be solved.

jonesdhtx commented 1 year ago

We use toasts within a CapacitorJS app w/ the default duration for auto-close. Seems like somewhat randomly, but often enough (eg 1 out of 5 times) a banner will remain visible indefinitely and never auto-close (but can be manually dismissed). I wonder if the mechanism that's breaking down for us is somehow related to this issue/feature?

gudlyf commented 1 year ago

I use websockets to relay notifications to toasts. If the tab is in the background, this could queue up a lot of toast messages that would then spam the display when the tab became active again.