Session replay

[PeteJStewart]

Does the model work with Sentry session replay?
If not, is there any plans to enable it?

I'd really like to use it on a project I use this model on, so would be up for helping out with the implementation if needed.

[dygaomarques]

Does the model work with Sentry session replay? If not, is there any plans to enable it?

I'd really like to use it on a project I use this model on, so would be up for helping out with the implementation if needed.

@PeteJStewart did you make it? Can share the code please?

[PeteJStewart]

I didn't as it was mentioned above that it can be done with customClientIntegration.
I haven't actually got round to doing that yet, but will share the code here when I do.

[nadar]

could someone please share code how to enable session replay? I don't get it running, this is what my nuxt.config looks like:

sentry: {
    dsn: '..........',
    publishRelease: false,
    sourceMapStyle: 'hidden-source-map',
    disableServerSide: true,
    clientConfig: {
      // This sets the sample rate to be 10%. You may want this to be 100% while
      // in development and sample at a lower rate in production
      replaysSessionSampleRate: 1,
      // If the entire session is not sampled, use the below sample rate to sample
      // sessions when an error occurs.
      replaysOnErrorSampleRate: 1.0,
      integrations: [new Sentry.Replay()],
      // Add native Sentry config here
      // https://docs.sentry.io/platforms/javascript/guides/vue/configuration/options/
      environment: process.env.NODE_ENV,
  }
}

[rchl]

Latest module version supports enabling Session Replays integration using the clientIntegrations option. See https://sentry.nuxtjs.org/guide/session-replay for more details.

[nadar]

I got this working (by accident? 😄) with the following code, i also tested the code from your link above previously and it did not work. This one works:

nuxt.config.js:

sentry: {
    dsn: '....,
    publishRelease: false,
    sourceMapStyle: 'hidden-source-map',
    disableServerSide: true,
    clientConfig: '~/sentry.config.js',
  }

client config is included as file, sentry.config.js:

import { showReportDialog, Replay } from '@sentry/vue'
export default function(context) {
  return {
    replaysSessionSampleRate: 1,
    replaysOnErrorSampleRate: 1.0,
    release: process.env.SENTRY_RELEASE,
    integrations: [new Replay()],
    environment: process.env.NODE_ENV,
  }
}

Is there a prefered way or are there any differences? @rchl Thanks anyway for helping 👍

[rchl]

The way explained in the documentation is preferred. Just make sure that you are using the latest version of the module.

[rchl]

The documentation had some typos that made it invalid. It should be good now after the fix from @ryan-cahill .

[nadar]

If i change the config according to the docs, i receive

WARN  Sentry clientIntegration "Replay" is not recognized and will be ignored.

when running nuxt dev and does not work anymore.

 sentry: {
    dsn: 'https://....',
    clientIntegrations: {
      Replay: {},
    },
    disableServerSide: true,
    clientConfig: '~/sentry.config.js',
  },

I am really sorry to bother you here, but it does not work according to the docs, at least for me. Mabye its because of disableServerSide but we do not use ssr. I use the following package versions:

"nuxt": "2.16.3",
"@nuxtjs/sentry": "7.1.13",
"@sentry/replay": "7.48.0",

[ezur1]

im getting this error
Multiple Sentry Session Replay instances are not supported
at new Replay (index.js:6863:1)
_
using
"nuxt": "^2.15.8",
"@nuxtjs/sentry": "^7.2.1",

nuxt.config.js

sentry: {
dsn: process.env.SENTRY_DSN_ID,
ignoreErrors: [
"Non-Error exception captured",
"Non-Error promise rejection captured",
],
attachCommits: true,
disableServerSide: true,
clientIntegrations: {
Replay: {},
ReportingObserver: false,
Vue: {
attachProps: true,
tracing: true,
tracingOptions: {
trackComponents: true,
},
},
},
tracing: {
tracesSampleRate: 1.0,
vueOptions: {
tracing: true,
tracingOptions: {
hooks: ["mount", "update"],
timeout: 2000,
trackComponents: true,
},
},
browserOptions: {},
},
config: {
trackComponents: true,
beforeSend(event, hint) {
// dont report cancelled requests
if (
event.category === "xhr" &&
event.data !== undefined &&
event.data.status_code !== undefined &&
event.data.status_code === 0
) {
return null;
}

    const error = hint.originalException;
    if (error && error.message) {
      // ignore fusioncharts paper error
      if (error.message.match(/'paper' of undefined/i)) {
        return null;
      }
    }

    return event;
  },
},
clientConfig: "~/sentry.config.js",

},

please help. thanks

[rchl]

Its enough to include Replay: {}, in clientIntegrations. You shouldn't initialize it yourself. There are instructions in this module's documentation.