wrapSentryHandleRequest type mismatch with React Router middleware

[wong2]

Is there an existing issue for this?

• I have checked for existing issues https://github.com/getsentry/sentry-javascript/issues
• I have reviewed the documentation https://docs.sentry.io/
• I am using the latest SDK release https://github.com/getsentry/sentry-javascript/releases

How do you use Sentry?

Sentry Saas (sentry.io)

Which SDK are you using?

@sentry/react-router

SDK Version

10.14.0

Framework Version

React Router 7.9.1

Link to Sentry event

No response

Reproduction Example/SDK Setup

No response

Steps to Reproduce

I'm using wrapSentryHandleRequest to wrap my handler:

async function handleRequest(
  request: Request,
  responseStatusCode: number,
  responseHeaders: Headers,
  entryContext: EntryContext,
  routerContext: RouterContextProvider,
) {
  ...
}

export default wrapSentryHandleRequest(handleRequest)

Expected Result

No type error

Actual Result

Type error:

Argument of type '(request: Request, responseStatusCode: number, responseHeaders: Headers, entryContext: EntryContext, routerContext: RouterContextProvider) => Promise<...>' is not assignable to parameter of type 'OriginalHandleRequest'.
  Types of parameters 'routerContext' and 'loadContext' are incompatible.
    Type 'AppLoadContext' is missing the following properties from type 'RouterContextProvider': #private, get, setts(2345)

Additional Context

When the v8_middleware future flag is enabled, RouterContextProvider should be used instead of AppLoadContext

_{Tip: React with 👍 to help prioritize this issue. Please use comments to provide useful context, avoiding +1 or me too, to help us triage it.}

[linear]

JS-967 wrapSentryHandleRequest type mismatch with React Router middleware

[andreiborza]

Hi @wong2, thanks for filing this.

@chargome could you please take a look?

[github-actions]

A PR closing this issue has just been released 🚀

This issue was referenced by PR #17758, which was included in the 10.16.0 release.

[wong2]

@chargome Unfortunately this doesn't fix it, get new error:

Argument of type '(request: Request, responseStatusCode: number, responseHeaders: Headers, entryContext: EntryContext, routerContext: RouterContextProvider) => Promise<...>' is not assignable to parameter of type 'OriginalHandleRequest'.
  Types of parameters 'routerContext' and 'loadContext' are incompatible.
    Type 'RouterContextProvider | AppLoadContext' is not assignable to type 'RouterContextProvider'.
      Type 'AppLoadContext' is missing the following properties from type 'RouterContextProvider': #private, get, setts(2345)

[chargome]

Hm can you give me an exact snippet where you run into this?

[wong2]

@chargome

1. Clone this repo: https://github.com/sergiodxa/react-router-i18next-example
2. Add @sentry/react-router
3. Add export default wrapSentryHandleRequest(handleRequest) in entry.server.tsx