Inertia init Sentry

[christianschoenmakers]

Last reply in issue getsentry/sentry#32246

Sentry Logger [Log]: Integration installed: InboundFilters
app.js?id=b8cdcdb7d93649f7781b:2 Sentry Logger [Log]: Integration installed: FunctionToString
app.js?id=b8cdcdb7d93649f7781b:2 Sentry Logger [Log]: Integration installed: TryCatch
app.js?id=b8cdcdb7d93649f7781b:2 Sentry Logger [Log]: Integration installed: Breadcrumbs
app.js?id=b8cdcdb7d93649f7781b:2 Sentry Logger [Log]: Integration installed: GlobalHandlers
app.js?id=b8cdcdb7d93649f7781b:2 Sentry Logger [Log]: Integration installed: LinkedErrors
app.js?id=b8cdcdb7d93649f7781b:2 Sentry Logger [Log]: Integration installed: Dedupe
app.js?id=b8cdcdb7d93649f7781b:2 Sentry Logger [Log]: Integration installed: UserAgent
app.js?id=b8cdcdb7d93649f7781b:2 Sentry Logger [Warn]: Misconfigured SDK. Vue specific errors will not be captured.
Update your `Sentry.init` call with an appropriate config option:
`app` (Application Instance - Vue 3) or `Vue` (Vue Constructor - Vue 2).

It looks like the VM variable I am passing its not being detected as a Vue3 app only in production? hmm..

Originally posted by @fershopls in getsentry/sentry#32246 (comment)

Code provided by @fershopls:

createInertiaApp({
    title: (title) => `${title} - ${appName}`,
    resolve: (name) => require(`./Pages/${name}.vue`),
    setup({ el, app, props, plugin }) {
        const vm = createApp({ render: () => h(app, props) });
        
        console.log("sentry");
        Sentry.init({
            vm,
            dsn: "MY-DSN",
            // Set tracesSampleRate to 1.0 to capture 100%
            // of transactions for performance monitoring.
            // We recommend adjusting this value in production
            tracesSampleRate: 1.0,
            logErrors: true,
        });

        vm.use(plugin)
            .use(UtilsInstaller)
            .mixin({ methods: { route } });

        // Use global components
        RegisterGlobalComponents(vm);

        vm.config.unwrapInjectedRef = true;

        vm.mount(el);
    },
});

[christianschoenmakers]

@fershopls I've created a new issue because the original one (#32246) is closed and locked.

The issue is, Sentry expects the first variable to be app. But, that's not possible in Inertia because it's provided by the setup function.

Therefore, you must register the Sentry.init in the following way:

        Sentry.init({
            app: vm,
            dsn: "MY-DSN",
            // Set tracesSampleRate to 1.0 to capture 100%
            // of transactions for performance monitoring.
            // We recommend adjusting this value in production
            tracesSampleRate: 1.0,
            logErrors: true,
        });

I took some time for me to figure out, but it's working now on my end.

[getsentry-release]

Routing to @getsentry/team-web-sdk-frontend for triage. ⏲️