#each with animate: doesn't allow comments

[mvolkmann]

Describe the bug
The combination of #each and the animate directive doesn't allow comments.

To Reproduce
See https://svelte.dev/repl/aa902b5c51fd4e79be8dda8267fe7485?version=3.15.0.
There will be an error message at the bottom.
If the comment is deleted, the error goes away.

Expected behavior
Comments should be ignored and not cause an error.

Severity
This prevents documenting some code.

[rmunn]

Possible workaround: move the comment just inside the element with the animate directive, i.e. change this:

{#each colors as color (color)}
  <!-- comment -->
  <div animate:flip>
    {color}
  </div>
{/each}

to this:

{#each colors as color (color)}
  <div animate:flip>
    <!-- comment -->
    {color}
  </div>
{/each}

Won't help in all cases, such as if the animating div itself has a child with an animate directive, but should work in most cases. It's a little ugly because the comment ends up inside the block it's describing instead of just in front of it, but it's probably better than not being able to have comments at all.

[jrmoynihan]

Just ran into this issue as well. Really frustrating that the language server is even picking up comment blocks.

@rmunn Thanks for the tip with the workaround.

[iacore]

This is pain when I want to disable an element temporarily, when I to try out animation with a temporary <div>.

[Conduitry]

This is supported now in 3.48.0 - https://svelte.dev/repl/aa902b5c51fd4e79be8dda8267fe7485?version=3.48.0