Describe the bug

Using multiple {@html variable} can make SvelteKit behave strangely. Essentially, the application is first SSR rendered into the correct state, then the hydration kicks in and incorrectly mutates the state.

This means that the app flickers and that the resulting state is incorrect.

Reproduction

https://github.com/Acmion/svelte-kit-ssr-bug

Logs

-

System Info

System: OS: Windows 10 10.0.19042 CPU: (4) x64 Intel(R) Core(TM) i5-2500K CPU @ 3.30GHz Memory: 1.64 GB / 7.97 GB Binaries: Node: 14.16.0 - C:\Program Files\nodejs\node.EXE npm: 6.14.11 - C:\Program Files\nodejs\npm.CMD Browsers: Edge: Spartan (44.19041.1266.0), Chromium (95.0.1020.53) Internet Explorer: 11.0.19041.1202 npmPackages: @sveltejs/kit: next => 1.0.0-next.196 svelte: ^3.42.6 => 3.44.1

Severity

annoyance

Additional Information

It is relatively easy to work around this problem by, for example, wrapping the {@html variable} statements in divs, like this:

<div>{@html variable}</div> 

However, it is relatively hard to detect and understand what is causing this issue.