• Review the documentation: https://docs.sentry.io/
• Search for existing issues: https://github.com/getsentry/sentry-javascript/issues
• Use the latest release: https://github.com/getsentry/sentry-javascript/releases
• Provide a link to the affected event from your Sentry account

Package + Version

• @sentry/browser
• @sentry/integrations

Version:

@sentry/browser: 6.2.5
@sentry/integrations: 6.2.5

Description

We are using the Sentry BrowserClient as follows:

import Vue from "vue";
import * as Sentry from "@sentry/browser";
import { Vue as VueIntegration } from "@sentry/integrations";

const sentryClient = new Sentry.BrowserClient({
    dsn: "blah",
    integrations: [
        ...Sentry.defaultIntegrations,
        new VueIntegration({
            Vue,
            attachProps: true,
            logErrors: true
        })
    ],
});
const sentryHub = new Sentry.Hub(sentryClient);

// For non-Vue errors we can capture manually by doing this
this.sentryHub.run((sentryHub) => sentryHub.captureException(error))

// However we don't get the automatic error handling/reporting VueIntegration should be providing

We understand that the VueIntegration is designed to hook into the Vue.config.errorHandler and automatically report errors out as they arise. We did some debugging, and can confirm that the errorHandler is properly attaching itself.

However when an error is handled by this function, it never actually gets sent out to the Sentry. The root cause appears to be an issue with the getCurrentHub() not containing the Vue integration (this check fails).

Using BrowserClient directly like this (as opposed to Sentry.init) is important to our microfrontend architecture where teams own smaller parts of a single page (sometimes even using different technologies: Vue, React, etc.). Having a way to report out errors to different dsns is a requirement for us. And we would love to be able to use the Vue Integration (and other technologies) too!