@statsig/session-replay 3.16.0 → 3.16.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@statsig/session-replay",
-  "version": "3.16.0",
+  "version": "3.16.1",
   "license": "ISC",
   "homepage": "https://github.com/statsig-io/js-client-monorepo",
   "repository": {
@@ -10,7 +10,7 @@
   },
   "dependencies": {
     "rrweb": "2.0.0-alpha.14",
-    "@statsig/client-core": "3.16.0"
+    "@statsig/client-core": "3.16.1"
   },
   "devDependencies": {
     "@rrweb/types": "2.0.0-alpha.14"

package/src/SessionReplay.d.ts

@@ -1,4 +1,5 @@
 import { PrecomputedEvaluationsInterface, StatsigPlugin } from '@statsig/client-core';
+import { EndReason, SessionReplayBase } from './SessionReplayBase';
 import { RRWebConfig } from './SessionReplayClient';
 type SessionReplayOptions = {
     rrwebConfig?: RRWebConfig;
@@ -11,24 +12,9 @@ export declare class StatsigSessionReplayPlugin implements StatsigPlugin<Precomp
     bind(client: PrecomputedEvaluationsInterface): void;
 }
 export declare function runStatsigSessionReplay(client: PrecomputedEvaluationsInterface, options?: SessionReplayOptions): void;
-export declare class SessionReplay {
-    private _client;
-    private _options?;
-    private _replayer;
-    private _sessionData;
-    private _events;
-    private _currentSessionID;
-    private _errorBoundary;
-    constructor(_client: PrecomputedEvaluationsInterface, _options?: SessionReplayOptions | undefined);
-    private _subscribeToVisibilityChanged;
-    forceStartRecording(): void;
-    private _onVisibilityChanged;
-    private _onRecordingEvent;
-    private _attemptToStartRecording;
-    private _shutdown;
-    private _logRecording;
-    private _logRecordingWithSessionID;
-    private _bumpSessionIdleTimerAndLogRecording;
-    private _getSessionIdFromClient;
+export declare class SessionReplay extends SessionReplayBase {
+    constructor(client: PrecomputedEvaluationsInterface, options?: SessionReplayOptions);
+    protected _shutdown(endReason?: EndReason): void;
+    protected _attemptToStartRecording(force?: boolean): void;
 }
 export {};

package/src/SessionReplay.js

@@ -2,11 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SessionReplay = exports.runStatsigSessionReplay = exports.StatsigSessionReplayPlugin = void 0;
 const client_core_1 = require("@statsig/client-core");
-const SessionReplayClient_1 = require("./SessionReplayClient");
-const SizeOf_1 = require("./SizeOf");
-const REPLAY_ENQUEUE_TRIGGER_BYTES = 1024 * 10; // 10 KB
-const REPLAY_SLICE_BYTES = 1024 * 1024; // 1 MB
-const MAX_INDIVIDUAL_EVENT_BYTES = 1024 * 1024 * 10; // 10 MB
+const SessionReplayBase_1 = require("./SessionReplayBase");
 class StatsigSessionReplayPlugin {
     constructor(options) {
         this.options = options;
@@ -21,81 +17,20 @@ function runStatsigSessionReplay(client, options) {
     new SessionReplay(client, options);
 }
 exports.runStatsigSessionReplay = runStatsigSessionReplay;
-class SessionReplay {
-    constructor(_client, _options) {
+class SessionReplay extends SessionReplayBase_1.SessionReplayBase {
+    constructor(client, options) {
         var _a;
-        this._client = _client;
-        this._options = _options;
-        this._sessionData = null;
-        this._events = [];
-        const { sdkKey, errorBoundary } = _client.getContext();
-        this._errorBoundary = errorBoundary;
-        this._errorBoundary.wrap(this);
-        if (!(0, client_core_1._isServerEnv)()) {
-            const statsigGlobal = (0, client_core_1._getStatsigGlobal)();
-            statsigGlobal.srInstances = Object.assign(Object.assign({}, statsigGlobal.srInstances), { [sdkKey]: this });
-        }
-        this._currentSessionID = this._getSessionIdFromClient();
-        this._replayer = new SessionReplayClient_1.SessionReplayClient();
-        this._client.$on('pre_shutdown', () => this._shutdown());
-        this._client.$on('values_updated', () => { var _a; return this._attemptToStartRecording((_a = this._options) === null || _a === void 0 ? void 0 : _a.forceRecording); });
-        this._client.on('session_expired', () => {
-            this._replayer.stop();
-            client_core_1.StatsigMetadataProvider.add({ isRecordingSession: 'false' });
-            this._logRecording('session_expired');
-        });
-        this._subscribeToVisibilityChanged();
-        this._attemptToStartRecording((_a = this._options) === null || _a === void 0 ? void 0 : _a.forceRecording);
-    }
-    _subscribeToVisibilityChanged() {
-        // Note: this exists as a separate function to ensure closure scope only contains `sdkKey`
-        const { sdkKey } = this._client.getContext();
-        (0, client_core_1._subscribeToVisiblityChanged)((vis) => {
-            var _a, _b;
-            const inst = (_b = (_a = (0, client_core_1._getStatsigGlobal)()) === null || _a === void 0 ? void 0 : _a.srInstances) === null || _b === void 0 ? void 0 : _b[sdkKey];
-            if (inst instanceof SessionReplay) {
-                inst._onVisibilityChanged(vis);
+        super(client, options);
+        this._client.$on('values_updated', () => {
+            var _a;
+            if (!this._wasStopped) {
+                this._attemptToStartRecording((_a = this._options) === null || _a === void 0 ? void 0 : _a.forceRecording);
             }
         });
+        this._attemptToStartRecording((_a = this._options) === null || _a === void 0 ? void 0 : _a.forceRecording);
     }
-    forceStartRecording() {
-        this._attemptToStartRecording(true);
-    }
-    _onVisibilityChanged(visibility) {
-        if (visibility !== 'background') {
-            return;
-        }
-        this._logRecording();
-        this._client.flush().catch((e) => {
-            this._errorBoundary.logError('SR::visibility', e);
-        });
-    }
-    _onRecordingEvent(event, data) {
-        // The session has expired so we should stop recording
-        if (this._currentSessionID !== this._getSessionIdFromClient()) {
-            this._replayer.stop();
-            client_core_1.StatsigMetadataProvider.add({ isRecordingSession: 'false' });
-            this._logRecording('session_expired');
-            return;
-        }
-        this._sessionData = data;
-        const eventApproxSize = (0, SizeOf_1._fastApproxSizeOf)(event, MAX_INDIVIDUAL_EVENT_BYTES);
-        if (eventApproxSize > MAX_INDIVIDUAL_EVENT_BYTES) {
-            client_core_1.Log.warn(`SessionReplay event is too large (~${eventApproxSize} bytes) and will not be logged`, event);
-            return;
-        }
-        const approxArraySizeBefore = (0, SizeOf_1._fastApproxSizeOf)(this._events, REPLAY_ENQUEUE_TRIGGER_BYTES);
-        this._events.push(event);
-        if (approxArraySizeBefore + eventApproxSize <
-            REPLAY_ENQUEUE_TRIGGER_BYTES) {
-            return;
-        }
-        if ((0, client_core_1._isCurrentlyVisible)()) {
-            this._bumpSessionIdleTimerAndLogRecording();
-        }
-        else {
-            this._logRecording();
-        }
+    _shutdown(endReason) {
+        super._shutdownImpl(endReason);
     }
     _attemptToStartRecording(force = false) {
         var _a, _b;
@@ -107,84 +42,11 @@ class SessionReplay {
         if (this._replayer.isRecording()) {
             return;
         }
+        this._wasStopped = false;
         client_core_1.StatsigMetadataProvider.add({ isRecordingSession: 'true' });
-        this._replayer.record((e, d) => this._onRecordingEvent(e, d), (_b = (_a = this._options) === null || _a === void 0 ? void 0 : _a.rrwebConfig) !== null && _b !== void 0 ? _b : {});
-    }
-    _shutdown() {
-        this._replayer.stop();
-        client_core_1.StatsigMetadataProvider.add({ isRecordingSession: 'false' });
-        if (this._events.length === 0 || this._sessionData == null) {
-            return;
-        }
-        this._logRecording();
-    }
-    _logRecording(endReason) {
-        if (this._events.length === 0 || this._sessionData == null) {
-            return;
-        }
-        endReason = (0, client_core_1._isUnloading)() ? 'is_leaving_page' : endReason;
-        this._logRecordingWithSessionID(this._currentSessionID, endReason);
-    }
-    _logRecordingWithSessionID(sessionID, endReason) {
-        const data = this._sessionData;
-        if (data === null || this._events.length === 0) {
-            return;
-        }
-        const payload = JSON.stringify(this._events);
-        const parts = _slicePayload(payload);
-        const slicedID = parts.length > 1 ? (0, client_core_1.getUUID)() : null;
-        for (let i = 0; i < parts.length; i++) {
-            const slice = parts[i];
-            const event = _makeLoggableRrwebEvent(slice, payload, sessionID, data);
-            if (slicedID != null) {
-                _appendSlicedMetadata(event.metadata, slicedID, i, parts.length, slice.length);
-            }
-            if (endReason) {
-                event.metadata[endReason] = 'true';
-            }
-            this._client.logEvent(event);
-            if (slicedID != null) {
-                this._client.flush().catch((e) => {
-                    client_core_1.Log.error(e);
-                });
-            }
-        }
-        this._events = [];
-    }
-    _bumpSessionIdleTimerAndLogRecording() {
-        this._getSessionIdFromClient();
-        this._logRecording();
-    }
-    _getSessionIdFromClient() {
-        return this._client.getContext().session.data.sessionID;
+        this._replayer.record((e, d) => this._onRecordingEvent(e, d), (_b = (_a = this._options) === null || _a === void 0 ? void 0 : _a.rrwebConfig) !== null && _b !== void 0 ? _b : {}, () => {
+            this._shutdown();
+        });
     }
 }
 exports.SessionReplay = SessionReplay;
-function _slicePayload(payload) {
-    const parts = [];
-    for (let i = 0; i < payload.length; i += REPLAY_SLICE_BYTES) {
-        parts.push(payload.slice(i, i + REPLAY_SLICE_BYTES));
-    }
-    return parts;
-}
-function _makeLoggableRrwebEvent(slice, payload, sessionID, data) {
-    const metadata = {
-        session_start_ts: String(data.startTime),
-        session_end_ts: String(data.endTime),
-        clicks_captured_cumulative: String(data.clickCount),
-        rrweb_events: slice,
-        rrweb_payload_size: String(payload.length),
-        session_replay_sdk_version: client_core_1.SDK_VERSION,
-    };
-    return {
-        eventName: 'statsig::session_recording',
-        value: sessionID,
-        metadata,
-    };
-}
-function _appendSlicedMetadata(metadata, slicedID, sliceIndex, sliceCount, sliceByteSize) {
-    metadata.sliced_id = slicedID;
-    metadata.slice_index = String(sliceIndex);
-    metadata.slice_count = String(sliceCount);
-    metadata.slice_byte_size = String(sliceByteSize);
-}

package/src/SessionReplayBase.d.ts

@@ -0,0 +1,33 @@
+import { ErrorBoundary, PrecomputedEvaluationsInterface } from '@statsig/client-core';
+import { RRWebConfig, ReplayEvent, ReplaySessionData, SessionReplayClient } from './SessionReplayClient';
+type SessionReplayOptions = {
+    rrwebConfig?: RRWebConfig;
+    forceRecording?: boolean;
+};
+export type EndReason = 'is_leaving_page' | 'session_expired';
+export declare abstract class SessionReplayBase {
+    protected _sessionData: ReplaySessionData;
+    protected _events: ReplayEvent[];
+    protected _currentSessionID: string;
+    protected _errorBoundary: ErrorBoundary;
+    protected _client: PrecomputedEvaluationsInterface;
+    protected _options?: SessionReplayOptions;
+    protected _replayer: SessionReplayClient;
+    protected _wasStopped: boolean;
+    protected _currentEventIndex: number;
+    constructor(client: PrecomputedEvaluationsInterface, options?: SessionReplayOptions);
+    forceStartRecording(): void;
+    stopRecording(): void;
+    isRecording(): boolean;
+    protected abstract _attemptToStartRecording(force?: boolean): void;
+    protected _logRecording(endReason?: EndReason): void;
+    private _onVisibilityChanged;
+    protected _subscribeToVisibilityChanged(): void;
+    protected _logRecordingWithSessionID(sessionID: string, endReason?: EndReason): void;
+    protected _bumpSessionIdleTimerAndLogRecording(): void;
+    protected _getSessionIdFromClient(): string;
+    protected abstract _shutdown(endReason?: EndReason): void;
+    protected _shutdownImpl(endReason?: EndReason): void;
+    protected _onRecordingEvent(event: ReplayEvent, data: ReplaySessionData): void;
+}
+export {};

package/src/SessionReplayBase.js

@@ -0,0 +1,150 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SessionReplayBase = void 0;
+const client_core_1 = require("@statsig/client-core");
+const SessionReplayClient_1 = require("./SessionReplayClient");
+const SessionReplayUtils_1 = require("./SessionReplayUtils");
+const SizeOf_1 = require("./SizeOf");
+class SessionReplayBase {
+    constructor(client, options) {
+        this._sessionData = {
+            startTime: 0,
+            endTime: 0,
+            clickCount: 0,
+        };
+        this._events = [];
+        this._wasStopped = false;
+        this._currentEventIndex = 0;
+        this._client = client;
+        this._options = options;
+        const { sdkKey, errorBoundary } = this._client.getContext();
+        this._errorBoundary = errorBoundary;
+        this._errorBoundary.wrap(this);
+        this._replayer = new SessionReplayClient_1.SessionReplayClient();
+        this._client.$on('pre_shutdown', () => this._shutdown());
+        this._client.on('session_expired', () => {
+            this._shutdown('session_expired');
+        });
+        if (!(0, client_core_1._isServerEnv)()) {
+            const statsigGlobal = (0, client_core_1._getStatsigGlobal)();
+            statsigGlobal.srInstances = Object.assign(Object.assign({}, statsigGlobal.srInstances), { [sdkKey]: this });
+        }
+        this._currentSessionID = this._getSessionIdFromClient();
+        this._subscribeToVisibilityChanged();
+    }
+    forceStartRecording() {
+        this._wasStopped = false;
+        this._attemptToStartRecording(true);
+    }
+    stopRecording() {
+        this._wasStopped = true;
+        this._shutdown();
+    }
+    isRecording() {
+        return this._replayer.isRecording();
+    }
+    _logRecording(endReason) {
+        if (this._events.length === 0) {
+            return;
+        }
+        endReason = (0, client_core_1._isUnloading)() ? 'is_leaving_page' : endReason;
+        this._logRecordingWithSessionID(this._currentSessionID, endReason);
+    }
+    _onVisibilityChanged(visibility) {
+        if (visibility !== 'background') {
+            return;
+        }
+        this._logRecording();
+        this._client.flush().catch((e) => {
+            this._errorBoundary.logError('SR::visibility', e);
+        });
+    }
+    _subscribeToVisibilityChanged() {
+        // Note: this exists as a separate function to ensure closure scope only contains `sdkKey`
+        const { sdkKey } = this._client.getContext();
+        (0, client_core_1._subscribeToVisiblityChanged)((vis) => {
+            var _a, _b;
+            const inst = (_b = (_a = (0, client_core_1._getStatsigGlobal)()) === null || _a === void 0 ? void 0 : _a.srInstances) === null || _b === void 0 ? void 0 : _b[sdkKey];
+            if (inst instanceof SessionReplayBase) {
+                inst._onVisibilityChanged(vis);
+            }
+        });
+    }
+    _logRecordingWithSessionID(sessionID, endReason) {
+        const data = this._sessionData;
+        if (this._events.length === 0) {
+            return;
+        }
+        const payload = JSON.stringify(this._events);
+        const parts = (0, SessionReplayUtils_1._slicePayload)(payload);
+        const slicedID = parts.length > 1 ? (0, client_core_1.getUUID)() : null;
+        for (let i = 0; i < parts.length; i++) {
+            const slice = parts[i];
+            const event = (0, SessionReplayUtils_1._makeLoggableRrwebEvent)(slice, payload, sessionID, data);
+            if (slicedID != null) {
+                (0, SessionReplayUtils_1._appendSlicedMetadata)(event.metadata, slicedID, i, parts.length, slice.length);
+            }
+            if (endReason) {
+                event.metadata[endReason] = 'true';
+            }
+            this._client.logEvent(event);
+            if (slicedID != null) {
+                this._client.flush().catch((e) => {
+                    client_core_1.Log.error(e);
+                });
+            }
+        }
+        this._events = [];
+    }
+    _bumpSessionIdleTimerAndLogRecording() {
+        this._getSessionIdFromClient();
+        this._logRecording();
+    }
+    _getSessionIdFromClient() {
+        return this._client.getContext().session.data.sessionID;
+    }
+    _shutdownImpl(endReason) {
+        this._replayer.stop();
+        client_core_1.StatsigMetadataProvider.add({ isRecordingSession: 'false' });
+        this._currentEventIndex = 0;
+        if (this._events.length === 0) {
+            return;
+        }
+        this._logRecording(endReason);
+        this._sessionData = {
+            startTime: 0,
+            endTime: 0,
+            clickCount: 0,
+        };
+    }
+    _onRecordingEvent(event, data) {
+        // The session has expired so we should stop recording
+        if (this._currentSessionID !== this._getSessionIdFromClient()) {
+            this._shutdown('session_expired');
+            return;
+        }
+        event.eventIndex = this._currentEventIndex++;
+        // Update the session data
+        this._sessionData.clickCount += data.clickCount;
+        this._sessionData.startTime = Math.min(this._sessionData.startTime, data.startTime);
+        this._sessionData.endTime = Math.max(this._sessionData.endTime, data.endTime);
+        const eventApproxSize = (0, SizeOf_1._fastApproxSizeOf)(event, SessionReplayUtils_1.MAX_INDIVIDUAL_EVENT_BYTES);
+        if (eventApproxSize > SessionReplayUtils_1.MAX_INDIVIDUAL_EVENT_BYTES) {
+            client_core_1.Log.warn(`SessionReplay event is too large (~${eventApproxSize} bytes) and will not be logged`, event);
+            return;
+        }
+        const approxArraySizeBefore = (0, SizeOf_1._fastApproxSizeOf)(this._events, SessionReplayUtils_1.REPLAY_ENQUEUE_TRIGGER_BYTES);
+        this._events.push(event);
+        if (approxArraySizeBefore + eventApproxSize <
+            SessionReplayUtils_1.REPLAY_ENQUEUE_TRIGGER_BYTES) {
+            return;
+        }
+        if ((0, client_core_1._isCurrentlyVisible)()) {
+            this._bumpSessionIdleTimerAndLogRecording();
+        }
+        else {
+            this._logRecording();
+        }
+    }
+}
+exports.SessionReplayBase = SessionReplayBase;

package/src/SessionReplayClient.d.ts

@@ -15,9 +15,8 @@ export declare class SessionReplayClient {
     private _stopCallback?;
     private _startTimestamp;
     private _endTimestamp;
-    private _clickCount;
     private _eventCounter;
-    record(callback: (latest: ReplayEvent, data: ReplaySessionData) => void, config: RRWebConfig, stopCallback?: () => void): void;
+    record(callback: (latest: ReplayEvent, data: ReplaySessionData, isCheckout?: boolean) => void, config: RRWebConfig, stopCallback?: () => void, keepRollingWindow?: boolean): void;
     stop(): void;
     isRecording(): boolean;
 }

package/src/SessionReplayClient.js

@@ -4,49 +4,57 @@ exports.SessionReplayClient = void 0;
 const rrweb = require("rrweb");
 const client_core_1 = require("@statsig/client-core");
 const TIMEOUT_MS = 1000 * 60 * 60 * 4; // 4 hours
+const CHECKOUT_WINDOW_MS = 1000 * 60; // 1 minute
 class SessionReplayClient {
     constructor() {
         this._startTimestamp = null;
         this._endTimestamp = null;
-        this._clickCount = 0;
         this._eventCounter = 0;
     }
-    record(callback, config, stopCallback) {
+    record(callback, config, stopCallback, keepRollingWindow = false) {
         if ((0, client_core_1._getDocumentSafe)() == null) {
             return;
         }
         // Always reset session id and tracking fields for a new recording
         this._startTimestamp = null;
         this._endTimestamp = null;
-        this._clickCount = 0;
         this._eventCounter = 0;
         this._stopCallback = stopCallback;
         if (this._stopFn) {
             return;
         }
-        const emit = (event) => {
-            var _a, _b;
-            // Reset start only for the first event
-            (_a = this._startTimestamp) !== null && _a !== void 0 ? _a : (this._startTimestamp = event.timestamp);
+        const emit = (event, isCheckOut) => {
+            var _a, _b, _c;
+            if (keepRollingWindow) {
+                // Reset start at each checkout
+                this._startTimestamp = isCheckOut
+                    ? event.timestamp
+                    : (_a = this._startTimestamp) !== null && _a !== void 0 ? _a : event.timestamp;
+            }
+            else {
+                // Reset start only for the first event
+                (_b = this._startTimestamp) !== null && _b !== void 0 ? _b : (this._startTimestamp = event.timestamp);
+            }
             // Always keep a running end timestamp
             this._endTimestamp = event.timestamp;
+            let clickCount = 0;
             // Count clicks only for events representing a click
             if (_isClickEvent(event)) {
-                this._clickCount++;
+                clickCount++;
             }
-            callback(Object.assign(Object.assign({}, event), { eventIndex: this._eventCounter++ }), {
+            callback(Object.assign(Object.assign({}, event), { eventIndex: 0 }), {
                 startTime: this._startTimestamp,
                 endTime: this._endTimestamp,
-                clickCount: this._clickCount,
-            });
+                clickCount,
+            }, isCheckOut !== null && isCheckOut !== void 0 ? isCheckOut : false);
             if (this._endTimestamp - this._startTimestamp > TIMEOUT_MS) {
-                (_b = this._stopFn) === null || _b === void 0 ? void 0 : _b.call(this);
+                (_c = this._stopFn) === null || _c === void 0 ? void 0 : _c.call(this);
                 if (this._stopCallback) {
                     this._stopCallback();
                 }
             }
         };
-        this._stopFn = _minifiedAwareRecord(emit, config);
+        this._stopFn = _minifiedAwareRecord(emit, config, keepRollingWindow);
     }
     stop() {
         if (this._stopFn) {
@@ -63,9 +71,14 @@ exports.SessionReplayClient = SessionReplayClient;
  * We do a simple concat of rrweb during minification.
  * This function ensures we handle both "npm" and "<script ..>" install options.
  */
-function _minifiedAwareRecord(emit, config) {
+function _minifiedAwareRecord(emit, config, keepRollingWindow) {
     const record = typeof rrweb === 'function' ? rrweb : rrweb.record;
-    return record(Object.assign(Object.assign({}, config), { emit }));
+    if (keepRollingWindow) {
+        return record(Object.assign(Object.assign({}, config), { emit, checkoutEveryNms: CHECKOUT_WINDOW_MS }));
+    }
+    else {
+        return record(Object.assign(Object.assign({}, config), { emit }));
+    }
 }
 function _isClickEvent(event) {
     // we use the raw number so we can support the minified rrweb file.

package/src/SessionReplayUtils.d.ts

@@ -0,0 +1,23 @@
+import { StatsigEvent } from '@statsig/client-core';
+import { ReplaySessionData } from './SessionReplayClient';
+export type RRWebPayload = {
+    session_start_ts: string;
+    session_end_ts: string;
+    clicks_captured_cumulative: string;
+    rrweb_events: string;
+    rrweb_payload_size: string;
+    session_replay_sdk_version: string;
+    sliced_id?: string;
+    slice_index?: string;
+    slice_count?: string;
+    slice_byte_size?: string;
+    is_leaving_page?: string;
+    session_expired?: string;
+};
+export declare const REPLAY_ENQUEUE_TRIGGER_BYTES: number;
+export declare const MAX_INDIVIDUAL_EVENT_BYTES: number;
+export declare function _makeLoggableRrwebEvent(slice: string, payload: string, sessionID: string, data: ReplaySessionData): StatsigEvent & {
+    metadata: RRWebPayload;
+};
+export declare function _slicePayload(payload: string): string[];
+export declare function _appendSlicedMetadata(metadata: RRWebPayload, slicedID: string, sliceIndex: number, sliceCount: number, sliceByteSize: number): void;

package/src/SessionReplayUtils.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports._appendSlicedMetadata = exports._slicePayload = exports._makeLoggableRrwebEvent = exports.MAX_INDIVIDUAL_EVENT_BYTES = exports.REPLAY_ENQUEUE_TRIGGER_BYTES = void 0;
+const client_core_1 = require("@statsig/client-core");
+const REPLAY_SLICE_BYTES = 1024 * 1024; // 1 MB
+exports.REPLAY_ENQUEUE_TRIGGER_BYTES = 1024 * 10; // 10 KB
+exports.MAX_INDIVIDUAL_EVENT_BYTES = 1024 * 1024 * 10; // 10 MB
+function _makeLoggableRrwebEvent(slice, payload, sessionID, data) {
+    const metadata = {
+        session_start_ts: String(data.startTime),
+        session_end_ts: String(data.endTime),
+        clicks_captured_cumulative: String(data.clickCount),
+        rrweb_events: slice,
+        rrweb_payload_size: String(payload.length),
+        session_replay_sdk_version: client_core_1.SDK_VERSION,
+    };
+    return {
+        eventName: 'statsig::session_recording',
+        value: sessionID,
+        metadata,
+    };
+}
+exports._makeLoggableRrwebEvent = _makeLoggableRrwebEvent;
+function _slicePayload(payload) {
+    const parts = [];
+    for (let i = 0; i < payload.length; i += REPLAY_SLICE_BYTES) {
+        parts.push(payload.slice(i, i + REPLAY_SLICE_BYTES));
+    }
+    return parts;
+}
+exports._slicePayload = _slicePayload;
+function _appendSlicedMetadata(metadata, slicedID, sliceIndex, sliceCount, sliceByteSize) {
+    metadata.sliced_id = slicedID;
+    metadata.slice_index = String(sliceIndex);
+    metadata.slice_count = String(sliceCount);
+    metadata.slice_byte_size = String(sliceByteSize);
+}
+exports._appendSlicedMetadata = _appendSlicedMetadata;

package/src/TriggeredSessionReplay.d.ts

@@ -0,0 +1,34 @@
+import { PrecomputedEvaluationsInterface, StatsigPlugin } from '@statsig/client-core';
+import { EndReason, SessionReplayBase } from './SessionReplayBase';
+import { RRWebConfig, ReplayEvent, ReplaySessionData } from './SessionReplayClient';
+type SessionReplayOptions = {
+    rrwebConfig?: RRWebConfig;
+    forceRecording?: boolean;
+};
+export type TriggeredSessionReplayOptions = {
+    autoStartRecording?: boolean;
+    keepRollingWindow?: boolean;
+} & SessionReplayOptions;
+export declare class StatsigTriggeredSessionReplayPlugin implements StatsigPlugin<PrecomputedEvaluationsInterface> {
+    private readonly options?;
+    readonly __plugin = "triggered-session-replay";
+    constructor(options?: TriggeredSessionReplayOptions | undefined);
+    bind(client: PrecomputedEvaluationsInterface): void;
+}
+export declare function runStatsigSessionReplay(client: PrecomputedEvaluationsInterface, options?: SessionReplayOptions): void;
+export declare function startRecording(sdkKey: string): void;
+export declare function stopRecording(sdkKey: string): void;
+export declare class TriggeredSessionReplay extends SessionReplayBase {
+    private _runningEventData;
+    private _isActiveRecording;
+    constructor(client: PrecomputedEvaluationsInterface, options?: TriggeredSessionReplayOptions);
+    startRecording(): void;
+    forceStartRecording(): void;
+    stopRecording(): void;
+    private _handleStartActiveRecording;
+    protected _shutdown(endReason?: EndReason): void;
+    protected _onRecordingEvent(event: ReplayEvent, data: ReplaySessionData, isCheckOut?: boolean): void;
+    protected _attemptToStartRollingWindow(): void;
+    protected _attemptToStartRecording(force?: boolean): void;
+}
+export {};

package/src/TriggeredSessionReplay.js

@@ -0,0 +1,156 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TriggeredSessionReplay = exports.stopRecording = exports.startRecording = exports.runStatsigSessionReplay = exports.StatsigTriggeredSessionReplayPlugin = void 0;
+const client_core_1 = require("@statsig/client-core");
+const SessionReplayBase_1 = require("./SessionReplayBase");
+class StatsigTriggeredSessionReplayPlugin {
+    constructor(options) {
+        this.options = options;
+        this.__plugin = 'triggered-session-replay';
+    }
+    bind(client) {
+        runStatsigSessionReplay(client, this.options);
+    }
+}
+exports.StatsigTriggeredSessionReplayPlugin = StatsigTriggeredSessionReplayPlugin;
+function runStatsigSessionReplay(client, options) {
+    new TriggeredSessionReplay(client, options);
+}
+exports.runStatsigSessionReplay = runStatsigSessionReplay;
+function startRecording(sdkKey) {
+    var _a, _b;
+    const inst = (_b = (_a = (0, client_core_1._getStatsigGlobal)()) === null || _a === void 0 ? void 0 : _a.srInstances) === null || _b === void 0 ? void 0 : _b[sdkKey];
+    if (inst instanceof TriggeredSessionReplay) {
+        inst.startRecording();
+    }
+}
+exports.startRecording = startRecording;
+function stopRecording(sdkKey) {
+    var _a, _b;
+    const inst = (_b = (_a = (0, client_core_1._getStatsigGlobal)()) === null || _a === void 0 ? void 0 : _a.srInstances) === null || _b === void 0 ? void 0 : _b[sdkKey];
+    if (inst instanceof TriggeredSessionReplay) {
+        inst.stopRecording();
+    }
+}
+exports.stopRecording = stopRecording;
+class TriggeredSessionReplay extends SessionReplayBase_1.SessionReplayBase {
+    constructor(client, options) {
+        var _a;
+        super(client, options);
+        this._runningEventData = [];
+        this._isActiveRecording = false;
+        this._client.$on('values_updated', () => {
+            var _a;
+            if (!this._wasStopped) {
+                if (options === null || options === void 0 ? void 0 : options.autoStartRecording) {
+                    this._attemptToStartRecording((_a = this._options) === null || _a === void 0 ? void 0 : _a.forceRecording);
+                }
+                else if (options === null || options === void 0 ? void 0 : options.keepRollingWindow) {
+                    this._attemptToStartRollingWindow();
+                }
+            }
+        });
+        if (options === null || options === void 0 ? void 0 : options.autoStartRecording) {
+            this._attemptToStartRecording((_a = this._options) === null || _a === void 0 ? void 0 : _a.forceRecording);
+        }
+        else if (options === null || options === void 0 ? void 0 : options.keepRollingWindow) {
+            this._attemptToStartRollingWindow();
+        }
+    }
+    startRecording() {
+        var _a;
+        this._wasStopped = false;
+        this._attemptToStartRecording((_a = this._options) === null || _a === void 0 ? void 0 : _a.forceRecording);
+    }
+    forceStartRecording() {
+        super.forceStartRecording();
+    }
+    stopRecording() {
+        this._isActiveRecording = false;
+        this._runningEventData = [];
+        super.stopRecording();
+    }
+    _handleStartActiveRecording() {
+        this._isActiveRecording = true;
+        if (this._runningEventData.length === 0) {
+            return;
+        }
+        const currentEvents = this._runningEventData.map((e) => e.events).flat();
+        for (let i = 0; i < currentEvents.length; i++) {
+            currentEvents[i].event.eventIndex = i;
+            this._sessionData.clickCount += currentEvents[i].data.clickCount;
+            this._sessionData.startTime = Math.min(this._sessionData.startTime, currentEvents[i].data.startTime);
+            this._sessionData.endTime = Math.max(this._sessionData.endTime, currentEvents[i].data.endTime);
+        }
+        this._events = currentEvents.map((e) => e.event);
+        this._currentEventIndex = currentEvents.length;
+        if ((0, client_core_1._isCurrentlyVisible)()) {
+            this._bumpSessionIdleTimerAndLogRecording();
+        }
+        else {
+            this._logRecording();
+        }
+    }
+    _shutdown(endReason) {
+        this._isActiveRecording = false;
+        this._runningEventData = [];
+        super._shutdownImpl(endReason);
+    }
+    _onRecordingEvent(event, data, isCheckOut) {
+        if (!this._isActiveRecording) {
+            // The session has expired so we should clear the current data
+            if (this._currentSessionID !== this._getSessionIdFromClient()) {
+                this._shutdown('session_expired');
+                return;
+            }
+            if ((isCheckOut && event.type === 4) || // Type 4 and type 2 both show up as checkout events but we only want to start a new entry for type 4
+                this._runningEventData.length === 0) {
+                // We only want to keep two entries
+                if (this._runningEventData.length > 1) {
+                    this._runningEventData.shift();
+                }
+                this._runningEventData.push({ events: [{ event, data }] });
+            }
+            else {
+                this._runningEventData[this._runningEventData.length - 1].events.push({
+                    event,
+                    data,
+                });
+            }
+            return;
+        }
+        super._onRecordingEvent(event, data);
+    }
+    _attemptToStartRollingWindow() {
+        var _a, _b;
+        const values = this._client.getContext().values;
+        if ((values === null || values === void 0 ? void 0 : values.can_record_session) !== true) {
+            this._shutdown();
+            return;
+        }
+        if (this._replayer.isRecording()) {
+            return;
+        }
+        this._replayer.record((e, d, isCheckOut) => this._onRecordingEvent(e, d, isCheckOut), (_b = (_a = this._options) === null || _a === void 0 ? void 0 : _a.rrwebConfig) !== null && _b !== void 0 ? _b : {}, () => {
+            this._shutdown();
+        }, true);
+    }
+    _attemptToStartRecording(force = false) {
+        var _a, _b;
+        const values = this._client.getContext().values;
+        if (!force && (values === null || values === void 0 ? void 0 : values.can_record_session) !== true) {
+            this._shutdown();
+            return;
+        }
+        this._handleStartActiveRecording();
+        this._wasStopped = false;
+        client_core_1.StatsigMetadataProvider.add({ isRecordingSession: 'true' });
+        if (this._replayer.isRecording()) {
+            return;
+        }
+        this._replayer.record((e, d, isCheckOut) => this._onRecordingEvent(e, d, isCheckOut), (_b = (_a = this._options) === null || _a === void 0 ? void 0 : _a.rrwebConfig) !== null && _b !== void 0 ? _b : {}, () => {
+            this._shutdown();
+        });
+    }
+}
+exports.TriggeredSessionReplay = TriggeredSessionReplay;

package/src/index.d.ts

@@ -1,4 +1,5 @@
 import { SessionReplay, StatsigSessionReplayPlugin, runStatsigSessionReplay } from './SessionReplay';
 import { SessionReplayClient } from './SessionReplayClient';
+import { StatsigTriggeredSessionReplayPlugin, startRecording, stopRecording } from './TriggeredSessionReplay';
 export type { ReplaySessionData as ReplayData, ReplayEvent, } from './SessionReplayClient';
-export { SessionReplayClient, SessionReplay, runStatsigSessionReplay, StatsigSessionReplayPlugin, };
+export { SessionReplayClient, SessionReplay, runStatsigSessionReplay, StatsigSessionReplayPlugin, StatsigTriggeredSessionReplayPlugin, startRecording, stopRecording, };

package/src/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.StatsigSessionReplayPlugin = exports.runStatsigSessionReplay = exports.SessionReplay = exports.SessionReplayClient = void 0;
+exports.stopRecording = exports.startRecording = exports.StatsigTriggeredSessionReplayPlugin = exports.StatsigSessionReplayPlugin = exports.runStatsigSessionReplay = exports.SessionReplay = exports.SessionReplayClient = void 0;
 const client_core_1 = require("@statsig/client-core");
 const SessionReplay_1 = require("./SessionReplay");
 Object.defineProperty(exports, "SessionReplay", { enumerable: true, get: function () { return SessionReplay_1.SessionReplay; } });
@@ -8,6 +8,10 @@ Object.defineProperty(exports, "StatsigSessionReplayPlugin", { enumerable: true,
 Object.defineProperty(exports, "runStatsigSessionReplay", { enumerable: true, get: function () { return SessionReplay_1.runStatsigSessionReplay; } });
 const SessionReplayClient_1 = require("./SessionReplayClient");
 Object.defineProperty(exports, "SessionReplayClient", { enumerable: true, get: function () { return SessionReplayClient_1.SessionReplayClient; } });
+const TriggeredSessionReplay_1 = require("./TriggeredSessionReplay");
+Object.defineProperty(exports, "StatsigTriggeredSessionReplayPlugin", { enumerable: true, get: function () { return TriggeredSessionReplay_1.StatsigTriggeredSessionReplayPlugin; } });
+Object.defineProperty(exports, "startRecording", { enumerable: true, get: function () { return TriggeredSessionReplay_1.startRecording; } });
+Object.defineProperty(exports, "stopRecording", { enumerable: true, get: function () { return TriggeredSessionReplay_1.stopRecording; } });
 Object.assign((0, client_core_1._getStatsigGlobal)(), {
     SessionReplayClient: SessionReplayClient_1.SessionReplayClient,
     SessionReplay: SessionReplay_1.SessionReplay,