@multiplayer-app/session-recorder-browser 2.0.18 → 2.0.24

package/dist/index.umd.js

@@ -24436,7 +24436,7 @@ const CONTINUOUS_DEBUGGING_TIMEOUT = 60000; // 1 minutes
 const DEBUG_SESSION_MAX_DURATION_SECONDS = 10 * 60 + 30; // TODO: move to shared config otel core
 const REMOTE_SESSION_RECORDING_START = 'remote-session-recording:start';
 const REMOTE_SESSION_RECORDING_STOP = 'remote-session-recording:stop';
-const PACKAGE_VERSION_EXPORT = "2.0.18" || 0;
+const PACKAGE_VERSION_EXPORT = "2.0.24" || 0;
 // Regex patterns for OpenTelemetry ignore URLs
 const OTEL_IGNORE_URLS = [
     // Traces endpoint
@@ -24521,8 +24521,11 @@ const BASE_CONFIG = {
     apiBaseUrl: _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_0__.MULTIPLAYER_BASE_API_URL,
     exporterEndpoint: _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_0__.MULTIPLAYER_OTEL_DEFAULT_TRACES_EXPORTER_HTTP_URL,
     recordCanvas: false,
-    inlineImages: true,
-    inlineStylesheet: true,
+    // Off by default: inlining reads pixels via canvas and requires CORS on cross-origin hosts (e.g. S3).
+    // Set true when asset URLs send Access-Control-Allow-Origin for your app origin.
+    inlineImages: false,
+    // Off by default: inlining fetches stylesheet text; cross-origin <link> assets need CORS when enabled.
+    inlineStylesheet: false,
     recordNavigation: true,
     schemifyDocSpanPayload: true,
     ignoreUrls: [],
@@ -24535,7 +24538,7 @@ const BASE_CONFIG = {
     widgetTextOverrides: DEFAULT_WIDGET_TEXT_CONFIG,
     useWebsocket: true,
     buffering: {
-        enabled: false,
+        enabled: true,
         windowMinutes: 0.5,
         snapshotIntervalMs: 20000,
     },
@@ -26141,6 +26144,7 @@ if (typeof XMLHttpRequest !== 'undefined') {
 
 class RecorderBrowserSDK {
     constructor() {
+        this.generation = 0;
         this.intervals = {
             restart: null,
             bufferSnapshot: null,
@@ -26176,12 +26180,15 @@ class RecorderBrowserSDK {
             throw new Error('Configuration not initialized. Call init() before start().');
         }
         this.startedAt = new Date().toISOString();
+        const gen = ++this.generation;
         this.stopFn = (0,rrweb__WEBPACK_IMPORTED_MODULE_6__.record)({
             ...this._buildRecordOptions(),
             emit: async (event) => {
+                if (gen !== this.generation)
+                    return;
                 const ts = event.timestamp;
                 if (!sessionId) {
-                    await this._handleBufferOnlyEvent(event, ts);
+                    await this._handleBufferOnlyEvent(event, ts, gen);
                     return;
                 }
                 this._handleLiveSessionEvent(event, ts, sessionId, sessionType);
@@ -26197,6 +26204,7 @@ class RecorderBrowserSDK {
         var _a;
         try {
             (_a = this.stopFn) === null || _a === void 0 ? void 0 : _a.call(this);
+            this.stopFn = undefined;
             this.start(sessionId, sessionType);
         }
         catch (_e) {
@@ -26210,6 +26218,7 @@ class RecorderBrowserSDK {
         var _a, _b, _c;
         (_a = this.stopFn) === null || _a === void 0 ? void 0 : _a.call(this);
         this.stopFn = undefined;
+        this.generation++;
         if (!((_b = this.config) === null || _b === void 0 ? void 0 : _b.useWebsocket)) {
             (_c = this.socketService) === null || _c === void 0 ? void 0 : _c.close();
         }
@@ -26249,13 +26258,15 @@ class RecorderBrowserSDK {
      * @param event - Event.
      * @param ts - Timestamp.
      */
-    async _handleBufferOnlyEvent(event, ts) {
+    async _handleBufferOnlyEvent(event, ts, gen) {
         if (!this.crashBuffer)
             return;
         try {
             this._applyConsoleMasking(event);
             const packedEvent = (0,_rrweb_packer__WEBPACK_IMPORTED_MODULE_0__.pack)(event);
             this.stoppedAt = new Date(ts).toISOString();
+            if (gen !== this.generation)
+                return;
             await this.crashBuffer.appendEvent({
                 ts,
                 isFullSnapshot: event.type === _rrweb_types__WEBPACK_IMPORTED_MODULE_1__.EventType.FullSnapshot,
@@ -26527,10 +26538,11 @@ class ApiService {
 
 
 class CrashBufferService {
-    constructor(db, tabId, windowMs) {
+    constructor(db, tabId, windowMs, ready = Promise.resolve()) {
         this.db = db;
         this.tabId = tabId;
         this.windowMs = windowMs;
+        this.ready = ready;
         this.lastPruneAt = 0;
         this.pruneInFlight = null;
         this.isActive = true;
@@ -26553,6 +26565,7 @@ class CrashBufferService {
         if (!this.isActive)
             return;
         const isFullSnapshot = Boolean(payload.isFullSnapshot);
+        await this.ready;
         await this._safe(async () => {
             await this.db.appendEvent({
                 tabId: this.tabId,
@@ -26573,6 +26586,7 @@ class CrashBufferService {
         if (!this.isActive)
             return;
         let errorEvent = null;
+        await this.ready;
         await this._safe(async () => {
             const records = payload.map((p) => {
                 var _a, _b;
@@ -26621,6 +26635,7 @@ class CrashBufferService {
     }
     async snapshot(_windowMs, now = Date.now()) {
         var _a, _b;
+        await this.ready;
         const stoppedAt = now;
         const startedAt = Math.max(0, stoppedAt - this.windowMs);
         // Always include a full snapshot "anchor" if one exists at/before the window start.
@@ -27258,6 +27273,8 @@ class SocketService extends lib0_observable__WEBPACK_IMPORTED_MODULE_4__.Observa
         this.sessionId = null;
         this.usePostMessage = false;
         this.isInitialized = false;
+        this.lastUserPayload = null;
+        this.lastSubscribeSession = null;
         this.options = {
             apiKey: '',
             socketUrl: '',
@@ -27320,6 +27337,15 @@ class SocketService extends lib0_observable__WEBPACK_IMPORTED_MODULE_4__.Observa
             this.isConnecting = false;
             this.isConnected = true;
             this.usePostMessage = false;
+            // Re-establish identity and session on every (re)connect: socket.io's auto-reconnect
+            // fires 'ready' again after a drop, but the server has no memory of the previous
+            // setUser/subscribe calls — the client must replay them.
+            if (this.lastUserPayload && this.socket) {
+                this.socket.emit(_config__WEBPACK_IMPORTED_MODULE_2__.SOCKET_SET_USER_EVENT, this.lastUserPayload);
+            }
+            if (this.lastSubscribeSession) {
+                this._emitSubscribe(this.lastSubscribeSession);
+            }
             this.flushQueue();
         });
         this.socket.on('disconnect', (err) => {
@@ -27386,16 +27412,33 @@ class SocketService extends lib0_observable__WEBPACK_IMPORTED_MODULE_4__.Observa
         this.emitSocketEvent(_config__WEBPACK_IMPORTED_MODULE_2__.SESSION_ADD_EVENT, event);
     }
     subscribeToSession(session) {
+        // Remember the session so reconnects replay subscribe + started.
+        this.lastSubscribeSession = session;
+        this._emitSubscribe(session);
+    }
+    _emitSubscribe(session) {
         this.sessionId = session.shortId || session._id;
-        const payload = {
+        const subscribePayload = {
             projectId: session.project,
             workspaceId: session.workspace,
             debugSessionId: this.sessionId,
             sessionType: session.creationType,
         };
-        this.emitSocketEvent(_config__WEBPACK_IMPORTED_MODULE_2__.SESSION_SUBSCRIBE_EVENT, payload);
-        // use long id instead of short id
-        this.emitSocketEvent(_config__WEBPACK_IMPORTED_MODULE_2__.SESSION_STARTED_EVENT, { debugSessionId: session._id });
+        const startedPayload = { debugSessionId: session._id };
+        // Send directly (not via the queue). The queue would cause a duplicate emit on
+        // the next 'ready' alongside the replay, since 'ready' also replays lastSubscribeSession.
+        if (this.usePostMessage) {
+            this.sendViaPostMessage(_config__WEBPACK_IMPORTED_MODULE_2__.SESSION_SUBSCRIBE_EVENT, subscribePayload);
+            this.sendViaPostMessage(_config__WEBPACK_IMPORTED_MODULE_2__.SESSION_STARTED_EVENT, startedPayload);
+        }
+        else if (this.socket && this.isConnected) {
+            this.socket.emit(_config__WEBPACK_IMPORTED_MODULE_2__.SESSION_SUBSCRIBE_EVENT, subscribePayload);
+            this.socket.emit(_config__WEBPACK_IMPORTED_MODULE_2__.SESSION_STARTED_EVENT, startedPayload);
+        }
+        else {
+            // Not connected: 'ready' will replay via lastSubscribeSession once the socket is up.
+            this._initConnection();
+        }
     }
     unsubscribeFromSession(stopSession) {
         if (this.sessionId) {
@@ -27404,9 +27447,23 @@ class SocketService extends lib0_observable__WEBPACK_IMPORTED_MODULE_4__.Observa
                 this.emitSocketEvent(_config__WEBPACK_IMPORTED_MODULE_2__.SESSION_STOPPED_EVENT, {});
             }
         }
+        this.lastSubscribeSession = null;
     }
     setUser(data) {
-        this.emitSocketEvent(_config__WEBPACK_IMPORTED_MODULE_2__.SOCKET_SET_USER_EVENT, data);
+        // Remember the last identity so 'ready' (initial connect + every reconnect) can replay it.
+        // Send directly here rather than queuing: the queue would cause a duplicate emit on the
+        // next 'ready' alongside the replay.
+        this.lastUserPayload = data;
+        if (this.usePostMessage) {
+            this.sendViaPostMessage(_config__WEBPACK_IMPORTED_MODULE_2__.SOCKET_SET_USER_EVENT, data);
+        }
+        else if (this.socket && this.isConnected) {
+            this.socket.emit(_config__WEBPACK_IMPORTED_MODULE_2__.SOCKET_SET_USER_EVENT, data);
+        }
+        else {
+            // Not connected yet: 'ready' will replay lastUserPayload once the socket is up.
+            this._initConnection();
+        }
     }
     close() {
         return new Promise((resolve) => {
@@ -27648,13 +27705,11 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_16__.Obse
             this._start();
         }
         else {
-            // Buffer-only recording when there is no active debug session.
             this._startBufferOnlyRecording();
         }
         this._registerWidgetEvents();
         this._registerSocketServiceListeners();
         _services_messaging_service__WEBPACK_IMPORTED_MODULE_9__["default"].sendMessage('state-change', this.sessionState);
-        // Emit init observable event
         this.emit('init', [this]);
     }
     _setupCrashBuffer() {
@@ -27662,7 +27717,8 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_16__.Obse
         if ((_a = this._configs.buffering) === null || _a === void 0 ? void 0 : _a.enabled) {
             const windowMinutes = this._configs.buffering.windowMinutes || 0.5;
             const windowMs = Math.max(10000, windowMinutes * 60 * 1000);
-            this._crashBuffer = new _services_crashBuffer_service__WEBPACK_IMPORTED_MODULE_13__.CrashBufferService(this._bufferDb, this._tabId, windowMs);
+            const ready = this._bufferDb.clearTab(this._tabId).catch(() => undefined);
+            this._crashBuffer = new _services_crashBuffer_service__WEBPACK_IMPORTED_MODULE_13__.CrashBufferService(this._bufferDb, this._tabId, windowMs, ready);
             this._recorder.setCrashBuffer(this._crashBuffer);
             this._tracer.setCrashBuffer(this._crashBuffer);
             this._crashBuffer.on('error-span-appended', (payload) => {
@@ -27714,10 +27770,14 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_16__.Obse
     }
     _startBufferOnlyRecording() {
         var _a, _b;
-        if (this.sessionId ||
-            !this._crashBuffer ||
-            !((_b = (_a = this._configs) === null || _a === void 0 ? void 0 : _a.buffering) === null || _b === void 0 ? void 0 : _b.enabled) ||
-            this.sessionState !== _types__WEBPACK_IMPORTED_MODULE_4__.SessionState.stopped) {
+        // NOTE: `this.sessionId` is intentionally NOT checked. `_stop()` runs
+        // before `_clearSession()` (the stopSession API call sits between them),
+        // so the clear().then() chain fires while sessionId is still set.
+        // Bailing on sessionId here meant rrweb never restarted after manual
+        // stop, leaving the buffer with no FullSnapshot and silently breaking
+        // exception-triggered flushBuffer. `_recorder.restart(null, ...)` passes
+        // null explicitly, so it's safe regardless of `this.sessionId`.
+        if (!this._crashBuffer || !((_b = (_a = this._configs) === null || _a === void 0 ? void 0 : _a.buffering) === null || _b === void 0 ? void 0 : _b.enabled) || this.sessionState !== _types__WEBPACK_IMPORTED_MODULE_4__.SessionState.stopped) {
             return;
         }
         void this._recorder.restart(null, _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_0__.SessionType.MANUAL);
@@ -27787,9 +27847,10 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_16__.Obse
     async stop(comment) {
         try {
             this._checkOperation('stop');
+            const sid = this.sessionId;
             this._stop();
             if (this.continuousRecording) {
-                await this._apiService.stopContinuousDebugSession(this.sessionId);
+                await this._apiService.stopContinuousDebugSession(sid);
                 this.sessionType = _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_0__.SessionType.MANUAL;
             }
             else {
@@ -27797,10 +27858,9 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_16__.Obse
                     sessionAttributes: { comment },
                     stoppedAt: this._recorder.stoppedAt,
                 };
-                const response = await this._apiService.stopSession(this.sessionId, request);
+                const response = await this._apiService.stopSession(sid, request);
                 _eventBus__WEBPACK_IMPORTED_MODULE_7__.recorderEventBus.emit(_config__WEBPACK_IMPORTED_MODULE_5__.SESSION_RESPONSE, response);
             }
-            this._clearSession();
         }
         catch (error) {
             this.error = error.message;
@@ -27836,15 +27896,15 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_16__.Obse
     async cancel() {
         try {
             this._checkOperation('cancel');
+            const sid = this.sessionId;
             this._stop();
             if (this.continuousRecording) {
-                await this._apiService.stopContinuousDebugSession(this.sessionId);
+                await this._apiService.stopContinuousDebugSession(sid);
                 this.sessionType = _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_0__.SessionType.MANUAL;
             }
             else {
-                await this._apiService.cancelSession(this.sessionId);
+                await this._apiService.cancelSession(sid);
             }
-            this._clearSession();
         }
         catch (error) {
             this.error = error.message;
@@ -27896,12 +27956,7 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_16__.Obse
         }
     }
     async _flushBuffer(sessionId) {
-        var _a, _b;
-        if (!sessionId ||
-            !this._crashBuffer ||
-            this._isFlushingBuffer ||
-            !((_b = (_a = this._configs) === null || _a === void 0 ? void 0 : _a.buffering) === null || _b === void 0 ? void 0 : _b.enabled) ||
-            this.sessionState !== _types__WEBPACK_IMPORTED_MODULE_4__.SessionState.stopped) {
+        if (!sessionId || !this._crashBuffer || this._isFlushingBuffer) {
             return null;
         }
         this._isFlushingBuffer = true;
@@ -28091,6 +28146,8 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_16__.Obse
         });
         this._socketService.on(_config__WEBPACK_IMPORTED_MODULE_5__.SESSION_SAVE_BUFFER_EVENT, (payload) => {
             var _a;
+            if (this.sessionState !== _types__WEBPACK_IMPORTED_MODULE_4__.SessionState.stopped)
+                return;
             this._flushBuffer((_a = payload === null || payload === void 0 ? void 0 : payload.debugSession) === null || _a === void 0 ? void 0 : _a._id);
         });
     }
@@ -28161,7 +28218,18 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_16__.Obse
         this._tracer.stop();
         this._recorder.stop();
         this._navigationRecorder.stop();
-        this._startBufferOnlyRecording();
+        // Clear session identity synchronously. The buffer-restart chain and the
+        // error-span-appended listener both gate on `this.sessionId === null`;
+        // deferring this to `_clearSession()` (after the network stopSession
+        // call) left them seeing a stale id and silently no-oping. Callers that
+        // need the id for the stop/cancel API must capture it before _stop().
+        this.session = null;
+        this.sessionId = null;
+        // rrweb assigns new node IDs on each record() call, so the next buffer
+        // segment must not carry events from the previous generation. Await the
+        // clear so its IDB tx can't race past the fresh FullSnapshot.
+        const cleared = this._crashBuffer ? this._crashBuffer.clear() : Promise.resolve();
+        void cleared.catch(() => undefined).then(() => this._startBufferOnlyRecording());
     }
     /**
      * Pause the session tracing and recording
@@ -56818,6 +56886,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   MULTIPLAYER_TRACE_SESSION_CACHE_PREFIX: () => (/* reexport safe */ _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_7__.MULTIPLAYER_TRACE_SESSION_CACHE_PREFIX),
 /* harmony export */   MULTIPLAYER_TRACE_SESSION_PREFIX: () => (/* reexport safe */ _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_7__.MULTIPLAYER_TRACE_SESSION_PREFIX),
 /* harmony export */   NavigationRecorder: () => (/* reexport safe */ _navigation__WEBPACK_IMPORTED_MODULE_6__.NavigationRecorder),
+/* harmony export */   SessionRecorder: () => (/* binding */ SessionRecorderInstance),
 /* harmony export */   SessionRecorderBrowserTraceExporter: () => (/* reexport safe */ _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_7__.SessionRecorderBrowserTraceExporter),
 /* harmony export */   SessionRecorderIdGenerator: () => (/* reexport safe */ _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_7__.SessionRecorderIdGenerator),
 /* harmony export */   SessionRecorderSdk: () => (/* reexport safe */ _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_7__.SessionRecorderSdk),
@@ -56865,6 +56934,7 @@ else {
     SessionRecorderInstance = new _session_recorder__WEBPACK_IMPORTED_MODULE_3__.SessionRecorder();
 }
 
+
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SessionRecorderInstance);
 
 })();