Bug: loader not working on export Layout when hit ErrorBoundary

[liangl1412]

Reproduction

Go to https://stackblitz.com/edit/github-xbkzfzyf?file=app%2Froot.tsx and run the application.
Go to a url that not exist and see 404 and hit ErrorBoundary.
Issue: const data = useRouteLoaderData('root'); in layout will be undefined in this case. Seems when hit ErrorBoundary, layout will not get data from the loader.

System Info

StackBlitz env

Used Package Manager

npm

Expected Behavior

A 404 page load and show loader data from layout

Reason I need to get the data even on a 404 is I have a global nav that has user info, and I want the nav to be show even on a 404 page.
There are other things I might need to have loader data in layout such as i18n provider or other provider, and I want errorBoundary to be inside those providers.

Actual Behavior

Page load without layout and see error TypeError: Cannot read properties of undefined (reading 'username')

[timdorr]

Since no valid route is matched, the entire route tree isn't loaded, including the root.

You can get around this by defining a catch-all route like this: route('/*', 'routes/404.tsx')