Svelte 5: nested transition is buggy

[dm-de]

Describe the bug

One transition inside other transition do not work correct - when {if} block is used.
Similar code work with Svelte 4.

Reproduction

What should happen, if you click button:

1. a overlay should fade smoothly
2. a panel should fly smoothly

But only fade works. Panel do not fly.

Open Overlay.svelte and remove {#if} block - but do not remove {@render}
Now, this happens:
-fade do not animate smoothly
-but panel fly as expected

LINK

Logs

No response

System Info

5.0.0-next.221

Severity

annoyance

[Conduitry]

Can you provide a corresponding Svelte 4 REPL where this is behaving differently? Are you sure this isn't just the change from Svelte 3 to Svelte 4 where transitions became local by default, rather than global?

[Conduitry]

Is this different from #10170?

[dm-de]

Thanks for pointing this out.
I had this little difference (additional #if) in my Svelte 5 and not in Svelte 4 code.

So this issue with #if same like #10170
(this issue with transition inside #if is still catching me - I'm a bit unhappy about this)

But here is another problem.

Here is Svelte 4 code to compare:
https://svelte.dev/repl/c43caafa98274b0eb6957dfe246db339?version=4.2.18

And updated Svelte 5 code:
LINK

Do you see this flickering gray box in Svelte 5?
Happen only on fade out

[7nik]

That flickering seems to be #12844

[dm-de]

With newest Svelte 5 version - flickering is no more visible.

But! If you click faster than animation duration - you will see strange effect where elements are shown immediatly without fade in:

This is the same example - but with longer duration:
Svelte 5 Example

[trueadm]

With newest Svelte 5 version - flickering is no more visible.

But! If you click faster than animation duration - you will see strange effect where elements are shown immediatly without fade in:

This is the same example - but with longer duration: Svelte 5 Example

I get the exact same thing with Svelte 4. :/

[dm-de]

I get the exact same thing with Svelte 4. :/

With Svelte 4, I get expected result without any glitch.

Svelte 4
https://github.com/user-attachments/assets/cf115ec3-83b3-4024-a340-2c2b8bc5134b

Svelte 5
https://github.com/user-attachments/assets/2c9ce514-59e1-4401-9048-333a732b7cd7

[dm-de]

is now fixed