[Bug?]: Client Only component displayed in app.tsx causes hydration errors

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Current behavior 😯

If a client only component is added in app.tsx and when the matching route suspends then a hydration mismatch error is caused.

Expected behavior 🤔

There should be no hydration mismatch error when including a client only component anywhere in the app

Steps to reproduce 🕹

Steps:

1. Open https://stackblitz.com/edit/github-hn2yqi?file=src%2Froutes%2Findex.tsx
2. Reload the page
3. Wait for 1 second and notice a hydration mismatch error
4. If you set the variable perform_hydration_error to false then you shall see the hydration error disappear
5. This is because setting perform_hydration_error to false prevents the matching route in index.tsx from suspending

Context 🔦

I am a maintainer of TanStack Solid Query. I found this error because I wanted to create the hackernews demo using SolidStart and SolidQuery. Adding the SolidQueryDevtools that are only supposed to run on the client was breaking the app. Any ideas here would be greatly appreciated 🙏

Your environment 🌎

No response

Reproduce the issue using the linked StackBlitz example, starting with src/routes/index.tsx and the client-only component added in app.tsx. Compare behavior with perform_hydration_error enabled and disabled while the matching route suspends. Done means the route can suspend with the client-only component present without producing a hydration mismatch error.