[Bug]: Errors fetching lazy routes aren't caught by errorElement on refresh

[mgmarlow]

What version of React Router are you using?

6.9.0

Steps to Reproduce

1. Set up minimal lazy-loaded example with a root errorElement
2. Throw an error in async lazy() {...} (this simulates failure to fetch a chunk from a server, e.g. Cascading Cache Invalidation).
3. Observe navigating to the problem route will render errorElement, expected
4. Observe refreshing renders React's generic blank error page, not expected

Link to sandbox repro-ing issue: https://codesandbox.io/s/laughing-elion-nsbvpy?file=/src/index.js

const routes = [
  {
    path: "/",
    errorElement: <ErrorPage />,
    children: [
      { index: true, element: <Home /> },
      {
        path: "apps",
        children: [
          {
            index: true,
            async lazy() {
              const { Index } = await import("./pages");

              // Hard-coded error simulating error fetching a chunk from the server
              throw new Error("failed to fetch chunk");
              return { Component: Index };
            }
          }
        ]
      }
    ]
  }
];

When could this happen?

As mentioned in the repro steps, this problem happens in production due to Cascading Cache Invalidation:

1. I deploy app to production
2. A user uses app, but doesn't navigate to lazy-loaded chunk (thus, never fetched and cached by the server)
3. I deploy a new version of app to production, overwriting the previous files
4. The same user in the same session navigates to lazy-loaded chunk
5. Lazy-loaded chunk fails to fetch because the production hash doesn't match the new deployment from step 3

Expected Behavior

errorElement is rendered.

Actual Behavior

Generic React error page is rendered.

[brophdawg11]

This should be fixed in 6.10.0 👍