Pending component isn't shown during beforeLoad pending state for root route.

[arkadiuszbachorski]

Which project does this relate to?

Router

Describe the bug

With beforeLoad defined for createRootRoute, it never shows pendingComponent.

It was already a thing for #1104, but it was closed as completed.

Your Example Website or App

https://stackblitz.com/edit/tanstack-router-67wvqt?file=src%2Froutes%2F__root.tsx&preset=node

Steps to Reproduce the Bug or Issue

1. Open reproduction
2. For 3000ms it shows blank page, after 3000ms it shows "Root"

Expected behavior

As a user, I expect to see "Root pending" while beforeLoad is pending. Doc describe it as a feature: Before load docs. It's useful, because user authentication happens during beforeLoad

Screenshots or Videos

No response

Platform

• OS: macOS
• Browser: Chrome
• Version: 131.0.6778.86
• @tanstack/react-router version: ^1.85.0

Additional context

No response

[jameshoward]

Duplicate of #2317?

[SimonSimCity]

Just for the record, the root-component will show the defaultPendingComponent if registered on the router.

It seems, that adding wrapInSuspense: true to the route options of the root-route is a work-around for the pending-component registered on the root route to show up again:(#2182 (comment)).

[ian-pascoe]

Just for the record, the root-component will show the defaultPendingComponent if registered on the router.

It seems, that adding wrapInSuspense: true to the route options of the root-route is a work-around for the pending-component registered on the root route to show up again:(#2182 (comment)).

This only works for loader but not beforeLoad

[robustadev]

'pendingMs' has a default value of 1000 ms, change it to 0 and it should work

[MWGuy]

Same for me. Have an API call in beforeLoad and loader but pendingComponent renders only for promise from loader and for beforeLoad promise have blank page.