ref(replay): Send SDK's name in replay event (#6514)

Replace the `sentry.javascript.integration.replay` name in `event.sdk.name` with the actual Sentry SDK name (e.g. `sentry.javascript.browser`), analogously to how we send SDK metadata in other event types.

Going forward, we can can also use this information e.g. for data analysis to filter replay events by SDK

Author: Lms24

packages/replay/src/constants.ts

@@ -25,8 +25,3 @@ export const MAX_SESSION_LIFE = 1_800_000; // 30 minutes
  */
 export const DEFAULT_SESSION_SAMPLE_RATE = 0.1;
 export const DEFAULT_ERROR_SAMPLE_RATE = 1.0;
-
-export const REPLAY_SDK_INFO = {
-  name: 'sentry.javascript.integration.replay',
-  version: __SENTRY_REPLAY_VERSION__,
-};

packages/replay/src/replay.ts

@@ -939,7 +939,6 @@ export class ReplayContainer implements ReplayContainerInterface {
     };
 
     const replayEvent = await getReplayEvent({ scope, client, replayId, event: baseEvent });
-
     replayEvent.tags = {
       ...replayEvent.tags,
       sessionSampleRate: this._options.sessionSampleRate,
@@ -971,8 +970,8 @@ export class ReplayContainer implements ReplayContainerInterface {
                 "BrowserTracing",
                 "Replay"
             ],
-            "name": "sentry.javascript.integration.replay",
-            "version": "7.24.2"
+            "name": "sentry.javascript.browser",
+            "version": "7.25.0"
         },
         "sdkProcessingMetadata": {},
         "tags": {

packages/replay/src/util/createReplayEnvelope.ts

@@ -1,18 +1,17 @@
 import { Envelope, Event } from '@sentry/types';
 import { createEnvelope } from '@sentry/utils';
 
-import { REPLAY_SDK_INFO } from '../constants';
-
 export function createReplayEnvelope(
   replayId: string,
   replayEvent: Event,
   payloadWithSequence: string | Uint8Array,
 ): Envelope {
+  const { name, version } = replayEvent.sdk || {};
   return createEnvelope(
     {
       event_id: replayId,
       sent_at: new Date().toISOString(),
-      sdk: REPLAY_SDK_INFO,
+      sdk: { name, version },
     },
     [
       // @ts-ignore New types

packages/replay/src/util/getReplayEvent.ts

@@ -1,8 +1,6 @@
 import { Scope } from '@sentry/core';
 import { Client, Event } from '@sentry/types';
 
-import { REPLAY_SDK_INFO } from '../constants';
-
 export async function getReplayEvent({
   client,
   scope,
@@ -18,9 +16,14 @@ export async function getReplayEvent({
   // @ts-ignore private api
   const preparedEvent: Event = await client._prepareEvent(event, { event_id }, scope);
 
+  // extract the SDK name because `client._prepareEvent` doesn't add it to the event
+  const metadata = client.getOptions() && client.getOptions()._metadata;
+  const { name } = (metadata && metadata.sdk) || {};
+
   preparedEvent.sdk = {
     ...preparedEvent.sdk,
-    ...REPLAY_SDK_INFO,
+    version: __SENTRY_REPLAY_VERSION__,
+    name,
   };
 
   return preparedEvent;

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

@@ -0,0 +1,62 @@
+import { Event } from '@sentry/types';
+
+import { createReplayEnvelope } from '../../../src/util/createReplayEnvelope';
+
+describe('createReplayEnvelope', () => {
+  it('creates an envelope for a given Replay event', () => {
+    const replayId = '1234';
+    const replayEvent = {
+      type: 'replay_event',
+      timestamp: 1670837008.634,
+      error_ids: ['errorId'],
+      trace_ids: ['traceId'],
+      urls: ['https://example.com'],
+      replay_id: 'eventId',
+      segment_id: 3,
+      platform: 'javascript',
+      event_id: 'eventId',
+      environment: 'production',
+      sdk: {
+        integrations: ['BrowserTracing', 'Replay'],
+        name: 'sentry.javascript.browser',
+        version: '7.25.0',
+      },
+      tags: {
+        sessionSampleRate: 1,
+        errorSampleRate: 0,
+        replayType: 'error',
+      },
+    };
+    const payloadWithSequence = 'payload';
+
+    const envelope = createReplayEnvelope(replayId, replayEvent as Event, payloadWithSequence);
+
+    expect(envelope).toEqual([
+      {
+        event_id: '1234',
+        sdk: { name: 'sentry.javascript.browser', version: '7.25.0' },
+        sent_at: expect.any(String),
+      },
+      [
+        [
+          { type: 'replay_event' },
+          {
+            environment: 'production',
+            error_ids: ['errorId'],
+            event_id: 'eventId',
+            platform: 'javascript',
+            replay_id: 'eventId',
+            sdk: { integrations: ['BrowserTracing', 'Replay'], name: 'sentry.javascript.browser', version: '7.25.0' },
+            segment_id: 3,
+            tags: { errorSampleRate: 0, replayType: 'error', sessionSampleRate: 1 },
+            timestamp: 1670837008.634,
+            trace_ids: ['traceId'],
+            type: 'replay_event',
+            urls: ['https://example.com'],
+          },
+        ],
+        [{ length: 7, type: 'replay_recording' }, 'payload'],
+      ],
+    ]);
+  });
+});

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

@@ -50,7 +50,7 @@ describe('getReplayEvent', () => {
       event_id: 'replay-ID',
       environment: 'production',
       sdk: {
-        name: 'sentry.javascript.integration.replay',
+        name: 'sentry.javascript.browser',
         version: 'version:Test',
       },
       sdkProcessingMetadata: {},