Flash of content if a fly in-transition started immediately after out-transition

[Andrew-Morozko]

Describe the bug

Most of the time if the element is shown immediately after it's out-transition ended it momentarily flashes in its final state in DOM before the in-transition kicks in.

Doesn't matter if the element is shown in onoutroend, or in $effect teardown in use

Spamming await tick() everywhere doesn't help at all, but wrapping the code that starts the in-transition in setTimeout(..., 0) does. Makes me think about task queue starvation by microtask queue, but I don't understand JS at the level that deep.

Bug reproduced on Brave Browser: 129.1.70.126, desktop Safari 16.6.1 and mobile Safari. The same code on Svelte v4 works correctly.

Reproduction

REPL link @5.2.3

Same code works fine on 4.2.19

Logs

No response

System Info

System:
    OS: macOS 11.7.10
    CPU: (4) x64 Intel(R) Core(TM) i7-4650U CPU @ 1.70GHz
    Memory: 274.89 MB / 8.00 GB
    Shell: 3.6.1 - /usr/local/bin/fish
  Binaries:
    Node: 22.7.0 - ~/.local/share/nvm/v22.7.0/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 10.8.2 - ~/.local/share/nvm/v22.7.0/bin/npm
  Browsers:
    Brave Browser: 129.1.70.126
    Chrome: 126.0.6478.63
    Safari: 16.6.1
  npmPackages:
    svelte: ^5.0.0 => 5.0.5

Severity

annoyance

[raythurnvoid]

@Andrew-Morozko Please try again: https://svelte.dev/playground/87db0d4896204488a5e490d29e9a3437?version=latest

I believe this was fixed by #16035 (comment) and was related to #14732 (comment)