sveltejs/svelte

[bug] Bad rendering using await in component

adiguba opened this issue · 1 comments

Describe the bug

Hi,

When testing await in the script tag of a component, I found a bug that I can't understand.
I don't know if this is really a bug or if I'm doing something wrong.

I'm simply using an await to simulate an async load in my components, which I display via an {#each} on my main component, with an "add one value" button to add an element.

  • there is no problem if I add the elements one by one, waiting for them to load
  • but if I click the button multiple times, the rendering may be broken :
    • On a non-keyed {#each}, some component are not correctly rendered (no children), and others are missing
    • On a keyed {#each}, there are even more missing components!

Exemple (there should be 10 numbered circles on each line) :
Image

Reproduction

Reproduction :
https://svelte.dev/playground/c7e416c4b97446468ee85f3abf4bc676?version=5.41.4

Logs

No error

System Info

REPL with Svelte 5.41.4

Severity

annoyance

Not a "fix", but as a temporary workaround, you can use $state.raw

https://svelte.dev/playground/e9a3e19c221d4a49a546c136c6f70039?version=5.41.4