feat(nuxt): Automatically add BrowserTracing

dev-packages/e2e-tests/test-applications/nuxt-3/sentry.client.config.ts

@@ -5,5 +5,4 @@ Sentry.init({
   dsn: 'https://public@dsn.ingest.sentry.io/1337',
   tunnel: `http://localhost:3031/`, // proxy server
   tracesSampleRate: 1.0,
-  integrations: [Sentry.browserTracingIntegration()],
 });

packages/nuxt/src/client/sdk.ts

@@ -1,6 +1,11 @@
-import { init as initBrowser } from '@sentry/browser';
-import { applySdkMetadata } from '@sentry/core';
-import type { Client } from '@sentry/types';
+import {
+  type BrowserOptions,
+  browserTracingIntegration,
+  getDefaultIntegrations as getBrowserDefaultIntegrations,
+  init as initBrowser,
+} from '@sentry/browser';
+import { applySdkMetadata, hasTracingEnabled } from '@sentry/core';
+import type { Client, Integration } from '@sentry/types';
 import type { SentryNuxtOptions } from '../common/types';
 
 /**
@@ -10,10 +15,26 @@ import type { SentryNuxtOptions } from '../common/types';
  */
 export function init(options: SentryNuxtOptions): Client | undefined {
   const sentryOptions = {
+    defaultIntegrations: getDefaultIntegrations(options),
     ...options,
   };
 
   applySdkMetadata(sentryOptions, 'nuxt', ['nuxt', 'vue']);
 
   return initBrowser(sentryOptions);
 }
+
+// Tree-shakable guard to remove all code related to tracing
+declare const __SENTRY_TRACING__: boolean;
+
+function getDefaultIntegrations(options: BrowserOptions): Integration[] | undefined {
+  // This evaluates to true unless __SENTRY_TRACING__ is text-replaced with "false",
+  // in which case everything inside will get tree-shaken away
+  if (typeof __SENTRY_TRACING__ === 'undefined' || __SENTRY_TRACING__) {
+    if (hasTracingEnabled(options)) {
+      return [...getBrowserDefaultIntegrations(options), browserTracingIntegration()];
+    }
+  }
+
+  return undefined;
+}

packages/nuxt/test/client/sdk.test.ts

@@ -1,9 +1,9 @@
 import * as SentryBrowser from '@sentry/browser';
-import { SDK_VERSION } from '@sentry/vue';
+import { type BrowserClient, SDK_VERSION, getClient } from '@sentry/vue';
 import { beforeEach, describe, expect, it, vi } from 'vitest';
 import { init } from '../../src/client';
 
-const vueInit = vi.spyOn(SentryBrowser, 'init');
+const browserInit = vi.spyOn(SentryBrowser, 'init');
 
 describe('Nuxt Client SDK', () => {
   describe('init', () => {
@@ -12,7 +12,7 @@ describe('Nuxt Client SDK', () => {
     });
 
     it('Adds Nuxt metadata to the SDK options', () => {
-      expect(vueInit).not.toHaveBeenCalled();
+      expect(browserInit).not.toHaveBeenCalled();
 
       init({
         dsn: 'https://public@dsn.ingest.sentry.io/1337',
@@ -31,8 +31,56 @@ describe('Nuxt Client SDK', () => {
         },
       };
 
-      expect(vueInit).toHaveBeenCalledTimes(1);
-      expect(vueInit).toHaveBeenLastCalledWith(expect.objectContaining(expectedMetadata));
+      expect(browserInit).toHaveBeenCalledTimes(1);
+      expect(browserInit).toHaveBeenLastCalledWith(expect.objectContaining(expectedMetadata));
+    });
+
+    describe('Automatically adds BrowserTracing integration', () => {
+      it.each([
+        ['tracesSampleRate', { tracesSampleRate: 0 }],
+        ['tracesSampler', { tracesSampler: () => 1.0 }],
+        ['enableTracing', { enableTracing: true }],
+      ])('adds a browserTracingIntegration if tracing is enabled via %s', (_, tracingOptions) => {
+        init({
+          dsn: 'https://public@dsn.ingest.sentry.io/1337',
+          ...tracingOptions,
+        });
+
+        const browserTracing = getClient<BrowserClient>()?.getIntegrationByName('BrowserTracing');
+        expect(browserTracing).toBeDefined();
+      });
+
+      it.each([
+        ['enableTracing', { enableTracing: false }],
+        ['no tracing option set', {}],
+      ])("doesn't add a browserTracingIntegration integration if tracing is disabled via %s", (_, tracingOptions) => {
+        init({
+          dsn: 'https://public@dsn.ingest.sentry.io/1337',
+          ...tracingOptions,
+        });
+
+        const browserTracing = getClient<BrowserClient>()?.getIntegrationByName('BrowserTracing');
+        expect(browserTracing).toBeUndefined();
+      });
+
+      it("doesn't add a browserTracingIntegration if `__SENTRY_TRACING__` is set to false", () => {
+        // This is the closest we can get to unit-testing the `__SENTRY_TRACING__` tree-shaking guard
+        // IRL, the code to add the integration would most likely be removed by the bundler.
+
+        // @ts-expect-error: Testing purposes
+        globalThis.__SENTRY_TRACING__ = false;
+
+        init({
+          dsn: 'https://public@dsn.ingest.sentry.io/1337',
+          tracesSampleRate: 0.3,
+        });
+
+        const browserTracing = getClient<BrowserClient>()?.getIntegrationByName('BrowserTracing');
+        expect(browserTracing).toBeUndefined();
+
+        // @ts-expect-error: Testing purposes
+        delete globalThis.__SENTRY_TRACING__;
+      });
     });
 
     it('returns client from init', () => {