👌 Make canvas recording configuration extensible

Author: BeltranBulbarellaDD

packages/browser-rum-core/src/domain/configuration/configuration.spec.ts

@@ -332,18 +332,16 @@ describe('validateAndBuildRumConfiguration', () => {
     it('is disabled by default', () => {
       const configuration = validateAndBuildRumConfiguration(DEFAULT_INIT_CONFIGURATION)!
 
-      expect(configuration.enableSessionReplayCanvasRecording).toBeFalse()
-      expect(configuration.sessionReplayMaxCanvasFps).toBe(0)
+      expect(configuration.enableSessionReplayCanvasRecording).toBeUndefined()
     })
 
     it('stays disabled when requested without the experimental feature', () => {
       const configuration = validateAndBuildRumConfiguration({
         ...DEFAULT_INIT_CONFIGURATION,
-        enableSessionReplayCanvasRecording: true,
+        enableSessionReplayCanvasRecording: {},
       })!
 
-      expect(configuration.enableSessionReplayCanvasRecording).toBeFalse()
-      expect(configuration.sessionReplayMaxCanvasFps).toBe(0)
+      expect(configuration.enableSessionReplayCanvasRecording).toBeUndefined()
     })
 
     describe('when the experimental feature is enabled', () => {
@@ -354,21 +352,29 @@ describe('validateAndBuildRumConfiguration', () => {
       it('uses one frame per second by default when enabled', () => {
         const configuration = validateAndBuildRumConfiguration({
           ...DEFAULT_INIT_CONFIGURATION,
-          enableSessionReplayCanvasRecording: true,
+          enableSessionReplayCanvasRecording: {},
         })!
 
-        expect(configuration.enableSessionReplayCanvasRecording).toBeTrue()
-        expect(configuration.sessionReplayMaxCanvasFps).toBe(1)
+        expect(configuration.enableSessionReplayCanvasRecording).toEqual({ maxFramesPerSecond: 1 })
       })
 
       it('uses the configured frame rate', () => {
         const configuration = validateAndBuildRumConfiguration({
           ...DEFAULT_INIT_CONFIGURATION,
-          enableSessionReplayCanvasRecording: true,
-          sessionReplayMaxCanvasFps: 2.5,
+          enableSessionReplayCanvasRecording: { maxFramesPerSecond: 2.5 },
         })!
 
-        expect(configuration.sessionReplayMaxCanvasFps).toBe(2.5)
+        expect(configuration.enableSessionReplayCanvasRecording).toEqual({ maxFramesPerSecond: 2.5 })
+      })
+
+      it('rejects invalid canvas recording options', () => {
+        expect(
+          validateAndBuildRumConfiguration({
+            ...DEFAULT_INIT_CONFIGURATION,
+            enableSessionReplayCanvasRecording: true as any,
+          })
+        ).toBeUndefined()
+        expect(displayErrorSpy).toHaveBeenCalledOnceWith('"enableSessionReplayCanvasRecording" is not a valid object')
       })
     })
   })
@@ -923,8 +929,7 @@ describe('serializeRumConfiguration', () => {
       trackResourceHeaders: true,
       betaEnableViewUpdates: true,
       betaTrackWebSockets: false,
-      enableSessionReplayCanvasRecording: true,
-      sessionReplayMaxCanvasFps: 2.5,
+      enableSessionReplayCanvasRecording: { maxFramesPerSecond: 2.5 },
     }
 
     type MapRumInitConfigurationKey<Key extends string> = Key extends keyof InitConfiguration
@@ -940,12 +945,7 @@ describe('serializeRumConfiguration', () => {
           ? 'track_long_task' // We forgot the s, keeping this for backward compatibility
           : // The following options are not reported as telemetry. Please avoid adding more of them.
             // `remoteConfiguration` is covered by the legacy `remote_configuration_id` field.
-            Key extends
-                | 'applicationId'
-                | 'subdomain'
-                | 'remoteConfiguration'
-                | 'enableSessionReplayCanvasRecording'
-                | 'sessionReplayMaxCanvasFps'
+            Key extends 'applicationId' | 'subdomain' | 'remoteConfiguration' | 'enableSessionReplayCanvasRecording'
             ? never
             : CamelToSnakeCase<Key>
     // By specifying the type here, we can ensure that serializeConfiguration is returning an

packages/browser-rum-core/src/domain/configuration/configuration.ts

@@ -214,23 +214,21 @@ export interface RumInitConfiguration extends InitConfiguration {
   startSessionReplayRecordingManually?: boolean | undefined
 
   /**
-   * Enables recording canvas elements in Session Replay.
+   * Configures recording canvas elements in Session Replay. Canvas recording is disabled when this option is omitted.
    *
    * @category Session Replay
-   * @defaultValue false
-   * @hidden
-   */
-  enableSessionReplayCanvasRecording?: boolean | undefined
-
-  /**
-   * The maximum number of canvas frames recorded per second. Setting this option to `0` disables canvas frame recording.
-   * This option has no effect unless {@link RumInitConfiguration.enableSessionReplayCanvasRecording | enableSessionReplayCanvasRecording} is enabled.
-   *
-   * @category Session Replay
-   * @defaultValue 1
    * @hidden
    */
-  sessionReplayMaxCanvasFps?: number | undefined
+  enableSessionReplayCanvasRecording?:
+    | {
+        /**
+         * The maximum number of canvas frames recorded per second. Setting this option to `0` disables canvas frame recording.
+         *
+         * @defaultValue 1
+         */
+        maxFramesPerSecond?: number | undefined
+      }
+    | undefined
 
   /**
    * Enables privacy control for action names.
@@ -415,8 +413,12 @@ export const RUM_SCHEMA = {
   enablePrivacyForActionName: { type: 'boolean', default: true },
   propagateTraceBaggage: { type: 'boolean', default: true },
   startSessionReplayRecordingManually: { type: 'boolean', default: false, strict: false },
-  enableSessionReplayCanvasRecording: { type: 'boolean', default: false },
-  sessionReplayMaxCanvasFps: { type: 'number', min: 0, max: 5, default: 1 },
+  enableSessionReplayCanvasRecording: {
+    type: 'schema',
+    schema: {
+      maxFramesPerSecond: { type: 'number', min: 0, max: 5, default: 1 },
+    },
+  },
 
   // Enums
   defaultPrivacyLevel: {
@@ -509,14 +511,15 @@ export function validateAndBuildRumConfiguration(
     return
   }
 
-  const enableSessionReplayCanvasRecording =
-    config.enableSessionReplayCanvasRecording &&
-    isExperimentalFeatureEnabled(ExperimentalFeature.SESSION_REPLAY_RECORD_CANVAS)
+  const enableSessionReplayCanvasRecording = isExperimentalFeatureEnabled(
+    ExperimentalFeature.SESSION_REPLAY_RECORD_CANVAS
+  )
+    ? config.enableSessionReplayCanvasRecording
+    : undefined
 
   return {
     ...config,
     enableSessionReplayCanvasRecording,
-    sessionReplayMaxCanvasFps: enableSessionReplayCanvasRecording ? config.sessionReplayMaxCanvasFps : 0,
     allowedTracingUrls,
     beforeSend: config.beforeSend
       ? (catchUserErrors(config.beforeSend, 'beforeSend threw an error:') as typeof config.beforeSend)