getsentry / sentry-javascript

Official Sentry SDKs for JavaScript
https://sentry.io
MIT License
7.99k stars 1.57k forks source link

Ability to strip basename in trace url (without reactRouterV6BrowserTracingIntegration) #13468

Open frankkluijtmans opened 2 months ago

frankkluijtmans commented 2 months ago

Problem Statement

Currently, when integrating the reactRouterV6BrowserTracingIntegration in a react app it allows you to strip out the basename on your routes so they can be neatly grouped by routename. What I'm missing though is a way to do the same outside of the router context. In my example, one of the url's that I'm receiving is an auth callback and will have a different base URL based on the user account. This results in a lot of different trace groups for essentially the same app URL. I'd like it if we can also strip out this base URL outside of the router context. I'm creating this issue since there doesn't seem to be such an option with the current Sentry integrations.

Solution Brainstorm

An option, to strip out your app's basename regardless of router context.

lforst commented 2 months ago

Hi, from what I understand this is not a bad idea. Would you mind elaborating a bit further though (ideally with code examples) so that we are completely aligned on what this is about?

Nonetheless, we will put this on the backlog and can't guarantee work on this any time soon so if you feel like opening a PR, feel free to do so.

frankkluijtmans commented 2 months ago

@lforst thank you for the quick response! Let me elaborate a bit more:

Right now I'm using the reactRouterV6BrowserTracingIntegration integration like so:

Sentry.reactRouterV6BrowserTracingIntegration({
    useEffect,
    useLocation,
    useNavigationType,
    createRoutesFromChildren,
    matchRoutes,
    stripBasename: true,
}),

This makes sure we're grouping traces for each subroute properly. The stripBasename then ensures we strip out the baseUrl as intended. This works great, but only takes care of this within the router context.

The example I mentioned is about an auth callback we have within our app. The URL for this callback is constructed with some account specific details like:

/auth/accountName/orgName/callback

These are gonna be different everytime and won't end up getting grouped in traces. What I'm looking for is a config option (at the top level) that enables stripping the basename for any url.

I guess it would look something like this:

Sentry.init({
                stripBasename: true,
})