TypeError: Cannot read properties of undefined (reading 'getElementById')

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 package are you using?

@sentry/nextjs

SDK Version

7.12.0

Framework Version

"next": "12.2.5"

Link to Sentry event

No response

Steps to Reproduce

1. Install Next.JS
2. Use next js edge functions
3. See sentry error on server

Expected Result

Zero errors

Actual Result

TypeError: Cannot read properties of undefined (reading 'getElementById')
    at node_modules/@sentry/nextjs/esm/performance/client.js:22:26
    at node_modules/@sentry/nextjs/esm/performance/client.js:94:54
    at node_modules/@sentry/tracing/esm/browser/browsertracing.js:99:0
    at node_modules/@sentry/core/esm/integration.js:64:0
    at <anonymous>
    at node_modules/@sentry/core/esm/integration.js:60:0
    at node_modules/@sentry/core/esm/baseclient.js:217:27
    at node_modules/@sentry/hub/esm/hub.js:65:0
    at node_modules/@sentry/core/esm/sdk.js:32:0
    at node_modules/@sentry/browser/esm/sdk.js:110:2
    at node_modules/@sentry/react/esm/sdk.js:18:2
    at node_modules/@sentry/nextjs/esm/index.client.js:31:2
    at sentry.server.config.ts:8:0
    at webpack/bootstrap:21:0
    at node_modules/react/index.js:4:2
    at node_modules/react/index.js:4:2
    at webpack/runtime/jsonp chunk loading:34:0
    at api/github:middleware.js:1:17

Link to CODE

[wconnorwalsh]

I had the same issue: sentry.client.config.js and/or sentry.server.config.js erroneously bundling with experimental-edge functions.

The root cause is obviously #5611 – and I am not familiar with the internals of the withSentryConfig Next.js webpack plugin – but is it possible that it is bundling the Sentry code in every API handler, even if it is marked as experimental-edge?

Here is a temporary workaround for anyone else stuck. This will exclude the Sentry code in any edge functions.

// next.config.js

const config = {
 webpack: (config, options) => {
    if (options.isServer && options.nextRuntime === 'edge') {
      config.resolve.alias = {
        ...config.resolve.alias,
        './sentry.client.config.js': false,
        './sentry.server.config.js': false,
      }
    }
    return config
  }
}

module.exports = withSentryConfig(config)

[lobsterkatie]

I know sentry, doesn’t “have the best support for Vercel’s Edge Runtime” #5667 (comment), but there should be at least a way to ignore it for now.

Ask and you shall receive, @l1qu1d. 🙂 It happens I just merged this today: https://github.com/getsentry/sentry-javascript/pull/6207.

I’m going to close this for now, but if y’all are still having issues once that PR is released (in 7.20), please let us know.