Skip to content

New const declaration shows error when using the animate directive inside each block #18365

Description

@YSpoof

Describe the bug

By using the new {const} thing, and having an item with the animate directive rigt below it, we get the error:

"An element that uses the animate: directive must be the only child of a keyed {#each ...} block"

If I then change to the "old" {@const} the error goes away

Image

PS: I'm not sure how to classify the severity, the app doesn't build with it, and that's my first time creating a bug report lol

Reproduction

<script>
  const array = [{ id: 1, name: 'a'}]
</script>

{#each array as item (item.id)}
  {const iName = item.name}
  <div animate:flip>
    <p>{iName}</p>
  </div>
{/each}

Playground link: https://svelte.dev/playground/0100487a59e6457597df4d2c90f0f733?version=latest

Logs

System Info

Packages:
svelte: 5.56.1
svelte-check: 4.5.0

Extension:
svelte.svelte-vscode: 110.1.0

Severity

annoyance

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    Fields

    No fields configured for Bug.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions