Cannot throw/return a 404 from middleware

[bravo-kernel]

I'm using React Router as a...

framework

Reproduction

// in a middleware
return data("Nice Not Found", {
    status: 404
})

Should bubble up to the ErrorBoundary, if I understood correctly, but does not.

Details explained by @brophdawg11 in this Discord chat https://discordapp.com/channels/770287896669978684/770287896669978687/1375107748794208337

System Info

- Windows
- "node": "22.13.0"
- "react-router": "^7.6.0",

Used Package Manager

npm

Expected Behavior

See "Nice Not Found" with theming etc.

Actual Behavior

Shows a plain white page with only the text "Nice Not Found"

[jezikk]

I think it should be defined how to correctly return response from middleware. Because returning data using data function cause error if it is called using fetch and returning data using Response.json() cause error if it is called using fetcher. There should be some method which will cover both cases.

[rururux]

I've done a quick investigation into this issue and found that if a Response or data is thrown, it's handled by the errorHandler which is the fourth argument of the runMiddlewarePipeline function, starting from the line below:

react-router/packages/react-router/lib/router/router.ts

Line 3562 in c06ec85

let response = await runMiddlewarePipeline(

If a Response is thrown, it's returned as is by if (isResponse(error)) { return error; }. However, if data is thrown, the statusCode is set to 500 in the following line:

react-router/packages/react-router/lib/router/router.ts

Line 3649 in c06ec85

statusCode: isRouteErrorResponse(error) ? error.status : 500,

[rururux]

I've created a repository for investigation:
https://github.com/rururux/react-router-issue-13659

[jezikk]

You should add an action to each route and next fetch data using useFetcher or fetch function.

[rururux]

I understand your point regarding how to correctly return responses from middleware.
However, my primary goal for creating this repository was to investigate the "404 response handling" as stated in the title of this issue.
I believe discussing how to handle this with action or useFetcher might be better suited for a separate issue.

[jezikk]

@rururux I think it is the same issue. Look at this example: https://github.com/jezikk/rr-middleware-fetching

If middlewares are commented fetching works correctly for both use cases.