Sentry-javascript: How to log exceptions (`captureException`) to console too

we wrapped captureException for that reason:

function captureException(...args) {
    if (typeof Sentry !== 'undefined') {
        Sentry.captureException(...args);
    }
    else {
        console.error(...args);
    }
}

I would say the best approach would the use beforeSend
```js
Sentry.init({
dsn: "DSN",
beforeSend: event => {
if (IS_DEBUG) {
console.error(event);
return null; // this drops the event and nothing will be send to sentry
}
return event;
}
});

What I don't like about using beforeSend is that I don't get the original error object. But thanks for the reply.

@gaastonsr you do as the second argument :) https://docs.sentry.io/learn/filtering/?platform=browser#before-send

Sentry.init({
  dsn: "DSN",
  beforeSend: (event, hint) => {
   if (IS_DEBUG) {
     console.error(hint.originalException || hint.syntheticException);
     return null; // this drops the event and nothing will be sent to sentry
   }
   return event;
  }
});

Omg, this changes everything! thanks, @kamilogorek.

It took me 30 minutes to find why my console wasn't logging errors. This should be easier to do.

The problem here is that if we'd log it by default, we'd also capture it as a breadcrumb by default. And we already do this for capture errors. Thus it'd create duplicate entries.
Although my ears are fully opened for the feedback and if someone has any idea how to improve this docs part, I'd be more than glad to include it :)

The problem here is that if we'd log it by default, we'd also capture it as a breadcrumb by default. And we already do this for capture errors. Thus it'd create duplicate entries.
Although my ears are fully opened for the feedback and if someone has any idea how to improve this docs part, I'd be more than glad to include it :)

It's really unexpected behavior that sentry catches errors and does not show them in console!
I also spent an hour discovering why my app does not work although console is clear.
This definitely should be changed.

I think you can filter out error from breadcrumb on server side.
Or maybe log it to console in setTimeout callback, so breadcrumbs will already be captured. As I currently do:

Sentry.init({
  dsn: 'DSN',
  beforeSend: (event, hint) => {
    setTimeout(() => console.error(hint.originalException || hint.syntheticException), 0);
    return event;
  }
});

@vitalets it has been changed in 5.9.0. You'll see errors in the console now as well.

@vitalets it has been changed in 5.9.0. You'll see errors in the console now as well.

@kamilogorek
It does not work for me on sentry/browser 5.9.1 (chrome 78, osx).
Here are the code:

Sentry.init({  dsn: 'dsn' });
setTimeout(() => {throw new Error('abc')}, 3000);

The console is empty. Network tab shows that error was sent to sentry.

Without sentry error is shown:

// Sentry.init({  dsn: 'dsn' });
setTimeout(() => {throw new Error('abc')}, 3000);

it logs for captureException not for capture event :
To log captureEvent and captureException we slightly modified the @kamilogorek 's solution :

Sentry.init({
  dsn: "DSN",
  beforeSend: (event, hint) => {
   if (IS_DEBUG) {
     console.error(hint.originalException || hint.syntheticException || event);
     return null; // this drops the event and nothing will be sent to sentry
   }
   return event;
  }
});

@kamilogorek is it the default for the @sentry/node package too? I have the 5.9.0 version and I see the beforeSend function being called but I don't see anything logged in the console.

I also see no errors on console with 5.10.1. Logging would be enough if debug is set to true.

This is what happens when you don't read specs to the very end...

https://html.spec.whatwg.org/multipage/webappapis.html#the-event-handler-processing-algorithm

If special error event handling is true
If return value is true, then set event's canceled flag.
Otherwise
If return value is false, then set event's canceled flag.

And then you scroll...

There are two exceptions in the platform, for historical reasons:
The onerror handlers on global objects, where returning true cancels the event

I'll update the code accordingly

This is what happens when you don't read specs

Nobody reads specs to the very end :)

Thank you for the fix!

If I am reading this thread correctly then the current release of sentry should show errors in the console while also sending them to the sentry dashboard. I am not experiencing this behavior.

Here is how I am loading sentry into my page:

<script src="https://browser.sentry-cdn.com/5.20.1/bundle.min.js" integrity="sha384-O8HdAJg1h8RARFowXd2J/r5fIWuinSBtjhwQoPesfVILeXzGpJxvyY/77OaPPXUo" crossorigin="anonymous"></script>
<script src="https://browser.sentry-cdn.com/5.20.1/vue.min.js" crossorigin="anonymous"></script>

Here is my initialization call:

  Sentry.init({
    dsn: 'https://_________.ingest.sentry.io/___________',
    integrations: [new Sentry.Integrations.Vue({Vue, attachProps: true})],
  });

I've added the following error producing line:

 window.undef.undef += 1;

When I load the page and trigger the error line nothing shows up in the console, but I do see the error in the sentry dashboard. If I comment out the Sentry.init call then I see a TypeError in the js console.

I expected based off my reading of this thread that I would see the error in the js console while also logging it to the sentry dashboard. Is that not correct? Do I still need to use the beforeSend hook?

I realize now that I need to pass logErrors: true to the Integrations.Vue call:

new Sentry.Integrations.Vue({Vue, attachProps: true, logErrors: true}

Sorry, I should have read the docs more closely!