ref(replay): Remove circular @sentry/browser peerDependency (#6736)

We have only been using this in tests, and can use our own client instead here.

Author: mydea

packages/replay/package.json

@@ -57,9 +57,6 @@
     "@sentry/types": "7.30.0",
     "@sentry/utils": "7.30.0"
   },
-  "peerDependencies": {
-    "@sentry/browser": ">=7.24.0"
-  },
   "engines": {
     "node": ">=12"
   },

packages/replay/test/fixtures/error.ts

@@ -1,4 +1,3 @@
-import type { SeverityLevel } from '@sentry/browser';
 import type { Event } from '@sentry/types';
 
 export function Error(obj?: Event): any {
@@ -31,7 +30,7 @@ export function Error(obj?: Event): any {
         },
       ],
     },
-    level: 'error' as SeverityLevel,
+    level: 'error',
     event_id: 'event_id',
     platform: 'javascript',
     timestamp,

packages/replay/test/mocks/mockSdk.ts

@@ -1,14 +1,14 @@
-import type { BrowserOptions } from '@sentry/browser';
-import { init } from '@sentry/browser';
 import type { Envelope, Transport } from '@sentry/types';
 
 import type { Replay as ReplayIntegration } from '../../src';
 import type { ReplayContainer } from '../../src/replay';
 import type { ReplayConfiguration } from '../../src/types';
+import type { TestClientOptions } from '../utils/TestClient';
+import { getDefaultClientOptions, init } from '../utils/TestClient';
 
 export interface MockSdkParams {
   replayOptions?: ReplayConfiguration;
-  sentryOptions?: BrowserOptions;
+  sentryOptions?: Partial<TestClientOptions>;
   autoStart?: boolean;
 }
 
@@ -64,13 +64,13 @@ export async function mockSdk({ replayOptions, sentryOptions, autoStart = true }
   });
 
   init({
+    ...getDefaultClientOptions(),
     dsn: 'https://[email protected]/1',
     autoSessionTracking: false,
     sendClientReports: false,
     transport: () => new MockTransport(),
     replaysSessionSampleRate: 1.0,
     replaysOnErrorSampleRate: 0.0,
-    defaultIntegrations: false,
     ...sentryOptions,
     integrations: [replayIntegration],
   });

packages/replay/test/unit/util/createReplayEnvelope.test.ts

@@ -20,7 +20,7 @@ describe('Unit | util | createReplayEnvelope', () => {
     environment: 'production',
     sdk: {
       integrations: ['BrowserTracing', 'Replay'],
-      name: 'sentry.javascript.browser',
+      name: 'sentry.javascript.unknown',
       version: '7.25.0',
     },
     replay_type: 'error',
@@ -47,7 +47,7 @@ describe('Unit | util | createReplayEnvelope', () => {
     expect(envelope).toEqual([
       {
         event_id: REPLAY_ID,
-        sdk: { name: 'sentry.javascript.browser', version: '7.25.0' },
+        sdk: { name: 'sentry.javascript.unknown', version: '7.25.0' },
         sent_at: expect.any(String),
       },
       [
@@ -60,7 +60,7 @@ describe('Unit | util | createReplayEnvelope', () => {
             platform: 'javascript',
             replay_id: REPLAY_ID,
             replay_type: 'error',
-            sdk: { integrations: ['BrowserTracing', 'Replay'], name: 'sentry.javascript.browser', version: '7.25.0' },
+            sdk: { integrations: ['BrowserTracing', 'Replay'], name: 'sentry.javascript.unknown', version: '7.25.0' },
             segment_id: 3,
             tags: { errorSampleRate: 0, sessionSampleRate: 1 },
             timestamp: 1670837008.634,
@@ -80,7 +80,7 @@ describe('Unit | util | createReplayEnvelope', () => {
     expect(envelope).toEqual([
       {
         event_id: REPLAY_ID,
-        sdk: { name: 'sentry.javascript.browser', version: '7.25.0' },
+        sdk: { name: 'sentry.javascript.unknown', version: '7.25.0' },
         sent_at: expect.any(String),
         dsn: 'https://[email protected]:1234/123',
       },
@@ -93,7 +93,7 @@ describe('Unit | util | createReplayEnvelope', () => {
             event_id: REPLAY_ID,
             platform: 'javascript',
             replay_id: REPLAY_ID,
-            sdk: { integrations: ['BrowserTracing', 'Replay'], name: 'sentry.javascript.browser', version: '7.25.0' },
+            sdk: { integrations: ['BrowserTracing', 'Replay'], name: 'sentry.javascript.unknown', version: '7.25.0' },
             segment_id: 3,
             replay_type: 'error',
             tags: { errorSampleRate: 0, sessionSampleRate: 1 },

packages/replay/test/unit/util/getReplayEvent.test.ts

@@ -1,11 +1,10 @@
-import { BrowserClient } from '@sentry/browser';
 import type { Hub, Scope } from '@sentry/core';
 import { getCurrentHub } from '@sentry/core';
 import type { Client, ReplayEvent } from '@sentry/types';
 
 import { REPLAY_EVENT_NAME } from '../../../src/constants';
 import { prepareReplayEvent } from '../../../src/util/prepareReplayEvent';
-import { getDefaultBrowserClientOptions } from '../../utils/getDefaultBrowserClientOptions';
+import { getDefaultClientOptions, TestClient } from '../../utils/TestClient';
 
 describe('Unit | util | getReplayEvent', () => {
   let hub: Hub;
@@ -14,7 +13,7 @@ describe('Unit | util | getReplayEvent', () => {
 
   beforeEach(() => {
     hub = getCurrentHub();
-    client = new BrowserClient(getDefaultBrowserClientOptions());
+    client = new TestClient(getDefaultClientOptions());
     hub.bindClient(client);
 
     client = hub.getClient()!;
@@ -53,7 +52,7 @@ describe('Unit | util | getReplayEvent', () => {
       event_id: 'replay-ID',
       environment: 'production',
       sdk: {
-        name: 'sentry.javascript.browser',
+        name: 'sentry.javascript.unknown',
         version: 'version:Test',
       },
       sdkProcessingMetadata: {},

packages/replay/test/unit/util/prepareReplayEvent.test.ts

@@ -1,11 +1,10 @@
-import { BrowserClient } from '@sentry/browser';
 import type { Hub, Scope } from '@sentry/core';
 import { getCurrentHub } from '@sentry/core';
 import type { Client, ReplayEvent } from '@sentry/types';
 
 import { REPLAY_EVENT_NAME } from '../../../src/constants';
 import { prepareReplayEvent } from '../../../src/util/prepareReplayEvent';
-import { getDefaultBrowserClientOptions } from '../../utils/getDefaultBrowserClientOptions';
+import { getDefaultClientOptions, TestClient } from '../../utils/TestClient';
 
 describe('Unit | util | prepareReplayEvent', () => {
   let hub: Hub;
@@ -14,7 +13,7 @@ describe('Unit | util | prepareReplayEvent', () => {
 
   beforeEach(() => {
     hub = getCurrentHub();
-    client = new BrowserClient(getDefaultBrowserClientOptions());
+    client = new TestClient(getDefaultClientOptions());
     hub.bindClient(client);
 
     client = hub.getClient()!;
@@ -53,7 +52,7 @@ describe('Unit | util | prepareReplayEvent', () => {
       event_id: 'replay-ID',
       environment: 'production',
       sdk: {
-        name: 'sentry.javascript.browser',
+        name: 'sentry.javascript.unknown',
         version: 'version:Test',
       },
       sdkProcessingMetadata: {},

packages/replay/test/utils/TestClient.ts

@@ -0,0 +1,44 @@
+import { BaseClient, createTransport, initAndBind } from '@sentry/core';
+import type { BrowserClientReplayOptions, ClientOptions, Event, SeverityLevel } from '@sentry/types';
+import { resolvedSyncPromise } from '@sentry/utils';
+
+export interface TestClientOptions extends ClientOptions, BrowserClientReplayOptions {}
+
+export class TestClient extends BaseClient<TestClientOptions> {
+  public constructor(options: TestClientOptions) {
+    super(options);
+  }
+
+  public eventFromException(exception: any): PromiseLike<Event> {
+    return resolvedSyncPromise({
+      exception: {
+        values: [
+          {
+            /* eslint-disable @typescript-eslint/no-unsafe-member-access */
+            type: exception.name,
+            value: exception.message,
+            /* eslint-enable @typescript-eslint/no-unsafe-member-access */
+          },
+        ],
+      },
+    });
+  }
+
+  public eventFromMessage(message: string, level: SeverityLevel = 'info'): PromiseLike<Event> {
+    return resolvedSyncPromise({ message, level });
+  }
+}
+
+export function init(options: TestClientOptions): void {
+  initAndBind(TestClient, options);
+}
+
+export function getDefaultClientOptions(options: Partial<ClientOptions> = {}): ClientOptions {
+  return {
+    integrations: [],
+    dsn: 'https://username@domain/123',
+    transport: () => createTransport({ recordDroppedEvent: () => undefined }, _ => resolvedSyncPromise({})),
+    stackParser: () => [],
+    ...options,
+  };
+}