search

sveltejs / svelte

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

Nested animate acts weirdly #12473

Open ValipPowa opened 3 months ago

ValipPowa commented 3 months ago

Describe the bug

Basically the movement isn't as it should be when you have nested animate you may ask why nested animate? well for a grid list with columns you need to animate the columns and rows like in the repo

Reproduction

repo

Logs

No response

System Info

System:
    OS: Windows 11 10.0.22631
    CPU: (12) x64 AMD Ryzen 5 7600X 6-Core Processor
    Memory: 21.29 GB / 31.22 GB
  Binaries:
    Node: 20.13.1 - C:\Program Files\nodejs\node.EXE
    npm: 10.5.2 - C:\Program Files\nodejs\npm.CMD
    pnpm: 9.1.3 - ~\AppData\Local\pnpm\pnpm.EXE
    bun: 1.1.9 - ~\.bun\bin\bun.EXE
  Browsers:
    Edge: Chromium (126.0.2592.61)
    Internet Explorer: 11.0.22621.3527

Severity

annoyance

trueadm commented 3 months ago

It appears to me to work the same in Svelte 4? https://svelte.dev/repl/b685fadb8e84465fadcd7c9ab53e951f?version=4.2.18

dummdidumm commented 3 months ago

What exactly doesn't behave/animate as you expect? Can you describe the difference between expected and actual animation?

ValipPowa commented 3 months ago

What exactly doesn't behave/animate as you expect? Can you describe the difference between expected and actual animation?

quite simply remove the nested animate and you can see the difference also in Svelte 4 like the above person said it works the same but the bug just appears MINIMALLY you can still see the same flickering

the bug no bug

ValipPowa commented 3 months ago

It appears to me to work the same in Svelte 4? https://svelte.dev/repl/b685fadb8e84465fadcd7c9ab53e951f?version=4.2.18

check above this comment I've added clips with difference between expected result and the result. weirdly enough in Svelte 4 the effect of the bug is very minimal and barely noticeable in svelte 5 it shines like a star