TypeError: Cannot read property 'pathname' of undefined

[wwwtony5488]

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? If you use the CDN bundles, please specify the exact bundle (e.g. bundle.tracing.min.js) in your SDK setup.

@sentry/vue

SDK Version

7.43.0

Framework Version

VUE 3.2.45

Link to Sentry event

No response

SDK Setup

export const createApp = ViteSSG(
 App,
 { routes, base: import.meta.env.BASE_URL, scrollBehavior: () => {} },
 (ctx) => {
 Object.values(import.meta.glob<{ install: UserModule }>('./modules/*.ts', { eager: true }))
 .forEach(i => i.install?.(ctx))

 Sentry.init({
 App: ctx.app,
 dsn: import.meta.env.VITE_SENTRY_DSN,
 integrations: [
 new BrowserTracing({
 routingInstrumentation: Sentry.vueRouterInstrumentation(ctx.router),
 tracePropagationTargets: ['localhost', import.meta.env.VITE_SITE, /^\//],
 }),
 ],
 tracesSampleRate: 1.0,
 })

 ctx.app.use(Previewer)
 },
)

Steps to Reproduce

1. use template vitesse
2. setup Sentry SDK as above code
3. normally 'yarn build',
4. finished build phase but accompany with errors

Expected Result

Finished build without any error

Actual Result

UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'pathname' of undefined
 at /Users/chaochengkuo/repository/comics-vue/node_modules/@sentry/vue/cjs/router.js:31:39
 at BrowserTracing.setupOnce (/Users/chaochengkuo/repository/comics-vue/node_modules/@sentry/tracing/cjs/browser/browsertracing.js:94:5)
 at setupIntegration (/Users/chaochengkuo/repository/comics-vue/node_modules/@sentry/core/cjs/integration.js:96:17)
 at /Users/chaochengkuo/repository/comics-vue/node_modules/@sentry/core/cjs/integration.js:84:7
 at Array.forEach (<anonymous>)
 at Object.setupIntegrations (/Users/chaochengkuo/repository/comics-vue/node_modules/@sentry/core/cjs/integration.js:81:16)
 at BrowserClient.setupIntegrations (/Users/chaochengkuo/repository/comics-vue/node_modules/@sentry/core/cjs/baseclient.js:232:40)
 at Hub.bindClient (/Users/chaochengkuo/repository/comics-vue/node_modules/@sentry/core/cjs/hub.js:67:14)
 at Object.initAndBind (/Users/chaochengkuo/repository/comics-vue/node_modules/@sentry/core/cjs/sdk.js:35:9)
 at Object.init (/Users/chaochengkuo/repository/comics-vue/node_modules/@sentry/browser/cjs/sdk.js:118:8)
 at Module.init (/Users/chaochengkuo/repository/comics-vue/node_modules/@sentry/vue/cjs/sdk.js:44:11)
 at file:///Users/chaochengkuo/repository/comics-vue/.vite-ssg-temp/main.mjs:5024:12
 at createApp$1 (file:///Users/chaochengkuo/repository/comics-vue/node_modules/vite-ssg/dist/index.mjs:51:15)
 at build (file:///Users/chaochengkuo/repository/comics-vue/node_modules/vite-ssg/dist/shared/vite-ssg.4a3d00bb.mjs:998:28)
 at async Object.handler (file:///Users/chaochengkuo/repository/comics-vue/node_modules/vite-ssg/dist/node/cli.mjs:29:5)
(Use `node --trace-warnings ...` to show where the warning was created)
(node:67269) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 3)

[mydea]

Hi @wwwtony5488,

thanks for reporting this.
It seems we rely on window.location always being present, which may not be the case when running in a SSR environment.

I opened a PR to guard against this case, so this should not error anymore: #7518

[AbhiPrasad]

@wwwtony5488 - Sentry.init when it is imported from a browser sdk like @sentry/vue is not meant to be run on the server.

You should use import.meta.env.SSR to conditonally initialize Sentry so it only runs on the client.

export const createApp = ViteSSG(
 App,
 { routes, base: import.meta.env.BASE_URL, scrollBehavior: () => {} },
 (ctx) => {
 Object.values(import.meta.glob<{ install: UserModule }>('./modules/*.ts', { eager: true }))
 .forEach(i => i.install?.(ctx))

 // only run Sentry on the client
 if (!import.meta.env.SSR) {
 Sentry.init({
 App: ctx.app,
 dsn: import.meta.env.VITE_SENTRY_DSN,
 integrations: [
 new BrowserTracing({
 routingInstrumentation: Sentry.vueRouterInstrumentation(ctx.router),
 tracePropagationTargets: ['localhost', import.meta.env.VITE_SITE, /^\//],
 }),
 ],
 tracesSampleRate: 1.0,
 })
 }

 ctx.app.use(Previewer)
 },
)

[wwwtony5488]

@mydea
I'm glad I could be of help.

@AbhiPrasad
That's an another way, however the error didn't interrupt the building process, so I wouldn't revise the code. anyway thanks for reply!