We use the amazing Sentry tool to track both our frontend and backend errors. It’s pretty straighforward to setup Sentry for code that runs in the browser, and it captures all uncatched errors out of the box:

Raven.config('[our key]', {
    collectWindowErrors: true,
    fetchContext: true,
    linesOfContext: 40
  }).install();

  

Easy. But recentenly we switched from AngularJS to ReactJS as our framework of choice, and we use React Starter Kit as a starting point. When an error is thrown during the Reat lifecycle it looks something likes this:

Unhandled promise rejection TypeError: Cannot read property 'setState' of undefined
  

Aj. This is an async error, and Sentry does not automatically log this error. It turns out they rely heavily on promises (using ES6 Promise and it looks like they do not really handle these errors nicely. I did some heavily googlin’ on this subject, but I could not find a proper in-framework solution to catch these errors.

The only solution that works for us is to override the error method of console and call Sentry from there.

var originalConsoleError = console.error;
  console.error = function(message, error) {
    Raven.captureException(error);
    originalConsoleError.apply(this, arguments)
  }
  

I can’t imagine this is really the way to go, but for now it works. I wonder if there is a better way to handle these async errors..