Hydration error when using streaming, `lazy` imports, and createResource

[marbemac]

Describe the bug

When using renderToStream + lazy imports, suspended content, driven by a resource, sometimes disappears with a hydration error.

TBH I wasn't sure whether to open this issue here or in the core solid repo, but it seems that without the router involved the issue goes away (see the https://github.com/marbemac/solid-streaming-lazy-bug/tree/no-router branch).

BTW since downstream projects such as solid-start leveraging lazy + resource + solid-router, folks that turn on streaming there might end up seeing this issue as well.

Your Example Website or App

https://github.com/marbemac/solid-streaming-lazy-bug

Steps to Reproduce the Bug or Issue

1. git clone https://github.com/marbemac/solid-streaming-lazy-bug
2. pnpm i
3. pnpm dev
4. Open http://localhost:5173/lazy
5. Open devtools, set network throttling to 3g so that there is some latency loading the lazy imported route component
6. Reload the page

Expected behavior

I should not see the hydration error / disappearing content.

Screenshots or Videos

You'll see that just after the resource finishes loading, and renders the list, the list disappears and the hydration key error logs in the console.

Platform

• OS: [e.g. macOS, Windows, Linux]
• Browser: [e.g. Chrome, Safari, Firefox]
• Version: [e.g. 91.1]

Additional context

No response

[ryansolid]

I have to admit this is an odd one.. I can reproduce it on first refresh but never again. Making it really hard to debug into. Thanks for reporting.