Transaction starts after beforeEach is resolved when vueRouterInstrumentation is present #4072
Description
- Review the documentation: https://docs.sentry.io/
- Search for existing issues: https://github.com/getsentry/sentry-javascript/issues
- Use the latest release: https://github.com/getsentry/sentry-javascript/releases
Package + Version
-
@sentry/vue: 6.13.3 -
@sentry/tracing: 6.13.3
Version:
@sentry/vue: 6.13.3
@sentry/tracing: 6.13.3
Description
I have an XHR request on the beforeEach hook of Vue Router.
When vueRouterInstrumentation is enabled pageload or navigation transaction starts after beforeEach resolved, causing the the XHR requests in beforeEach to NOT have sentry-trace header.
When vueRouterInstrumentation is disabled, then pageload transaction starts before beforeEach and the request has the sentry-trace header present as expected.
But then when navigated to a new page, navigation transaction again starts after beforeEach causing requests to not be included in the transaction..
So it seems like using vueRouterInstrumentation takes some things away while adding some other things..
Is this the intentional/expected behaviour, I'm not sure and if so, what would you suggest to solve this?
For example wouldn't it be possible to start the navigation transaction on the beforeEach hook?
Eventually my goal is to have all my api calls traced. I've to say I'm a bit surpised that automatic instrumentation does not pick up individual xhr requests unless there is an active transaction.
Here's sandbox
https://codesandbox.io/s/sentry-tracing-beforeeach-7j8g6?file=/src/main.js
Thanks!
Update:
Noticed here transaction is already being started on beforeEach hook.
https://github.com/getsentry/sentry-javascript/blob/master/packages/vue/src/router.ts#L36
Is this the result of a merge strategy behaviour?