Not possible to configure `onError`

[luchsamapparat]

Hi,

I noticed that my custom error logging wasn't working for errors thrown from within the React Router app. From what I can see it is currently not possible to use onError properly.

createHonoServer initializes a new Hono instance (see here):

  const reactRouterApp = new Hono<E>({
    strict: false,
  });

Since no error handler is configured, this instance has Hono's default error handler (see here).

The reactRouterApp is then configured as route handler:

 app.route(`${basename}`, reactRouterApp);

app.route(...) checks if the reactRouterApp's errorHandler is the default error handler (which it is) and then adopts that (see here):

    app.routes.map((r) => {
      let handler
      if (app.errorHandler === errorHandler) { // 👈 here
        handler = r.handler
      } else {
        handler = async (c: Context, next: Next) =>
          (await compose([], app.errorHandler)(c, () => r.handler(c, next))).res
        ;(handler as any)[COMPOSED_HANDLER] = r.handler
      }

      subApp.#addRoute(r.method, r.path, handler)
    })

Can you provide a way to configure onError for the reactRouterApp as well? Maybe just adopt the errorHandler from the app that can be passed into createHonoServer? That's at least how I expected it to work.

Apart from that, thanks for the great work with this library!

[hilja]

I have a need for this too. I’m authing the user in a WebSocket endpoint and if I throw an exception I get back 400 and not 401.

Maybe I'm holding it wrong, there's very little docs around error handling.

pnpm dlx wscat -c ws://localhost:3000/ws
error: Unexpected server response: 400

const socketAuth = createMiddleware(async (c, next) => {
  try {
    const userId = await requireUserId(c.req.header('Cookie'))
    c.set('userId', userId)
    await next()
  } catch {
    const errorRes = new Response('Unauthorized', { status: 401 })
    throw new HTTPException(401, { res: errorRes })
  }
})

app.get(
  '/ws',
  socketAuth,
  upgradeWebSocket(c => {
    onOpen() {
      // Do stuff...
      console.log(c.get('userId'))
    }
  }
)

Great package though, thanks for maintaining it!

[rphlmr]

Hello there 👋

I will try to take a look this weekend. I think I have the same issue at work 😅

[rphlmr]

I try to bind onError to reactRouterApp, but all errors thrown in React Router are caught internally and returned as raw HTML or a turbo-stream response (Single Fetch API).

2 points:
• React Router has a handleError hook in entry.server to log unexpected errors.
• The current implementation of React Router Hono Server allows you to bind onError to a custom app instance you can provide as a parameter. This catches all errors outside of React Router.

If you know a specific case I can reproduce, let me know.

[hilja]

React Router Hono Server allows you to bind onError to a custom app instance you can provide as a parameter. This catches all errors outside of React Router.

That's great! This should solve my issue, let me try.

[hilja]

Custom app instance is a game-changer.

When testing with pnpm dlx wscat -c ws://localhost:3000/ws it still returns 400, but I think it's hard-coded in @hono/node-ws, which is fine.