search

sveltejs / svelte

web development for the rest of us
https://svelte.dev
MIT License
79.92k stars 4.25k forks source link

Svelte 5 : `animate:flip` elements mispositioned after rapid state toggling #13168

Open mquandalle opened 2 months ago

mquandalle commented 2 months ago

Describe the bug

When using the animate:flip directive in Svelte 5, rapidly toggling the state causes elements to arrive at incorrect positions after the animation.

Reproduction

REPL (need to refresh the REPL if the bug is not visible on first try)

After clicking on the button: image

Logs

No response

System Info

System:
    OS: macOS 14.3.1
    CPU: (8) arm64 Apple M2
    Memory: 73.67 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.10.0 - ~/.nvm/versions/node/v20.10.0/bin/node
    npm: 10.2.3 - ~/.nvm/versions/node/v20.10.0/bin/npm
    bun: 1.1.18 - ~/.bun/bin/bun
  Browsers:
    Brave Browser: 114.1.52.126
    Chrome: 128.0.6613.120
    Safari: 17.3.1
  npmPackages:
    svelte: ^5.0.0-next.244 => 5.0.0-next.244

Severity

annoyance

Prinzhorn commented 2 months ago

Likely another duplicate of https://github.com/sveltejs/svelte/issues/6562 @dummdidumm