feat: Add Supabase Integration

dev-packages/browser-integration-tests/package.json

@@ -43,6 +43,7 @@
     "@playwright/test": "~1.50.0",
     "@sentry-internal/rrweb": "2.34.0",
     "@sentry/browser": "9.11.0",
+    "@supabase/supabase-js": "2.49.3",
     "axios": "1.8.2",
     "babel-loader": "^8.2.2",
     "fflate": "0.8.2",

dev-packages/browser-integration-tests/suites/integrations/supabase/auth/init.js

@@ -0,0 +1,24 @@
+import * as Sentry from '@sentry/browser';
+
+import { createClient } from '@supabase/supabase-js';
+window.Sentry = Sentry;
+
+const supabase = createClient('https://test.supabase.co', 'test-key');
+
+Sentry.init({
+  dsn: 'https://[email protected]/1337',
+  integrations: [Sentry.browserTracingIntegration(), Sentry.supabaseIntegration(supabase)],
+  tracesSampleRate: 1.0,
+});
+
+// Simulate authentication operations
+async function performAuthenticationOperations() {
+  await supabase.auth.signInWithPassword({
+    email: '[email protected]',
+    password: 'test-password',
+  });
+
+  await supabase.auth.signOut();
+}
+
+performAuthenticationOperations();

dev-packages/browser-integration-tests/suites/integrations/supabase/auth/test.ts

@@ -0,0 +1,140 @@
+import type { Page } from '@playwright/test';
+import { expect } from '@playwright/test';
+import type { Event } from '@sentry/core';
+
+import { sentryTest } from '../../../../utils/fixtures';
+import {
+  getFirstSentryEnvelopeRequest,
+  getMultipleSentryEnvelopeRequests,
+  shouldSkipTracingTest,
+} from '../../../../utils/helpers';
+
+async function mockSupabaseAuthRoutesSuccess(page: Page) {
+  await page.route('**/auth/v1/token?grant_type=password**', route => {
+    return route.fulfill({
+      status: 200,
+      body: JSON.stringify({
+        access_token: 'test-access-token',
+        refresh_token: 'test-refresh-token',
+        token_type: 'bearer',
+        expires_in: 3600,
+      }),
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    });
+  });
+
+  await page.route('**/auth/v1/logout**', route => {
+    return route.fulfill({
+      status: 200,
+      body: JSON.stringify({
+        message: 'Logged out',
+      }),
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    });
+  });
+}
+
+async function mockSupabaseAuthRoutesFailure(page: Page) {
+  await page.route('**/auth/v1/token?grant_type=password**', route => {
+    return route.fulfill({
+      status: 400,
+      body: JSON.stringify({
+        error_description: 'Invalid email or password',
+        error: 'invalid_grant',
+      }),
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    });
+  });
+
+  await page.route('**/auth/v1/logout**', route => {
+    return route.fulfill({
+      status: 400,
+      body: JSON.stringify({
+        error_description: 'Invalid refresh token',
+        error: 'invalid_grant',
+      }),
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    });
+  });
+}
+
+sentryTest('should capture Supabase authentication spans', async ({ getLocalTestUrl, page }) => {
+  if (shouldSkipTracingTest()) {
+    return;
+  }
+
+  await mockSupabaseAuthRoutesSuccess(page);
+
+  const url = await getLocalTestUrl({ testDir: __dirname });
+
+  const eventData = await getFirstSentryEnvelopeRequest<Event>(page, url);
+  const supabaseSpans = eventData.spans?.filter(({ op }) => op?.startsWith('db.supabase.auth'));
+
+  expect(supabaseSpans).toHaveLength(2);
+  expect(supabaseSpans![0]).toMatchObject({
+    description: 'signInWithPassword',
+    parent_span_id: eventData.contexts?.trace?.span_id,
+    span_id: expect.any(String),
+    start_timestamp: expect.any(Number),
+    timestamp: expect.any(Number),
+    trace_id: eventData.contexts?.trace?.trace_id,
+    status: 'ok',
+    data: expect.objectContaining({
+      'sentry.op': 'db.supabase.auth.signInWithPassword',
+      'sentry.origin': 'auto.db.supabase',
+    }),
+  });
+
+  expect(supabaseSpans![1]).toMatchObject({
+    description: 'signOut',
+    parent_span_id: eventData.contexts?.trace?.span_id,
+    span_id: expect.any(String),
+    start_timestamp: expect.any(Number),
+    timestamp: expect.any(Number),
+    trace_id: eventData.contexts?.trace?.trace_id,
+    status: 'ok',
+    data: expect.objectContaining({
+      'sentry.op': 'db.supabase.auth.signOut',
+      'sentry.origin': 'auto.db.supabase',
+    }),
+  });
+});
+
+sentryTest('should capture Supabase authentication errors', async ({ getLocalTestUrl, page }) => {
+  if (shouldSkipTracingTest()) {
+    return;
+  }
+
+  await mockSupabaseAuthRoutesFailure(page);
+
+  const url = await getLocalTestUrl({ testDir: __dirname });
+
+  const [errorEvent, transactionEvent] = await getMultipleSentryEnvelopeRequests<Event>(page, 2, { url });
+
+  const supabaseSpans = transactionEvent.spans?.filter(({ op }) => op?.startsWith('db.supabase.auth'));
+
+  expect(errorEvent.exception?.values?.[0].value).toBe('Invalid email or password');
+
+  expect(supabaseSpans).toHaveLength(2);
+  expect(supabaseSpans![0]).toMatchObject({
+    description: 'signInWithPassword',
+    parent_span_id: transactionEvent.contexts?.trace?.span_id,
+    span_id: expect.any(String),
+    start_timestamp: expect.any(Number),
+    timestamp: expect.any(Number),
+    trace_id: transactionEvent.contexts?.trace?.trace_id,
+    status: 'unknown_error',
+    data: expect.objectContaining({
+      'sentry.op': 'db.supabase.auth.signInWithPassword',
+      'sentry.origin': 'auto.db.supabase',
+    }),
+  });
+});

dev-packages/browser-integration-tests/suites/integrations/supabase/db-operations/init.js

@@ -0,0 +1,38 @@
+import * as Sentry from '@sentry/browser';
+
+import { createClient } from '@supabase/supabase-js';
+window.Sentry = Sentry;
+
+const supabase = createClient(
+  'https://test.supabase.co',
+  'test-key'
+);
+
+Sentry.init({
+  dsn: 'https://[email protected]/1337',
+  integrations: [
+    Sentry.browserTracingIntegration(),
+    Sentry.supabaseIntegration(supabase)
+  ],
+  tracesSampleRate: 1.0,
+});
+
+// Simulate database operations
+async function performDatabaseOperations() {
+  try {
+    await supabase
+      .from('todos')
+      .insert([{ title: 'Test Todo' }]);
+
+    await supabase
+      .from('todos')
+      .select('*');
+
+    // Trigger an error to capture the breadcrumbs
+    throw new Error('Test Error');
+  } catch (error) {
+    Sentry.captureException(error);
+  }
+}
+
+performDatabaseOperations();

dev-packages/browser-integration-tests/suites/integrations/supabase/db-operations/test.ts

@@ -0,0 +1,82 @@
+import type { Page } from '@playwright/test';
+import { expect } from '@playwright/test';
+import type { Event } from '@sentry/core';
+
+import { sentryTest } from '../../../../utils/fixtures';
+import { getFirstSentryEnvelopeRequest, getMultipleSentryEnvelopeRequests, shouldSkipTracingTest } from '../../../../utils/helpers';
+
+async function mockSupabaseRoute(page: Page) {
+  await page.route('**/rest/v1/todos**', route => {
+    return route.fulfill({
+      status: 200,
+      body: JSON.stringify({
+        userNames: ['John', 'Jane'],
+      }),
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    });
+  });
+}
+
+sentryTest('should capture Supabase database operation breadcrumbs', async ({ getLocalTestUrl, page }) => {
+  if (shouldSkipTracingTest()) {
+    return;
+  }
+
+  await mockSupabaseRoute(page);
+
+  const url = await getLocalTestUrl({ testDir: __dirname });
+
+  const eventData = await getFirstSentryEnvelopeRequest<Event>(page, url);
+
+  expect(eventData.breadcrumbs).toBeDefined();
+  expect(eventData.breadcrumbs).toContainEqual({
+    timestamp: expect.any(Number),
+    type: 'supabase',
+    category: 'db.insert',
+    message: 'from(todos)',
+    data: expect.any(Object),
+  });
+});
+
+sentryTest('should capture multiple Supabase operations in sequence', async ({ getLocalTestUrl, page }) => {
+  if (shouldSkipTracingTest()) {
+    return;
+  }
+
+  await mockSupabaseRoute(page);
+
+  const url = await getLocalTestUrl({ testDir: __dirname });
+
+  const events = await getMultipleSentryEnvelopeRequests<Event>(page, 2, { url });
+
+  expect(events).toHaveLength(2);
+
+  events.forEach(event => {
+    expect(
+      event.breadcrumbs?.some(breadcrumb => breadcrumb.type === 'supabase' && breadcrumb?.category?.startsWith('db.')),
+    ).toBe(true);
+  });
+});
+
+sentryTest('should include correct data payload in Supabase breadcrumbs', async ({ getLocalTestUrl, page }) => {
+  if (shouldSkipTracingTest()) {
+    return;
+  }
+
+  await mockSupabaseRoute(page);
+
+  const url = await getLocalTestUrl({ testDir: __dirname });
+
+  const eventData = await getFirstSentryEnvelopeRequest<Event>(page, url);
+
+  const supabaseBreadcrumb = eventData.breadcrumbs?.find(b => b.type === 'supabase');
+
+  expect(supabaseBreadcrumb).toBeDefined();
+  expect(supabaseBreadcrumb?.data).toMatchObject({
+    query: expect.arrayContaining([
+      'filter(columns, )'
+    ]),
+  });
+});

dev-packages/e2e-tests/test-applications/supabase-nextjs/.gitignore

@@ -0,0 +1,39 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnpm-debug.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+
+# Sentry Config File
+.env.sentry-build-plugin

dev-packages/e2e-tests/test-applications/supabase-nextjs/.npmrc

@@ -0,0 +1,2 @@
+@sentry:registry=http://127.0.0.1:4873
+@sentry-internal:registry=http://127.0.0.1:4873