Router context broken with SSR on client side

[rekotiira]

Describe the bug

When using SSR the router context is undefined after page load finishes. On the server render it is working properly, but after the app is dehydrated on client side, and re-rendered, route.useRouteContext() inside a React component returns undefined instead of the context. Changing a route while the app is mounted fixes the issue.

I modified the Basic SSR example to reproduce this bug. When entering the page, the rendered context is undefined, but when navigating to "Posts" page and then back to "Home", it renders the context successfully.

Your Example Website or App

https://stackblitz.com/edit/tanstack-router-rn5jgg?file=src%2Froutes%2Findex.tsx

Steps to Reproduce the Bug or Issue

1. Go to the repro site.
2. See that Context is not printed at all in Home page.
3. Go to Posts page.
4. Go back to Home page.
5. Now the Context is rendered correctly.

Expected behavior

As a user, I expect the context to render correctly on client side on initial render. In the repro site it should render { head: "" } on initial render.

Screenshots or Videos

No response

Platform

• OS: macOS
• Browser: Chrome
• Version: 120.0.6099.129

Additional context

No response