Raven.captureException() not capturing metadata

Do you want to request a feature or report a bug?

Bug

What is the current behavior?

With this code:

Raven.config(sentryUrl, {tags: {test0: 'test'}}).install();

  Raven.setUserContext({
           test1: 'test',
        });
        Raven.setTagsContext({ test2:'test' });
        Raven.setExtraContext({  test3:'test' });
        Raven.captureException(err.reason, { logger: 'my.module', extra: 'extra', tags: { test4:'test' } });
 Raven.captureMessage(err.reason, { level: 'warning', extra: 'extra', tags: { test5:'test' } });

A warning and an error are logged. The warning has all the specified meta data, the error only test0.

What is the expected behavior?

That captureException captures the same metadata, the same way as captureMessage.

Which versions of Raven.js, and which browser and OS are affected by this issue? Are you using the CDN (http://ravenjs.com)?

I used both raven-js version 3.23.1 with webpack and <script src="https://cdn.ravenjs.com/3.23.1/raven.min.js" crossorigin="anonymous"></script>

Tested on Chrome Version 64.0.3282.186 on Windows 10

Did this work in previous versions of Raven.js? Don’t know, first time user.

Are you using hosted Sentry or on-premises? If on-premises, which version (e.g. 8.7.0)? Using https://sentry.io (paid account)

[kamilogorek]

@wwwouter two things. Make sure that your actual ErrorBoundry is catching what it should (eg. don’t trigger error from the same component that implements it - it won’t work).

However, more important is that React does bubble all the errors in development mode and this is what happens in your case.

The first event, that doesn’t have tags is triggered using global error handler and only second one is yours. It took me a while to debug as it’s not obvious, but this is how React works. It doesn’t happen in production.

const BadComponent = () => {
  throw new Error("BadComponent");
};

class ErrorBoundary extends React.Component {
  componentDidCatch(error) {
    Raven.captureException(error, {
      tags: {
        something: "awesome"
      }   
    }); 
    Raven.captureException(new Error("foo"), {
      tags: {
        something: "awesome"
      }   
    }); 
  }

  render() {
    return this.props.children;
  }
}

ReactDOM.render(
  <ErrorBoundary>
    <BadComponent />
  </ErrorBoundary>,
  document.getElementById("main")
);

Here are two screenshots of the output

Development

Production

Hope it helps.

[wwwouter]

🥇 Thanks for the detailed explanation!