Sentry-javascript: How to disable user feedback or globally configure it?

Created on 26 Jun 2019  路  7Comments  路  Source: getsentry/sentry-javascript

Similar to this thread which was started by another user 2 months ago.
https://forum.sentry.io/t/disable-automatic-user-feedback-without-loosing-default-integrations/6640

Is there a way I can disable user feedback prompt?
or customize its text globally?

I am using "@sentry/browser": "^5.4.0" and Angular.

Thanks

Most helpful comment

@nawlbergs it's part of Sentry's Angular Error Handler example. You have to remove this line:
// Optionally show user dialog to provide details on what happened. Sentry.showReportDialog({ eventId });

All 7 comments

Is there a way I can disable user feedback prompt?

It's never shown automatically, so you have to call Sentry.showReportDialog yourself in order to show it in the first place.

customize its text globally

https://docs.sentry.io/enriching-error-data/user-feedback/?platform=browser#customizing-the-widget

Yes, showReportDialog method accepts ReportDialogOptions https://github.com/getsentry/sentry-javascript/blob/de9b23ac9b22284dca4e55d33678edb447180a49/packages/browser/src/client.ts#L11-L33

im not calling it.. but its showing up for me... (i didnt even know it was a thing)

image

@nawlbergs it's not possible for report dialog to show by itself. There's not a single invocation of this code in our codebase. It has to be called somewhere manually.

@nawlbergs it's part of Sentry's Angular Error Handler example. You have to remove this line:
// Optionally show user dialog to provide details on what happened. Sentry.showReportDialog({ eventId });

this is what you were looking for, with this example (in the oposite way) you can disable this dialog on Angular2+

https://docs.sentry.io/platforms/javascript/guides/angular/#automatically-send-errors-with-errorhandler

In React, I'm using one Sentry.ErrorBoundary to wrap the whole app.

I am trying to stop the report dialog from automatically appearing because I want to conditionally use showReportDialog function in beforeSend handler.

I have tried omitting showDialog property:

        <Sentry.ErrorBoundary
          fallback={<FallbackComponent />}
        >

I have also tried setting showDialog to false explicitly:

        <Sentry.ErrorBoundary
          showDialog={false}
          fallback={<FallbackComponent />}
        >

But the dialog always appears.

This is my Senty.init:

  Sentry.init({
    dsn: env('SENTRY_DSN'),
    release: `perseus-pwa@${env('VERSION')}`,
    environment: env('ENV'),
    beforeSend: (event, hint) => {
      const error = hint.originalException
      if (error?.name === 'ChunkLoadError') {
        log.info('Sentry sees ChunkLoadError')
      } else {
        Sentry.showReportDialog({
          eventId: event.event_id,
          title: 'Something went wrong.',
          subtitle: 'It might be your internet connection. Please tell what you did before this happened.',
          successMessage: 'Your feedback has been sent. Thank you!'
        })
      }
    },
    integrations: [
      new Integrations.BrowserTracing()
    ],
    // We recommend adjusting this value in production, or using tracesSampler
    // for finer control
    tracesSampleRate: env('ENV') === 'production' && 1.0
  })

Have been using Safari in iOS 14, and Chrome 87 in MacOS.

    "@sentry/react": "^5.27.2",
    "@sentry/tracing": "^5.27.2"

I worked around this by removing the beforeSend handler from Sentry.init and using a dynamically-rendered fallback component in the error boundary:
```
fallback={({ error, componentStack, resetError }) => {
let reloadLabel = 'Reload App.'
if (error?.name === 'ChunkLoadError') {
reloadLabel = 'Sorry to interrupt, we need you to upgrade to the new version of this app. Please tap here.'
} else {
Sentry.showReportDialog({
eventId: event.event_id,
title: 'Something went wrong.',
subtitle: 'It might be your internet connection. Please tell what you did before this happened.',
successMessage: 'Your feedback has been sent. Thank you!'
})
}
return (

Icon={ReloadIcon}
text={reloadLabel}
onClick={window.location.reload.bind(window.location)}
/>

)
}}
>
...

Angular:

{
      provide: ErrorHandler,
      useValue: Sentry.createErrorHandler({
        showDialog: false,
      }),
    },
Was this page helpful?
0 / 5 - 0 ratings

Related issues

grigored picture grigored  路  3Comments

simllll picture simllll  路  3Comments

kishor-bhatt picture kishor-bhatt  路  3Comments

kamilogorek picture kamilogorek  路  3Comments

jaylinski picture jaylinski  路  3Comments