onEnter doesn't wait for route to be "loaded"

[KubaJastrz]

Which project does this relate to?

Router

Describe the bug

onEnter doesn't wait for route to be "loaded" as described in the documentation, as it sometimes runs in parallel to loader function.

If this is expected behavior, I'd love for the documentation to be more precise.

Your Example Website or App

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

Steps to Reproduce the Bug or Issue

Try this a couple of times, I got varied results by repeating the steps.

0. Open console
1. Be on /
2. Go to /about via navbar
3. -- sometimes onEnter starts after loader, but sometimes is starts in parallel to beforeLoad and loader
   
4. Refresh /about
5. -- onEnter always starts in parallel to beforeLoad
   

Expected behavior

onEnter always starts after loader finishes

Screenshots or Videos

No response

Platform

• OS: macOS
• Browser: Chrome
• Version: 132

Additional context

No response

[KubaJastrz]

I extended the example to showcase usage of loaderData in onEnter function:

see also https://tanstack.com/router/latest/docs/framework/react/guide/data-loading

[schiller-manuel]

loader is executed asynchronously in the background if the match is stale but existing.
if you configure matches to be GC'ed directly, loader will always execute synchronously before onEnter:

https://stackblitz.com/edit/tanstack-router-wwip9y6k?file=src%2Froutes%2Fabout.tsx,src%2Fmain.tsx

[KubaJastrz]

True, configuring gc and stale time does in fact change the behavior when going between / and /about routes a few times. But refreshing on /about (thus clearing any cache) still causes onEnter to start before loader in your example.

[nklhtv]

I have the exact same issue. In my app, beforeLoad returns an object, which is expected to be available in onEnter's context param, but it is undefined at runtime.
Tested with react-router 1.125.6.

  beforeLoad: () => {
    console.log('home - beforeLoad');
    return {
      a: 1
    }
  },
  onEnter: ({ context }) => {
    console.log('home - onEnter', context.a); // a is expected to be a number, but it is undefined
  },

[schiller-manuel]

@nklhtv cannot reproduce this here: https://stackblitz.com/edit/tanstack-router-f85pwgwa?file=package.json,src%2Froutes%2Findex.tsx

can you please provide a complete minimal example?