chrisgo/bootstrap5-toast

Toast is immediately hidden if `delay` is omitted

nirvana-msu opened this issue · 3 comments

The doc implies that delay argument can be omitted, and the toast will stay until manually dismissed:

Note: The final argument delay is omitable. If omitted, the toast will remain forever.

This does not seem to be the case... For example:

// This works, toast is shown and hidden after delay
$.toast({type: "error", title: "Test", content: "test", delay: 3000})

// This does not work - toast is hidden immediately after being shown (so it never even appears on screen)
$.toast({type: "error", title: "Test", content: "test"})

This piece of code runs right after the toast is shown:

setTimeout(function () {
    if (!paused) {
        $(`#${id}`).toast('hide');
    }
}, opts.delay);

If delay is omitted, opts.delay here is undefined, so setTimeout fires immediarely, and as paused is false, the toast is immediately hidden...

Even more confusingly, same code/bug is also present in the original library.. with the last commit years ago (.. how am I the first one discovering this?).

Perhaps I am not the first one discovering. This fork has a bunch of fixes (diff), including disabling pauseDelayOnHover by default (which happens to mask the issue).

Annoyingly, setting pauseDelayOnHover to false ends up not putting delay in the toast markout at all.... so whatever delay value you provide, it just uses Bootstrap default (5 seconds) instead.

Try this fix

// (13) Deal with the delay
if ($.toastDefaults.pauseDelayOnHover && opts.delay) {