feat(replay): Deprecate Replay, ReplayCanvas, Feedback classes

Instead, users should use the new functional styles.

Note that we'll probably actually un-deprecate `Replay` in some form in v8, as we'll be keeping the class around there for sure (as there is a lot of logic in there...). But users should not use it, so deprecating this now!

Author: mydea

MIGRATION.md

@@ -36,6 +36,9 @@ The following list shows how integrations should be migrated:
 | `new ModuleMetadata()`   | `moduleMetadataIntegration()`   | `@sentry/core`, `@sentry/browser`                                                                       |
 | `new RequestData()`      | `requestDataIntegration()`      | `@sentry/core`, `@sentry/node`, `@sentry/deno`, `@sentry/bun`, `@sentry/vercel-edge`                    |
 | `new Wasm() `            | `wasmIntegration()`             | `@sentry/wasm`                                                                                          |
+| `new Replay()`           | `replayIntegration()`           | `@sentry/browser`                                                                                       |
+| `new ReplayCanvas()`     | `replayCanvasIntegration()`     | `@sentry/browser`                                                                                       |
+| `new Feedback()`         | `feedbackIntegration()`         | `@sentry/browser`                                                                                       |
 
 ## Deprecate `hub.bindClient()` and `makeMain()`
 

dev-packages/browser-integration-tests/suites/replay/bufferMode/test.ts

@@ -67,6 +67,7 @@ sentryTest(
     // Start buffering and assert that it is enabled
     expect(
       await page.evaluate(() => {
+        // eslint-disable-next-line deprecation/deprecation
         const replayIntegration = (window as unknown as Window & { Replay: InstanceType<typeof Replay> }).Replay;
         // @ts-expect-error private
         const replay = replayIntegration._replay;
@@ -87,6 +88,7 @@ sentryTest(
     const [req0] = await Promise.all([
       reqPromise0,
       page.evaluate(async () => {
+        // eslint-disable-next-line deprecation/deprecation
         const replayIntegration = (window as unknown as Window & { Replay: Replay }).Replay;
         await replayIntegration.flush();
       }),
@@ -210,6 +212,7 @@ sentryTest(
     // Start buffering and assert that it is enabled
     expect(
       await page.evaluate(() => {
+        // eslint-disable-next-line deprecation/deprecation
         const replayIntegration = (window as unknown as Window & { Replay: InstanceType<typeof Replay> }).Replay;
         // @ts-expect-error private
         const replay = replayIntegration._replay;
@@ -230,6 +233,7 @@ sentryTest(
     const [req0] = await Promise.all([
       reqPromise0,
       page.evaluate(async () => {
+        // eslint-disable-next-line deprecation/deprecation
         const replayIntegration = (window as unknown as Window & { Replay: Replay }).Replay;
         await replayIntegration.flush({ continueRecording: false });
       }),
@@ -324,6 +328,7 @@ sentryTest(
     // Start buffering and assert that it is enabled
     expect(
       await page.evaluate(() => {
+        // eslint-disable-next-line deprecation/deprecation
         const replayIntegration = (window as unknown as Window & { Replay: InstanceType<typeof Replay> }).Replay;
         const replay = replayIntegration['_replay'];
         replayIntegration.startBuffering();
@@ -342,6 +347,7 @@ sentryTest(
     expect(errorEvent0.tags?.replayId).toBeUndefined();
 
     await page.evaluate(async () => {
+      // eslint-disable-next-line deprecation/deprecation
       const replayIntegration = (window as unknown as Window & { Replay: Replay }).Replay;
       replayIntegration['_replay'].getOptions().errorSampleRate = 1.0;
     });

dev-packages/browser-integration-tests/suites/replay/dsc/test.ts

@@ -6,7 +6,11 @@ import { sentryTest } from '../../../utils/fixtures';
 import { envelopeRequestParser, shouldSkipTracingTest, waitForTransactionRequest } from '../../../utils/helpers';
 import { getReplaySnapshot, shouldSkipReplayTest, waitForReplayRunning } from '../../../utils/replayHelpers';
 
-type TestWindow = Window & { Sentry: typeof Sentry; Replay: Sentry.Replay };
+type TestWindow = Window & {
+  Sentry: typeof Sentry;
+  // eslint-disable-next-line deprecation/deprecation
+  Replay: Sentry.Replay;
+};
 
 sentryTest(
   'should add replay_id to dsc of transactions when in session mode',

packages/browser/src/index.bundle.feedback.ts

@@ -1,14 +1,24 @@
 // This is exported so the loader does not fail when switching off Replay/Tracing
-import { Feedback } from '@sentry-internal/feedback';
-import { BrowserTracing, Replay, addTracingExtensions } from '@sentry-internal/integration-shims';
+import { Feedback, feedbackIntegration } from '@sentry-internal/feedback';
+import { BrowserTracing, Replay, addTracingExtensions, replayIntegration } from '@sentry-internal/integration-shims';
 
 import * as Sentry from './index.bundle.base';
 
 // TODO (v8): Remove this as it was only needed for backwards compatibility
+// eslint-disable-next-line deprecation/deprecation
 Sentry.Integrations.Replay = Replay;
 
 Sentry.Integrations.BrowserTracing = BrowserTracing;
 
 export * from './index.bundle.base';
-export { BrowserTracing, addTracingExtensions, Replay, Feedback };
+export {
+  BrowserTracing,
+  addTracingExtensions,
+  // eslint-disable-next-line deprecation/deprecation
+  Replay,
+  replayIntegration,
+  // eslint-disable-next-line deprecation/deprecation
+  Feedback,
+  feedbackIntegration,
+};
 // Note: We do not export a shim for `Span` here, as that is quite complex and would blow up the bundle

packages/browser/src/index.bundle.replay.ts

@@ -1,14 +1,29 @@
 // This is exported so the loader does not fail when switching off Replay/Tracing
-import { BrowserTracing, Feedback, addTracingExtensions } from '@sentry-internal/integration-shims';
-import { Replay } from '@sentry/replay';
+import {
+  BrowserTracing,
+  Feedback,
+  addTracingExtensions,
+  feedbackIntegration,
+} from '@sentry-internal/integration-shims';
+import { Replay, replayIntegration } from '@sentry/replay';
 
 import * as Sentry from './index.bundle.base';
 
 // TODO (v8): Remove this as it was only needed for backwards compatibility
+// eslint-disable-next-line deprecation/deprecation
 Sentry.Integrations.Replay = Replay;
 
 Sentry.Integrations.BrowserTracing = BrowserTracing;
 
 export * from './index.bundle.base';
-export { BrowserTracing, addTracingExtensions, Replay, Feedback };
+export {
+  BrowserTracing,
+  addTracingExtensions,
+  // eslint-disable-next-line deprecation/deprecation
+  Replay,
+  replayIntegration,
+  // eslint-disable-next-line deprecation/deprecation
+  Feedback,
+  feedbackIntegration,
+};
 // Note: We do not export a shim for `Span` here, as that is quite complex and would blow up the bundle

packages/browser/src/index.bundle.tracing.replay.feedback.ts

@@ -1,18 +1,29 @@
-import { Feedback } from '@sentry-internal/feedback';
+import { Feedback, feedbackIntegration } from '@sentry-internal/feedback';
 import { BrowserTracing, Span, addExtensionMethods } from '@sentry-internal/tracing';
-import { Replay } from '@sentry/replay';
+import { Replay, replayIntegration } from '@sentry/replay';
 
 import * as Sentry from './index.bundle.base';
 
 // TODO (v8): Remove this as it was only needed for backwards compatibility
 // We want replay to be available under Sentry.Replay, to be consistent
 // with the NPM package version.
+// eslint-disable-next-line deprecation/deprecation
 Sentry.Integrations.Replay = Replay;
 
 Sentry.Integrations.BrowserTracing = BrowserTracing;
 
 // We are patching the global object with our hub extension methods
 addExtensionMethods();
 
-export { Feedback, Replay, BrowserTracing, Span, addExtensionMethods };
+export {
+  // eslint-disable-next-line deprecation/deprecation
+  Feedback,
+  // eslint-disable-next-line deprecation/deprecation
+  Replay,
+  feedbackIntegration,
+  replayIntegration,
+  BrowserTracing,
+  Span,
+  addExtensionMethods,
+};
 export * from './index.bundle.base';

packages/browser/src/index.bundle.tracing.replay.ts

@@ -1,18 +1,29 @@
-import { Feedback } from '@sentry-internal/integration-shims';
+import { Feedback, feedbackIntegration } from '@sentry-internal/integration-shims';
 import { BrowserTracing, Span, addExtensionMethods } from '@sentry-internal/tracing';
-import { Replay } from '@sentry/replay';
+import { Replay, replayIntegration } from '@sentry/replay';
 
 import * as Sentry from './index.bundle.base';
 
 // TODO (v8): Remove this as it was only needed for backwards compatibility
 // We want replay to be available under Sentry.Replay, to be consistent
 // with the NPM package version.
+// eslint-disable-next-line deprecation/deprecation
 Sentry.Integrations.Replay = Replay;
 
 Sentry.Integrations.BrowserTracing = BrowserTracing;
 
 // We are patching the global object with our hub extension methods
 addExtensionMethods();
 
-export { Feedback, Replay, BrowserTracing, Span, addExtensionMethods };
+export {
+  // eslint-disable-next-line deprecation/deprecation
+  Feedback,
+  // eslint-disable-next-line deprecation/deprecation
+  Replay,
+  replayIntegration,
+  feedbackIntegration,
+  BrowserTracing,
+  Span,
+  addExtensionMethods,
+};
 export * from './index.bundle.base';

packages/browser/src/index.bundle.tracing.ts

@@ -1,18 +1,29 @@
 // This is exported so the loader does not fail when switching off Replay
-import { Feedback, Replay } from '@sentry-internal/integration-shims';
+import { Feedback, Replay, feedbackIntegration, replayIntegration } from '@sentry-internal/integration-shims';
 import { BrowserTracing, Span, addExtensionMethods } from '@sentry-internal/tracing';
 
 import * as Sentry from './index.bundle.base';
 
 // TODO (v8): Remove this as it was only needed for backwards compatibility
 // We want replay to be available under Sentry.Replay, to be consistent
 // with the NPM package version.
+// eslint-disable-next-line deprecation/deprecation
 Sentry.Integrations.Replay = Replay;
 
 Sentry.Integrations.BrowserTracing = BrowserTracing;
 
 // We are patching the global object with our hub extension methods
 addExtensionMethods();
 
-export { Feedback, Replay, BrowserTracing, Span, addExtensionMethods };
+export {
+  // eslint-disable-next-line deprecation/deprecation
+  Feedback,
+  // eslint-disable-next-line deprecation/deprecation
+  Replay,
+  feedbackIntegration,
+  replayIntegration,
+  BrowserTracing,
+  Span,
+  addExtensionMethods,
+};
 export * from './index.bundle.base';

packages/browser/src/index.bundle.ts

@@ -1,13 +1,30 @@
 // This is exported so the loader does not fail when switching off Replay/Tracing
-import { BrowserTracing, Feedback, Replay, addTracingExtensions } from '@sentry-internal/integration-shims';
+import {
+  BrowserTracing,
+  Feedback,
+  Replay,
+  addTracingExtensions,
+  feedbackIntegration,
+  replayIntegration,
+} from '@sentry-internal/integration-shims';
 
 import * as Sentry from './index.bundle.base';
 
 // TODO (v8): Remove this as it was only needed for backwards compatibility
+// eslint-disable-next-line deprecation/deprecation
 Sentry.Integrations.Replay = Replay;
 
 Sentry.Integrations.BrowserTracing = BrowserTracing;
 
 export * from './index.bundle.base';
-export { BrowserTracing, addTracingExtensions, Replay, Feedback };
+export {
+  BrowserTracing,
+  addTracingExtensions,
+  // eslint-disable-next-line deprecation/deprecation
+  Replay,
+  // eslint-disable-next-line deprecation/deprecation
+  Feedback,
+  feedbackIntegration,
+  replayIntegration,
+};
 // Note: We do not export a shim for `Span` here, as that is quite complex and would blow up the bundle

packages/browser/src/index.ts

@@ -21,7 +21,11 @@ const INTEGRATIONS = {
 
 export { INTEGRATIONS as Integrations };
 
-export { Replay } from '@sentry/replay';
+export {
+  // eslint-disable-next-line deprecation/deprecation
+  Replay,
+  replayIntegration,
+} from '@sentry/replay';
 export type {
   ReplayEventType,
   ReplayEventWithTime,
@@ -34,9 +38,18 @@ export type {
   ReplaySpanFrameEvent,
 } from '@sentry/replay';
 
-export { ReplayCanvas } from '@sentry-internal/replay-canvas';
+export {
+  // eslint-disable-next-line deprecation/deprecation
+  ReplayCanvas,
+  replayCanvasIntegration,
+} from '@sentry-internal/replay-canvas';
 
-export { Feedback, sendFeedback } from '@sentry-internal/feedback';
+export {
+  // eslint-disable-next-line deprecation/deprecation
+  Feedback,
+  feedbackIntegration,
+  sendFeedback,
+} from '@sentry-internal/feedback';
 
 export {
   BrowserTracing,

packages/browser/test/unit/index.bundle.feedback.test.ts

@@ -1,5 +1,10 @@
-import { BrowserTracing as BrowserTracingShim, Replay as ReplayShim } from '@sentry-internal/integration-shims';
-import { Feedback } from '@sentry/browser';
+/* eslint-disable deprecation/deprecation */
+import {
+  BrowserTracing as BrowserTracingShim,
+  Replay as ReplayShim,
+  replayIntegration as replayIntegrationShim,
+} from '@sentry-internal/integration-shims';
+import { Feedback, feedbackIntegration } from '@sentry/browser';
 
 import * as TracingReplayBundle from '../../src/index.bundle.feedback';
 
@@ -16,10 +21,12 @@ describe('index.bundle.feedback', () => {
 
     expect(TracingReplayBundle.Integrations.Replay).toBe(ReplayShim);
     expect(TracingReplayBundle.Replay).toBe(ReplayShim);
+    expect(TracingReplayBundle.replayIntegration).toBe(replayIntegrationShim);
 
     expect(TracingReplayBundle.Integrations.BrowserTracing).toBe(BrowserTracingShim);
     expect(TracingReplayBundle.BrowserTracing).toBe(BrowserTracingShim);
 
     expect(TracingReplayBundle.Feedback).toBe(Feedback);
+    expect(TracingReplayBundle.feedbackIntegration).toBe(feedbackIntegration);
   });
 });

packages/browser/test/unit/index.bundle.replay.test.ts

@@ -1,5 +1,10 @@
-import { BrowserTracing as BrowserTracingShim, Feedback as FeedbackShim } from '@sentry-internal/integration-shims';
-import { Replay } from '@sentry/browser';
+/* eslint-disable deprecation/deprecation */
+import {
+  BrowserTracing as BrowserTracingShim,
+  Feedback as FeedbackShim,
+  feedbackIntegration as feedbackIntegrationShim,
+} from '@sentry-internal/integration-shims';
+import { Replay, replayIntegration } from '@sentry/browser';
 
 import * as TracingReplayBundle from '../../src/index.bundle.replay';
 
@@ -16,10 +21,12 @@ describe('index.bundle.replay', () => {
 
     expect(TracingReplayBundle.Integrations.Replay).toBe(Replay);
     expect(TracingReplayBundle.Replay).toBe(Replay);
+    expect(TracingReplayBundle.replayIntegration).toBe(replayIntegration);
 
     expect(TracingReplayBundle.Integrations.BrowserTracing).toBe(BrowserTracingShim);
     expect(TracingReplayBundle.BrowserTracing).toBe(BrowserTracingShim);
 
     expect(TracingReplayBundle.Feedback).toBe(FeedbackShim);
+    expect(TracingReplayBundle.feedbackIntegration).toBe(feedbackIntegrationShim);
   });
 });

packages/browser/test/unit/index.bundle.test.ts

@@ -1,7 +1,10 @@
+/* eslint-disable deprecation/deprecation */
 import {
   BrowserTracing as BrowserTracingShim,
   Feedback as FeedbackShim,
   Replay as ReplayShim,
+  feedbackIntegration as feedbackIntegrationShim,
+  replayIntegration as replayIntegrationShim,
 } from '@sentry-internal/integration-shims';
 
 import * as TracingBundle from '../../src/index.bundle';
@@ -19,10 +22,12 @@ describe('index.bundle', () => {
 
     expect(TracingBundle.Integrations.Replay).toBe(ReplayShim);
     expect(TracingBundle.Replay).toBe(ReplayShim);
+    expect(TracingBundle.replayIntegration).toBe(replayIntegrationShim);
 
     expect(TracingBundle.Integrations.BrowserTracing).toBe(BrowserTracingShim);
     expect(TracingBundle.BrowserTracing).toBe(BrowserTracingShim);
 
     expect(TracingBundle.Feedback).toBe(FeedbackShim);
+    expect(TracingBundle.feedbackIntegration).toBe(feedbackIntegrationShim);
   });
 });

packages/browser/test/unit/index.bundle.tracing.replay.feedback.test.ts

@@ -1,5 +1,6 @@
+/* eslint-disable deprecation/deprecation */
 import { BrowserTracing } from '@sentry-internal/tracing';
-import { Feedback, Replay } from '@sentry/browser';
+import { Feedback, Replay, feedbackIntegration, replayIntegration } from '@sentry/browser';
 
 import * as TracingReplayFeedbackBundle from '../../src/index.bundle.tracing.replay.feedback';
 
@@ -16,10 +17,12 @@ describe('index.bundle.tracing.replay.feedback', () => {
 
     expect(TracingReplayFeedbackBundle.Integrations.Replay).toBe(Replay);
     expect(TracingReplayFeedbackBundle.Replay).toBe(Replay);
+    expect(TracingReplayFeedbackBundle.replayIntegration).toBe(replayIntegration);
 
     expect(TracingReplayFeedbackBundle.Integrations.BrowserTracing).toBe(BrowserTracing);
     expect(TracingReplayFeedbackBundle.BrowserTracing).toBe(BrowserTracing);
 
     expect(TracingReplayFeedbackBundle.Feedback).toBe(Feedback);
+    expect(TracingReplayFeedbackBundle.feedbackIntegration).toBe(feedbackIntegration);
   });
 });