Sentry-javascript: Option to remove all default error handlers

[Ashish-Bansal]

• [x] Review the documentation: https://docs.sentry.io/
• [x] Search for existing issues: https://github.com/getsentry/sentry-javascript/issues
• [x] Use the latest release: https://github.com/getsentry/sentry-javascript/releases

Package + Version

• [x] @sentry/browser
• [ ] @sentry/node
• [ ] raven-js
• [ ] raven-node _(raven for node)_
• [ ] other:

Version:

4.1.1

Description

I have integrated by react application with @sentry/browser. I have a wrapper component for handling crashes in which all the exceptions from componentDidCatch are sent to Sentry using captureException utility method. I want that only errors which I report using Sentry.captureException come up in my sentry. Basically I want to disable all the sentry handlers which are responsible for catching errors. I tried removing GlobalHandlers and ReportingObserver integrations but I still get lot of noise in sentry.

Is there any way to disable them up ?

e.g. this happened in the inline script of specific HTML page i.e. outside of my react app.

[kamilogorek]

but I still get lot of noise in sentry

What exactly?

Is there any way to disable them up ?

You did exactly how it should be done:

init({
  dsn: 'DSN',
  integrations: function (integrations) {
    return integrations.filter(i => {
      return i.name !== 'GlobalHandlers' && i.name !== 'ReportingObserver';
    })
  }
})

or just

init({
  dsn: 'DSN',
  defaultIntegrations: false
})

If you want to disable all of them.

[Ashish-Bansal]

      integrations: [
        new Sentry.Integrations.Dedupe(),
        new Sentry.Integrations.FunctionToString(),
        new Sentry.Integrations.InboundFilters(),
        new Sentry.Integrations.Breadcrumbs(),
        new Sentry.Integrations.LinkedErrors(),
        new Sentry.Integrations.UserAgent(),
        new Sentry.Integrations.ReportingObserver({
          types: ['crash'],
        }),
      ],

In my last release, my integrations looks like this. If I understand correctly, only integrations(from above given ones) which actually sends the error reports to the Sentry is ReportingObserver and others just add metadata, is that correct ?

[Ashish-Bansal]

What exactly?

I have just cleared old release's events to clear up confusions. In the latest release with above configuration, this event shouldn't have occurred since it is not sent by us manually (as it's outside of our react app).

[kamilogorek]

Correct, however, those are "additional integrations", defaults are always installed, unless you pass defaultIntegrations: false.

[kamilogorek]

It's always better to filter-out unwanted defaults instead of overriding them all. This way, you'll get any new defaults if we add some in new releases without doing anything.

In your case it'd be:

init({
  dsn: 'DSN',
  integrations(integrations) {
    // get all integrations
    return integrations
      // remove `GlobalHandlers`
      .filter(i => i.name !== 'GlobalHandlers')
      // override `ReportingObserver` with custom config
      .concat(new Sentry.Integrations.ReportingObserver({
        types: ['crash'],
      }))
  }
})

[Ashish-Bansal]

Correct, however, those are "additional integrations", defaults are always installed, unless you pass defaultIntegrations: false.

Ah I see. I'll give it a shot with defaultIntegrations: false and then specifying integrations manually.

It's always better to filter-out unwanted defaults instead of overriding them all. This way, you'll get any new defaults if we add some in new releases without doing anything.

cool, thanks!

[Ashish-Bansal]

Ah I see. I'll give it a shot with defaultIntegrations: false and then specifying integrations manually.

Yes it seems to fix the issue.

It's always better to filter-out unwanted defaults instead of overriding them all. This way, you'll get any new defaults if we add some in new releases without doing anything.

Though with defaultIntegrations: false, additional integrations passed to that function will also become empty. So, I have to initiate all of them manually but still that's manageable.

Thanks!

[kamilogorek]

@Ashish-Bansal

init({
  dsn: 'DSN',
  integrations(integrations) {
    // get all integrations
    return integrations
      // remove `GlobalHandlers`
      .filter(i => i.name !== 'GlobalHandlers')
      // override `ReportingObserver` with custom config
      .concat(new Sentry.Integrations.ReportingObserver({
        types: ['crash'],
      }))
  }
})

on itself will be sufficient, as it gets all default integrations as an argument, so you dont have to defaultIntegration:false if you use function instead of an array.

[Ashish-Bansal]

Ah I see. I think parameters are quite ambiguous.

defaultIntegrations parameter shouldn't exist at all. Just integrations should be enough.
If empty array is passed as integrations, then that should mean that all the integrations are disabled.
If array [foo, bar] is passed as integrations , only those two integrations should be enabled.
If function is specified for integrations, then it should just exhibit current behaviour.

Though I know these changes won't be possible now because of backward compatibility issues, but still wanted to share my feedback. :)

Thanks for the help!

[kamilogorek]

We were thinking about an approach like this but came to the conclusion that the most common scenario is adding some integrations on top of defaults (eg. some JS framework integration), therefore this should be the easiest to express. integrations: [new SomeIntegration()] is the most straightforward way and allows us to add more defaults in the future.
If we'd go with integrations: [] == no integrations at all, a lot of users could miss out on new Sentry features, where defaultIntegrations: false is very explicit, and usually used only for bundled, stand-alone instances, like own error-reporter for embedded widgets etc.

Thanks for comments anyway, always appreciate a good feedback! :)

[rajatdhoot123]

What if I want to remove only intervention

init({
  dsn: 'DSN',
  integrations: [new Sentry.Integrations.ReportingObserver({ types: ['crash','deprecation'] })]
});

[kamilogorek]

That's exactly how you do this.