feat(nuxt): Automatically add BrowserTracing (#13005)

Add `BrowserTracing` when `tracesSampleRate` is set.

Author: s1gr1d

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,4 +1,8 @@
-import { init as initBrowser } from '@sentry/browser';
+import {
+  browserTracingIntegration,
+  getDefaultIntegrations as getBrowserDefaultIntegrations,
+  init as initBrowser,
+} from '@sentry/browser';
 import { applySdkMetadata } from '@sentry/core';
 import type { Client } from '@sentry/types';
 import type { SentryNuxtOptions } from '../common/types';
@@ -10,6 +14,7 @@ import type { SentryNuxtOptions } from '../common/types';
  */
 export function init(options: SentryNuxtOptions): Client | undefined {
   const sentryOptions = {
+    defaultIntegrations: [...getBrowserDefaultIntegrations(options), browserTracingIntegration()],
     ...options,
   };
 

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,25 @@ 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 }],
+        ['no tracing option set', {}] /* enable "tracing without performance" by default */,
+      ])('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('returns client from init', () => {