Issue when creating multiple toasts in a loop

[vikramsoni2]

try to run 3 toasts in a loop.

it just shows one toast and the other toasts are in html but behind the first toast, and it does not expand on hover. the first toast just moves a little bit when hovered.

[that-ambuj]

I also have the same issue.

[ronaldemo]

Use setTimeout to add interval between them. e.g.

const sleep = ms => new Promise(r => setTimeout(r, ms))
const addToasts = async (items) => {
  for (const item of items) {
    addToast(item)
    await sleep(1)
  }
}

[bw1984]

any ideas on how this can be fixed without the timeout hack? i have the same issue and i'm showing potentially 1000s of toasts in quick succession. Adding a timeout will cause too much delay

[kevinwaxi]

Use setTimeout to add interval between them. e.g.

const sleep = ms => new Promise(r => setTimeout(r, ms))
const addToasts = async (items) => {
  for (const item of items) {
    addToast(item)
    await sleep(1)
  }
}

Just as i was about to quit on this ...helped my thinking