Full reload on 404 route fails due to missing root loader data

[sebcomeau]

Reproduction

Visit this StackBlitz link and click the Go to "not-found" page (404 not found) link. This navigates to a 404 page displaying the message 404 - The requested page could not be found., with the page title set to My title.

The page title My title is provided by the root server loader. This works correctly when navigating client-side to /not-found.

However, if you refresh the /not-found page (triggering a full document reload), the following server error is thrown:

Unexpected Server Error

TypeError: Cannot read properties of undefined (reading 'meta')

This occurs because the root loader is not invoked during document load when no routes match. As a result, the meta function attempts to access data which is undefined.

System Info

System:
  OS: Linux 5.0 undefined
  CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
  Memory: 0 Bytes / 0 Bytes
  Shell: 1.0 - /bin/jsh
Binaries:
  Node: 20.19.1 - /usr/local/bin/node
  Yarn: 1.22.19 - /usr/local/bin/yarn
  npm: 10.8.2 - /usr/local/bin/npm
  pnpm: 8.15.6 - /usr/local/bin/pnpm
npmPackages:
  @react-router/dev: ^7.5.3 => 7.5.3 
  @react-router/node: 7.5.3 => 7.5.3 
  @react-router/serve: ^7.5.3 => 7.5.3 
  react-router: ^7.5.3 => 7.5.3 
  vite: ^6.3.3 => 6.3.5

Used Package Manager

npm

Expected Behavior

• When visiting a non-existent route like /not-found, the root loader should run and provide default data (e.g., title).
• The page should render with the 404 message and retain the correct title (My title), regardless of whether the navigation is client-side or a full page reload.

Actual Behavior

• On client-side navigation to /not-found, everything works as expected.

• On full page reload at /not-found, a server error occurs:

  • The root loader does not run because no routes match.
  • The meta function receives undefined data, leading to a TypeError.

[brophdawg11]

The solution here is to include a splat route so the root route correctly matches down through the splat on 404 paths: https://stackblitz.com/edit/github-jyuymorr-bjw5vtfw

When visiting a non-existent route like /not-found, the root loader should run and provide default data (e.g., title).

This is not the expected behavior because without a splat route, the root route does not match on 404's - a path has to be fully consumed to match. The root route is a { path: ''} route and without a splat child, the not-found portion of the path is never consumed and so nothing matches.

The behavioral difference here is that client-side the root data already exists from the successful initial load so it gets (arguably unintentionally) reused when the error boundary renders. The hard reload is behaving correctly during SSR and because nothing matches, the root loader isn't called.

I'll take a look into the differences in behavior here though and see if there are any changes we should make to align them.

[brophdawg11]

I think the behavior here is right - preserving the root loader data if it exists. But what's missing is reflecting in the types in meta that data can be undefined - that would force you to make meta defensive and avoid the error on the hard reload. See #13563

[github-actions]

🤖 Hello there,

We just published version 7.6.1 which involves this issue. If you'd like to take it for a test run please try it out and let us know what you think!

Thanks!