@multiplayer-app/session-recorder-browser 1.2.37 → 1.3.0

package/dist/browser/index.js

@@ -25065,6 +25065,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   OTEL_IGNORE_URLS: () => (/* binding */ OTEL_IGNORE_URLS),
 /* harmony export */   OTEL_MP_SAMPLE_TRACE_RATIO: () => (/* binding */ OTEL_MP_SAMPLE_TRACE_RATIO),
 /* harmony export */   PACKAGE_VERSION_EXPORT: () => (/* binding */ PACKAGE_VERSION_EXPORT),
+/* harmony export */   REMOTE_SESSION_RECORDING_START: () => (/* binding */ REMOTE_SESSION_RECORDING_START),
+/* harmony export */   REMOTE_SESSION_RECORDING_STOP: () => (/* binding */ REMOTE_SESSION_RECORDING_STOP),
 /* harmony export */   SESSION_ADD_EVENT: () => (/* binding */ SESSION_ADD_EVENT),
 /* harmony export */   SESSION_AUTO_CREATED: () => (/* binding */ SESSION_AUTO_CREATED),
 /* harmony export */   SESSION_ID_PROP_NAME: () => (/* binding */ SESSION_ID_PROP_NAME),
@@ -25076,7 +25078,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   SESSION_STOPPED_EVENT: () => (/* binding */ SESSION_STOPPED_EVENT),
 /* harmony export */   SESSION_SUBSCRIBE_EVENT: () => (/* binding */ SESSION_SUBSCRIBE_EVENT),
 /* harmony export */   SESSION_TYPE_PROP_NAME: () => (/* binding */ SESSION_TYPE_PROP_NAME),
-/* harmony export */   SESSION_UNSUBSCRIBE_EVENT: () => (/* binding */ SESSION_UNSUBSCRIBE_EVENT)
+/* harmony export */   SESSION_UNSUBSCRIBE_EVENT: () => (/* binding */ SESSION_UNSUBSCRIBE_EVENT),
+/* harmony export */   SOCKET_SET_USER_EVENT: () => (/* binding */ SOCKET_SET_USER_EVENT)
 /* harmony export */ });
 const OTEL_MP_SAMPLE_TRACE_RATIO = 0.15;
 const SESSION_ID_PROP_NAME = 'multiplayer-session-id';
@@ -25090,11 +25093,14 @@ const SESSION_SUBSCRIBE_EVENT = 'debug-session:subscribe';
 const SESSION_UNSUBSCRIBE_EVENT = 'debug-session:unsubscribe';
 const SESSION_AUTO_CREATED = 'debug-session:auto-created';
 const SESSION_ADD_EVENT = 'debug-session:rrweb:add-event';
+const SOCKET_SET_USER_EVENT = 'socket:set-user';
 const DEFAULT_MAX_HTTP_CAPTURING_PAYLOAD_SIZE = 100000;
 const SESSION_RESPONSE = 'multiplayer-debug-session-response';
 const CONTINUOUS_DEBUGGING_TIMEOUT = 60000; // 1 minutes
 const DEBUG_SESSION_MAX_DURATION_SECONDS = 10 * 60 + 30; // TODO: move to shared config otel core
-const PACKAGE_VERSION_EXPORT = "1.2.37" || 0;
+const REMOTE_SESSION_RECORDING_START = 'remote-session-recording:start';
+const REMOTE_SESSION_RECORDING_STOP = 'remote-session-recording:stop';
+const PACKAGE_VERSION_EXPORT = "1.3.0" || 0;
 // Regex patterns for OpenTelemetry ignore URLs
 const OTEL_IGNORE_URLS = [
     // Traces endpoint
@@ -25190,6 +25196,7 @@ const BASE_CONFIG = {
     captureHeaders: true,
     masking: DEFAULT_MASKING_CONFIG,
     widgetTextOverrides: DEFAULT_WIDGET_TEXT_CONFIG,
+    useWebsocket: true,
 };
 
 
@@ -25213,6 +25220,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   OTEL_IGNORE_URLS: () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_0__.OTEL_IGNORE_URLS),
 /* harmony export */   OTEL_MP_SAMPLE_TRACE_RATIO: () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_0__.OTEL_MP_SAMPLE_TRACE_RATIO),
 /* harmony export */   PACKAGE_VERSION_EXPORT: () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_0__.PACKAGE_VERSION_EXPORT),
+/* harmony export */   REMOTE_SESSION_RECORDING_START: () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_0__.REMOTE_SESSION_RECORDING_START),
+/* harmony export */   REMOTE_SESSION_RECORDING_STOP: () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_0__.REMOTE_SESSION_RECORDING_STOP),
 /* harmony export */   SESSION_ADD_EVENT: () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_0__.SESSION_ADD_EVENT),
 /* harmony export */   SESSION_AUTO_CREATED: () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_0__.SESSION_AUTO_CREATED),
 /* harmony export */   SESSION_ID_PROP_NAME: () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_0__.SESSION_ID_PROP_NAME),
@@ -25225,6 +25234,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   SESSION_SUBSCRIBE_EVENT: () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_0__.SESSION_SUBSCRIBE_EVENT),
 /* harmony export */   SESSION_TYPE_PROP_NAME: () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_0__.SESSION_TYPE_PROP_NAME),
 /* harmony export */   SESSION_UNSUBSCRIBE_EVENT: () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_0__.SESSION_UNSUBSCRIBE_EVENT),
+/* harmony export */   SOCKET_SET_USER_EVENT: () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_0__.SOCKET_SET_USER_EVENT),
 /* harmony export */   getMaskingConfig: () => (/* reexport safe */ _masking__WEBPACK_IMPORTED_MODULE_3__.getMaskingConfig),
 /* harmony export */   getSessionRecorderConfig: () => (/* reexport safe */ _session_recorder__WEBPACK_IMPORTED_MODULE_4__.getSessionRecorderConfig),
 /* harmony export */   isValidArray: () => (/* reexport safe */ _validators__WEBPACK_IMPORTED_MODULE_2__.isValidArray),
@@ -25344,6 +25354,7 @@ const getWidgetTextOverridesConfig = (config, defaultConfig) => {
     };
 };
 const getSessionRecorderConfig = (c) => {
+    var _a;
     if (!c) {
         return _defaults__WEBPACK_IMPORTED_MODULE_1__.BASE_CONFIG;
     }
@@ -25369,6 +25380,7 @@ const getSessionRecorderConfig = (c) => {
         captureHeaders: (0,_validators__WEBPACK_IMPORTED_MODULE_3__.isValidBoolean)(c.captureHeaders, _defaults__WEBPACK_IMPORTED_MODULE_1__.BASE_CONFIG.captureHeaders),
         masking: (0,_masking__WEBPACK_IMPORTED_MODULE_2__.getMaskingConfig)(c.masking),
         widgetTextOverrides: getWidgetTextOverridesConfig(c.widgetTextOverrides, _defaults__WEBPACK_IMPORTED_MODULE_1__.BASE_CONFIG.widgetTextOverrides),
+        useWebsocket: (0,_validators__WEBPACK_IMPORTED_MODULE_3__.isValidBoolean)(c.useWebsocket, (_a = _defaults__WEBPACK_IMPORTED_MODULE_1__.BASE_CONFIG.useWebsocket) !== null && _a !== void 0 ? _a : false),
     };
 };
 
@@ -26183,6 +26195,7 @@ class TracerBrowserSDK {
                 });
                 return;
             }
+            // eslint-disable-next-line
         }
         catch (_ignored) { }
         // Fallback: create a short-lived span to hold the exception details
@@ -26198,6 +26211,7 @@ class TracerBrowserSDK {
                 ...(errorInfo || {}),
             });
             span.end();
+            // eslint-disable-next-line
         }
         catch (_ignored) { }
     }
@@ -26219,12 +26233,14 @@ class TracerBrowserSDK {
             return;
         if (typeof window === 'undefined')
             return;
+        // eslint-disable-next-line
         const errorHandler = (event) => {
             const err = (event === null || event === void 0 ? void 0 : event.error) instanceof Error
                 ? event.error
                 : new Error((event === null || event === void 0 ? void 0 : event.message) || 'Script error');
             this.captureException(err);
         };
+        // eslint-disable-next-line
         const rejectionHandler = (event) => {
             const reason = (event && 'reason' in event) ? event.reason : undefined;
             const err = reason instanceof Error
@@ -26403,6 +26419,7 @@ if (typeof window !== 'undefined' && typeof window.fetch !== 'undefined') {
                     : (typeof input === 'string' || input instanceof URL ? String(input) : '');
                 // Only attempt to read the body from init (safe); avoid constructing/cloning Requests
                 // If the caller passed a Request as input, we do not attempt to read its body here
+                // eslint-disable-next-line
                 const candidateBody = init === null || init === void 0 ? void 0 : init.body;
                 if (!(0,_utils_type_utils__WEBPACK_IMPORTED_MODULE_0__.isNullish)(candidateBody)) {
                     const requestBody = _tryReadFetchBody({
@@ -26597,170 +26614,6 @@ if (typeof XMLHttpRequest !== 'undefined') {
 }
 
 
-/***/ }),
-
-/***/ "./src/rrweb/exporter.ts":
-/*!*******************************!*\
-  !*** ./src/rrweb/exporter.ts ***!
-  \*******************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   RrwebEventExporter: () => (/* binding */ RrwebEventExporter)
-/* harmony export */ });
-/* harmony import */ var socket_io_client__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! socket.io-client */ "../../node_modules/socket.io-client/build/esm/index.js");
-/* harmony import */ var _eventBus__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../eventBus */ "./src/eventBus.ts");
-/* harmony import */ var _services_messaging_service__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../services/messaging.service */ "./src/services/messaging.service.ts");
-/* harmony import */ var _config__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../config */ "./src/config/index.ts");
-
-
-
-
-const MAX_RECONNECTION_ATTEMPTS = 2;
-class RrwebEventExporter {
-    constructor(options) {
-        this.options = options;
-        this.socket = null;
-        this.queue = [];
-        this.isConnecting = false;
-        this.isConnected = false;
-        this.usePostMessage = false;
-        this.attempts = 0;
-        this.sessionId = null;
-    }
-    init() {
-        if (this.isConnecting || this.isConnected)
-            return;
-        this.attempts++;
-        this.isConnecting = true;
-        this.usePostMessage = false;
-        this.socket = (0,socket_io_client__WEBPACK_IMPORTED_MODULE_0__["default"])(this.options.socketUrl, {
-            path: '/v0/radar/ws',
-            auth: {
-                'x-api-key': this.options.apiKey,
-            },
-            reconnectionAttempts: 2,
-            transports: ['websocket'],
-        });
-        // this.socket.on('connect', () => {
-        //   this.isConnecting = false
-        //   this.isConnected = true
-        //   this.usePostMessage = false
-        //   this.flushQueue()
-        // })
-        this.socket.on('ready', () => {
-            this.isConnecting = false;
-            this.isConnected = true;
-            this.usePostMessage = false;
-            this.flushQueue();
-        });
-        this.socket.on('disconnect', (err) => {
-            this.isConnecting = false;
-            this.isConnected = false;
-        });
-        this.socket.on('connect_error', (err) => {
-            this.isConnecting = false;
-            this.isConnected = false;
-            this.checkReconnectionAttempts();
-        });
-        this.socket.on(_config__WEBPACK_IMPORTED_MODULE_3__.SESSION_STOPPED_EVENT, (data) => {
-            _eventBus__WEBPACK_IMPORTED_MODULE_1__.recorderEventBus.emit(_config__WEBPACK_IMPORTED_MODULE_3__.SESSION_STOPPED_EVENT, data);
-            this.unsubscribeFromSession();
-        });
-        this.socket.on(_config__WEBPACK_IMPORTED_MODULE_3__.SESSION_AUTO_CREATED, (data) => {
-            _eventBus__WEBPACK_IMPORTED_MODULE_1__.recorderEventBus.emit(_config__WEBPACK_IMPORTED_MODULE_3__.SESSION_AUTO_CREATED, data);
-        });
-    }
-    checkReconnectionAttempts() {
-        if (this.attempts >= MAX_RECONNECTION_ATTEMPTS) {
-            this.usePostMessage = !!this.options.usePostMessageFallback;
-            this.flushQueue();
-        }
-    }
-    sendViaPostMessage(event) {
-        _services_messaging_service__WEBPACK_IMPORTED_MODULE_2__["default"].sendMessage('rrweb-event', event);
-    }
-    flushQueue() {
-        var _a, _b;
-        while (this.queue.length > 0 && (this.usePostMessage || ((_a = this.socket) === null || _a === void 0 ? void 0 : _a.connected))) {
-            const event = this.queue.shift();
-            if (!event)
-                continue;
-            if (this.usePostMessage) {
-                this.sendViaPostMessage(event.data);
-            }
-            else if ((_b = this.socket) === null || _b === void 0 ? void 0 : _b.connected) {
-                this.socket.emit(event.name, event.data);
-            }
-        }
-    }
-    unsubscribeFromSession() {
-        var _a;
-        const payload = {
-            debugSessionId: this.sessionId,
-        };
-        if (this.usePostMessage) {
-            _services_messaging_service__WEBPACK_IMPORTED_MODULE_2__["default"].sendMessage('socket-emit', { event: _config__WEBPACK_IMPORTED_MODULE_3__.SESSION_UNSUBSCRIBE_EVENT, data: payload });
-        }
-        else if ((_a = this.socket) === null || _a === void 0 ? void 0 : _a.connected) {
-            this.socket.emit(_config__WEBPACK_IMPORTED_MODULE_3__.SESSION_UNSUBSCRIBE_EVENT, payload);
-        }
-    }
-    send(event) {
-        var _a;
-        if (this.usePostMessage) {
-            this.sendViaPostMessage(event);
-        }
-        else if ((_a = this.socket) === null || _a === void 0 ? void 0 : _a.connected) {
-            this.socket.emit(_config__WEBPACK_IMPORTED_MODULE_3__.SESSION_ADD_EVENT, event);
-        }
-        else {
-            this.queue.push({ data: event, name: _config__WEBPACK_IMPORTED_MODULE_3__.SESSION_ADD_EVENT });
-            this.init();
-        }
-    }
-    subscribeToSession(session) {
-        var _a;
-        this.sessionId = session.shortId || session._id;
-        const payload = {
-            projectId: session.project,
-            workspaceId: session.workspace,
-            debugSessionId: this.sessionId,
-            sessionType: session.creationType,
-        };
-        if (this.usePostMessage) {
-            this.sendViaPostMessage({ type: _config__WEBPACK_IMPORTED_MODULE_3__.SESSION_SUBSCRIBE_EVENT, ...payload });
-        }
-        else if ((_a = this.socket) === null || _a === void 0 ? void 0 : _a.connected) {
-            this.socket.emit(_config__WEBPACK_IMPORTED_MODULE_3__.SESSION_SUBSCRIBE_EVENT, payload);
-        }
-        else {
-            this.queue.push({ data: payload, name: _config__WEBPACK_IMPORTED_MODULE_3__.SESSION_SUBSCRIBE_EVENT });
-            this.init();
-        }
-    }
-    close() {
-        var _a;
-        if (this.usePostMessage) {
-            this.sendViaPostMessage({ type: 'close' });
-        }
-        if ((_a = this.socket) === null || _a === void 0 ? void 0 : _a.connected) {
-            setTimeout(() => {
-                var _a;
-                this.unsubscribeFromSession();
-                this.attempts = 0;
-                this.isConnected = false;
-                this.isConnecting = false;
-                (_a = this.socket) === null || _a === void 0 ? void 0 : _a.disconnect();
-                this.socket = null;
-            }, 500);
-        }
-    }
-}
-
-
 /***/ }),
 
 /***/ "./src/rrweb/index.ts":
@@ -26780,7 +26633,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _rrweb_rrweb_plugin_console_record__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @rrweb/rrweb-plugin-console-record */ "../../node_modules/@rrweb/rrweb-plugin-console-record/dist/rrweb-plugin-console-record.js");
 /* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../utils */ "./src/utils/index.ts");
 /* harmony import */ var _config__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../config */ "./src/config/index.ts");
-/* harmony import */ var _exporter__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./exporter */ "./src/rrweb/exporter.ts");
+/* harmony import */ var _services_socket_service__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../services/socket.service */ "./src/services/socket.service.ts");
 
 
 
@@ -26812,11 +26665,6 @@ class RecorderBrowserSDK {
      */
     init(config) {
         this.config = config;
-        this.exporter = new _exporter__WEBPACK_IMPORTED_MODULE_5__.RrwebEventExporter({
-            apiKey: config.apiKey,
-            socketUrl: config.apiBaseUrl || '',
-            usePostMessageFallback: Boolean(config.usePostMessageFallback),
-        });
     }
     /**
      * Starts recording events for a given session ID.
@@ -26862,7 +26710,7 @@ class RecorderBrowserSDK {
         this.stopFn = (0,rrweb__WEBPACK_IMPORTED_MODULE_6__.record)({
             ...options,
             emit: async (event) => {
-                if (this.exporter) {
+                if (_services_socket_service__WEBPACK_IMPORTED_MODULE_5__.socketService) {
                     if (typeof maskingConfig.maskConsoleEvent === 'function' && (0,_utils__WEBPACK_IMPORTED_MODULE_3__.isConsoleEvent)(event)) {
                         const { data } = event;
                         const maskedPayload = maskingConfig.maskConsoleEvent(data.payload);
@@ -26870,7 +26718,7 @@ class RecorderBrowserSDK {
                     }
                     const packedEvent = (0,_rrweb_packer__WEBPACK_IMPORTED_MODULE_0__.pack)(event);
                     this.stoppedAt = new Date(event.timestamp).toISOString();
-                    this.exporter.send({
+                    _services_socket_service__WEBPACK_IMPORTED_MODULE_5__.socketService.send({
                         event: packedEvent,
                         eventType: event.type,
                         timestamp: event.timestamp,
@@ -26911,12 +26759,13 @@ class RecorderBrowserSDK {
     stop() {
         var _a, _b;
         (_a = this.stopFn) === null || _a === void 0 ? void 0 : _a.call(this);
-        (_b = this.exporter) === null || _b === void 0 ? void 0 : _b.close();
+        if (!((_b = this.config) === null || _b === void 0 ? void 0 : _b.useWebsocket)) {
+            _services_socket_service__WEBPACK_IMPORTED_MODULE_5__.socketService === null || _services_socket_service__WEBPACK_IMPORTED_MODULE_5__.socketService === void 0 ? void 0 : _services_socket_service__WEBPACK_IMPORTED_MODULE_5__.socketService.close();
+        }
         this.clearRestartInterval();
     }
     subscribeToSession(session) {
-        var _a;
-        (_a = this.exporter) === null || _a === void 0 ? void 0 : _a.subscribeToSession(session);
+        _services_socket_service__WEBPACK_IMPORTED_MODULE_5__.socketService === null || _services_socket_service__WEBPACK_IMPORTED_MODULE_5__.socketService === void 0 ? void 0 : _services_socket_service__WEBPACK_IMPORTED_MODULE_5__.socketService.subscribeToSession(session);
     }
 }
 
@@ -27177,6 +27026,208 @@ const messagingService = new MessagingService();
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (messagingService);
 
 
+/***/ }),
+
+/***/ "./src/services/socket.service.ts":
+/*!****************************************!*\
+  !*** ./src/services/socket.service.ts ***!
+  \****************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   SocketService: () => (/* binding */ SocketService),
+/* harmony export */   createSocketService: () => (/* binding */ createSocketService),
+/* harmony export */   socketService: () => (/* binding */ socketService)
+/* harmony export */ });
+/* harmony import */ var socket_io_client__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! socket.io-client */ "../../node_modules/socket.io-client/build/esm/index.js");
+/* harmony import */ var _eventBus__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../eventBus */ "./src/eventBus.ts");
+/* harmony import */ var _services_messaging_service__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../services/messaging.service */ "./src/services/messaging.service.ts");
+/* harmony import */ var _config__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../config */ "./src/config/index.ts");
+
+
+
+
+const MAX_RECONNECTION_ATTEMPTS = 2;
+class SocketService {
+    constructor(options) {
+        this.options = options;
+        this.socket = null;
+        this.queue = [];
+        this.isConnecting = false;
+        this.isConnected = false;
+        this.usePostMessage = false;
+        this.attempts = 0;
+        this.sessionId = null;
+        if (this.options.keepAlive
+            && this.options.socketUrl
+            && this.options.apiKey) {
+            this.init();
+        }
+    }
+    init() {
+        if (this.isConnecting || this.isConnected)
+            return;
+        this.attempts++;
+        this.isConnecting = true;
+        this.usePostMessage = false;
+        this.socket = (0,socket_io_client__WEBPACK_IMPORTED_MODULE_0__["default"])(this.options.socketUrl, {
+            path: '/v0/radar/ws',
+            auth: {
+                'x-api-key': this.options.apiKey,
+            },
+            reconnectionAttempts: 2,
+            transports: ['websocket'],
+        });
+        // this.socket.on('connect', () => {
+        //   this.isConnecting = false
+        //   this.isConnected = true
+        //   this.usePostMessage = false
+        //   this.flushQueue()
+        // })
+        this.socket.on('ready', () => {
+            this.isConnecting = false;
+            this.isConnected = true;
+            this.usePostMessage = false;
+            this.flushQueue();
+        });
+        this.socket.on('disconnect', (err) => {
+            this.isConnecting = false;
+            this.isConnected = false;
+        });
+        this.socket.on('connect_error', (err) => {
+            this.isConnecting = false;
+            this.isConnected = false;
+            this.checkReconnectionAttempts();
+        });
+        this.socket.on(_config__WEBPACK_IMPORTED_MODULE_3__.SESSION_STOPPED_EVENT, (data) => {
+            _eventBus__WEBPACK_IMPORTED_MODULE_1__.recorderEventBus.emit(_config__WEBPACK_IMPORTED_MODULE_3__.SESSION_STOPPED_EVENT, data);
+            this.unsubscribeFromSession();
+        });
+        this.socket.on(_config__WEBPACK_IMPORTED_MODULE_3__.SESSION_AUTO_CREATED, (data) => {
+            _eventBus__WEBPACK_IMPORTED_MODULE_1__.recorderEventBus.emit(_config__WEBPACK_IMPORTED_MODULE_3__.SESSION_AUTO_CREATED, data);
+        });
+        this.socket.on(_config__WEBPACK_IMPORTED_MODULE_3__.REMOTE_SESSION_RECORDING_START, (data) => {
+            _eventBus__WEBPACK_IMPORTED_MODULE_1__.recorderEventBus.emit(_config__WEBPACK_IMPORTED_MODULE_3__.REMOTE_SESSION_RECORDING_START, data);
+        });
+        this.socket.on(_config__WEBPACK_IMPORTED_MODULE_3__.REMOTE_SESSION_RECORDING_STOP, (data) => {
+            _eventBus__WEBPACK_IMPORTED_MODULE_1__.recorderEventBus.emit(_config__WEBPACK_IMPORTED_MODULE_3__.REMOTE_SESSION_RECORDING_STOP, data);
+        });
+    }
+    checkReconnectionAttempts() {
+        if (this.attempts >= MAX_RECONNECTION_ATTEMPTS) {
+            this.usePostMessage = !!this.options.usePostMessageFallback;
+            this.flushQueue();
+        }
+    }
+    sendViaPostMessage(event) {
+        _services_messaging_service__WEBPACK_IMPORTED_MODULE_2__["default"].sendMessage('rrweb-event', event);
+    }
+    flushQueue() {
+        var _a, _b;
+        while (this.queue.length > 0 && (this.usePostMessage || ((_a = this.socket) === null || _a === void 0 ? void 0 : _a.connected))) {
+            const event = this.queue.shift();
+            if (!event)
+                continue;
+            if (this.usePostMessage) {
+                this.sendViaPostMessage(event.data);
+            }
+            else if ((_b = this.socket) === null || _b === void 0 ? void 0 : _b.connected) {
+                this.socket.emit(event.name, event.data);
+            }
+        }
+    }
+    unsubscribeFromSession() {
+        var _a;
+        const payload = {
+            debugSessionId: this.sessionId,
+        };
+        if (this.usePostMessage) {
+            _services_messaging_service__WEBPACK_IMPORTED_MODULE_2__["default"].sendMessage('socket-emit', { event: _config__WEBPACK_IMPORTED_MODULE_3__.SESSION_UNSUBSCRIBE_EVENT, data: payload });
+        }
+        else if ((_a = this.socket) === null || _a === void 0 ? void 0 : _a.connected) {
+            this.socket.emit(_config__WEBPACK_IMPORTED_MODULE_3__.SESSION_UNSUBSCRIBE_EVENT, payload);
+        }
+    }
+    send(event) {
+        var _a;
+        if (this.usePostMessage) {
+            this.sendViaPostMessage(event);
+        }
+        else if ((_a = this.socket) === null || _a === void 0 ? void 0 : _a.connected) {
+            this.socket.emit(_config__WEBPACK_IMPORTED_MODULE_3__.SESSION_ADD_EVENT, event);
+        }
+        else {
+            this.queue.push({ data: event, name: _config__WEBPACK_IMPORTED_MODULE_3__.SESSION_ADD_EVENT });
+            this.init();
+        }
+    }
+    subscribeToSession(session) {
+        var _a;
+        this.sessionId = session.shortId || session._id;
+        const payload = {
+            projectId: session.project,
+            workspaceId: session.workspace,
+            debugSessionId: this.sessionId,
+            sessionType: session.creationType,
+        };
+        if (this.usePostMessage) {
+            this.sendViaPostMessage({
+                type: _config__WEBPACK_IMPORTED_MODULE_3__.SESSION_SUBSCRIBE_EVENT,
+                ...payload,
+            });
+        }
+        else if ((_a = this.socket) === null || _a === void 0 ? void 0 : _a.connected) {
+            this.socket.emit(_config__WEBPACK_IMPORTED_MODULE_3__.SESSION_SUBSCRIBE_EVENT, payload);
+        }
+        else {
+            this.queue.push({
+                data: payload,
+                name: _config__WEBPACK_IMPORTED_MODULE_3__.SESSION_SUBSCRIBE_EVENT,
+            });
+            this.init();
+        }
+    }
+    setUser(userAttributes) {
+        var _a;
+        if (this.usePostMessage) {
+            this.sendViaPostMessage({
+                type: _config__WEBPACK_IMPORTED_MODULE_3__.SOCKET_SET_USER_EVENT,
+                data: userAttributes,
+            });
+        }
+        else if ((_a = this.socket) === null || _a === void 0 ? void 0 : _a.connected) {
+            this.socket.emit(_config__WEBPACK_IMPORTED_MODULE_3__.SOCKET_SET_USER_EVENT, userAttributes);
+        }
+    }
+    close() {
+        var _a;
+        if (this.usePostMessage) {
+            this.sendViaPostMessage({ type: 'close' });
+        }
+        if ((_a = this.socket) === null || _a === void 0 ? void 0 : _a.connected) {
+            setTimeout(() => {
+                var _a;
+                this.unsubscribeFromSession();
+                this.attempts = 0;
+                this.isConnected = false;
+                this.isConnecting = false;
+                (_a = this.socket) === null || _a === void 0 ? void 0 : _a.disconnect();
+                this.socket = null;
+            }, 500);
+        }
+    }
+}
+let socketService = null;
+const createSocketService = (options) => {
+    if (!socketService) {
+        socketService = new SocketService(options);
+    }
+    return socketService;
+};
+
+
 /***/ }),
 
 /***/ "./src/sessionRecorder.ts":
@@ -27194,17 +27245,19 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _rrweb__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./rrweb */ "./src/rrweb/index.ts");
 /* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./utils */ "./src/utils/index.ts");
 /* harmony import */ var _types__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./types */ "./src/types/index.ts");
-/* harmony import */ var _config__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./config */ "./src/config/index.ts");
-/* harmony import */ var _patch__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./patch */ "./src/patch/index.ts");
-/* harmony import */ var _eventBus__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./eventBus */ "./src/eventBus.ts");
-/* harmony import */ var _sessionWidget__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./sessionWidget */ "./src/sessionWidget/index.ts");
-/* harmony import */ var _services_messaging_service__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./services/messaging.service */ "./src/services/messaging.service.ts");
-/* harmony import */ var _services_api_service__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./services/api.service */ "./src/services/api.service.ts");
-/* harmony import */ var _index_scss__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./index.scss */ "./src/index.scss");
-/* harmony import */ var _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! @multiplayer-app/session-recorder-common */ "../session-recorder-common/dist/esm/index-browser.js");
-/* harmony import */ var _sessionWidget_buttonStateConfigs__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./sessionWidget/buttonStateConfigs */ "./src/sessionWidget/buttonStateConfigs.ts");
-/* harmony import */ var lib0_observable__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! lib0/observable */ "../../node_modules/lib0/observable.js");
-/* harmony import */ var _navigation__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./navigation */ "./src/navigation/index.ts");
+/* harmony import */ var _services_socket_service__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./services/socket.service */ "./src/services/socket.service.ts");
+/* harmony import */ var _config__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./config */ "./src/config/index.ts");
+/* harmony import */ var _patch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./patch */ "./src/patch/index.ts");
+/* harmony import */ var _eventBus__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./eventBus */ "./src/eventBus.ts");
+/* harmony import */ var _sessionWidget__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./sessionWidget */ "./src/sessionWidget/index.ts");
+/* harmony import */ var _services_messaging_service__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./services/messaging.service */ "./src/services/messaging.service.ts");
+/* harmony import */ var _services_api_service__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./services/api.service */ "./src/services/api.service.ts");
+/* harmony import */ var _index_scss__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./index.scss */ "./src/index.scss");
+/* harmony import */ var _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! @multiplayer-app/session-recorder-common */ "../session-recorder-common/dist/esm/index-browser.js");
+/* harmony import */ var _sessionWidget_buttonStateConfigs__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./sessionWidget/buttonStateConfigs */ "./src/sessionWidget/buttonStateConfigs.ts");
+/* harmony import */ var lib0_observable__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! lib0/observable */ "../../node_modules/lib0/observable.js");
+/* harmony import */ var _navigation__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./navigation */ "./src/navigation/index.ts");
+
 
 
 
@@ -27220,7 +27273,7 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
-class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Observable {
+class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_15__.Observable {
     get navigation() {
         return this._navigationRecorder.api;
     }
@@ -27232,20 +27285,20 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
     }
     set sessionId(sessionId) {
         this._sessionId = sessionId;
-        (0,_utils__WEBPACK_IMPORTED_MODULE_2__.setStoredItem)(_config__WEBPACK_IMPORTED_MODULE_4__.SESSION_ID_PROP_NAME, sessionId);
+        (0,_utils__WEBPACK_IMPORTED_MODULE_2__.setStoredItem)(_config__WEBPACK_IMPORTED_MODULE_5__.SESSION_ID_PROP_NAME, sessionId);
     }
     get sessionType() {
         return this._sessionType;
     }
     set sessionType(sessionType) {
         this._sessionType = sessionType;
-        const continuousRecording = sessionType === _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_11__.SessionType.CONTINUOUS;
+        const continuousRecording = sessionType === _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_12__.SessionType.CONTINUOUS;
         this._sessionWidget.updateContinuousRecordingState(continuousRecording);
-        _services_messaging_service__WEBPACK_IMPORTED_MODULE_8__["default"].sendMessage('continuous-debugging', continuousRecording);
-        (0,_utils__WEBPACK_IMPORTED_MODULE_2__.setStoredItem)(_config__WEBPACK_IMPORTED_MODULE_4__.SESSION_TYPE_PROP_NAME, sessionType);
+        _services_messaging_service__WEBPACK_IMPORTED_MODULE_9__["default"].sendMessage('continuous-debugging', continuousRecording);
+        (0,_utils__WEBPACK_IMPORTED_MODULE_2__.setStoredItem)(_config__WEBPACK_IMPORTED_MODULE_5__.SESSION_TYPE_PROP_NAME, sessionType);
     }
     get continuousRecording() {
-        return this.sessionType === _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_11__.SessionType.CONTINUOUS;
+        return this.sessionType === _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_12__.SessionType.CONTINUOUS;
     }
     get sessionState() {
         return this._sessionState || _types__WEBPACK_IMPORTED_MODULE_3__.SessionState.stopped;
@@ -27253,8 +27306,8 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
     set sessionState(state) {
         this._sessionState = state;
         this._sessionWidget.updateState(this._sessionState, this.continuousRecording);
-        _services_messaging_service__WEBPACK_IMPORTED_MODULE_8__["default"].sendMessage('state-change', this._sessionState);
-        (0,_utils__WEBPACK_IMPORTED_MODULE_2__.setStoredItem)(_config__WEBPACK_IMPORTED_MODULE_4__.SESSION_STATE_PROP_NAME, state);
+        _services_messaging_service__WEBPACK_IMPORTED_MODULE_9__["default"].sendMessage('state-change', this._sessionState);
+        (0,_utils__WEBPACK_IMPORTED_MODULE_2__.setStoredItem)(_config__WEBPACK_IMPORTED_MODULE_5__.SESSION_STATE_PROP_NAME, state);
         // Emit observable event to support React wrapper
         this.emit('state-change', [this._sessionState || _types__WEBPACK_IMPORTED_MODULE_3__.SessionState.stopped, this.sessionType]);
     }
@@ -27263,7 +27316,7 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
     }
     set session(session) {
         this._session = session;
-        (0,_utils__WEBPACK_IMPORTED_MODULE_2__.setStoredItem)(_config__WEBPACK_IMPORTED_MODULE_4__.SESSION_PROP_NAME, this._session);
+        (0,_utils__WEBPACK_IMPORTED_MODULE_2__.setStoredItem)(_config__WEBPACK_IMPORTED_MODULE_5__.SESSION_PROP_NAME, this._session);
     }
     get sessionAttributes() {
         return this._sessionAttributes || {};
@@ -27295,16 +27348,17 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
     constructor() {
         var _a;
         super();
-        this._apiService = new _services_api_service__WEBPACK_IMPORTED_MODULE_9__.ApiService();
+        this._apiService = new _services_api_service__WEBPACK_IMPORTED_MODULE_10__.ApiService();
         this._tracer = new _otel__WEBPACK_IMPORTED_MODULE_0__.TracerBrowserSDK();
         this._recorder = new _rrweb__WEBPACK_IMPORTED_MODULE_1__.RecorderBrowserSDK();
-        this._sessionWidget = new _sessionWidget__WEBPACK_IMPORTED_MODULE_7__.SessionWidget();
-        this._navigationRecorder = new _navigation__WEBPACK_IMPORTED_MODULE_13__.NavigationRecorder();
+        this._sessionWidget = new _sessionWidget__WEBPACK_IMPORTED_MODULE_8__.SessionWidget();
+        this._navigationRecorder = new _navigation__WEBPACK_IMPORTED_MODULE_14__.NavigationRecorder();
+        this._userAttributes = undefined;
         this._startRequestController = null;
         this._isInitialized = false;
         // Session ID and state are stored in localStorage
         this._sessionId = null;
-        this._sessionType = _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_11__.SessionType.MANUAL;
+        this._sessionType = _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_12__.SessionType.MANUAL;
         this._sessionState = null;
         this._session = null;
         this._sessionAttributes = null;
@@ -27314,10 +27368,10 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
         this._error = '';
         // Safety: avoid accessing storage in SSR/non-browser environments
         const isBrowser = typeof window !== 'undefined';
-        const sessionLocal = isBrowser ? (0,_utils__WEBPACK_IMPORTED_MODULE_2__.getStoredItem)(_config__WEBPACK_IMPORTED_MODULE_4__.SESSION_PROP_NAME, true) : null;
-        const sessionIdLocal = isBrowser ? (0,_utils__WEBPACK_IMPORTED_MODULE_2__.getStoredItem)(_config__WEBPACK_IMPORTED_MODULE_4__.SESSION_ID_PROP_NAME) : null;
-        const sessionStateLocal = isBrowser ? (0,_utils__WEBPACK_IMPORTED_MODULE_2__.getStoredItem)(_config__WEBPACK_IMPORTED_MODULE_4__.SESSION_STATE_PROP_NAME) : null;
-        const sessionTypeLocal = isBrowser ? (0,_utils__WEBPACK_IMPORTED_MODULE_2__.getStoredItem)(_config__WEBPACK_IMPORTED_MODULE_4__.SESSION_TYPE_PROP_NAME) : null;
+        const sessionLocal = isBrowser ? (0,_utils__WEBPACK_IMPORTED_MODULE_2__.getStoredItem)(_config__WEBPACK_IMPORTED_MODULE_5__.SESSION_PROP_NAME, true) : null;
+        const sessionIdLocal = isBrowser ? (0,_utils__WEBPACK_IMPORTED_MODULE_2__.getStoredItem)(_config__WEBPACK_IMPORTED_MODULE_5__.SESSION_ID_PROP_NAME) : null;
+        const sessionStateLocal = isBrowser ? (0,_utils__WEBPACK_IMPORTED_MODULE_2__.getStoredItem)(_config__WEBPACK_IMPORTED_MODULE_5__.SESSION_STATE_PROP_NAME) : null;
+        const sessionTypeLocal = isBrowser ? (0,_utils__WEBPACK_IMPORTED_MODULE_2__.getStoredItem)(_config__WEBPACK_IMPORTED_MODULE_5__.SESSION_TYPE_PROP_NAME) : null;
         if ((0,_utils__WEBPACK_IMPORTED_MODULE_2__.isSessionActive)(sessionLocal, sessionTypeLocal)) {
             this.session = sessionLocal;
             this.sessionId = sessionIdLocal;
@@ -27328,10 +27382,10 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
             this.session = null;
             this.sessionId = null;
             this.sessionState = null;
-            this.sessionType = _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_11__.SessionType.MANUAL;
+            this.sessionType = _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_12__.SessionType.MANUAL;
         }
         this._configs = {
-            ..._config__WEBPACK_IMPORTED_MODULE_4__.BASE_CONFIG,
+            ..._config__WEBPACK_IMPORTED_MODULE_5__.BASE_CONFIG,
             apiKey: ((_a = this.session) === null || _a === void 0 ? void 0 : _a.tempApiKey) || '',
         };
     }
@@ -27343,11 +27397,11 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
         if (typeof window === 'undefined') {
             return;
         }
-        this._configs = (0,_config__WEBPACK_IMPORTED_MODULE_4__.getSessionRecorderConfig)({ ...this._configs, ...configs });
+        this._configs = (0,_config__WEBPACK_IMPORTED_MODULE_5__.getSessionRecorderConfig)({ ...this._configs, ...configs });
         this._isInitialized = true;
         this._checkOperation('init');
-        (0,_patch__WEBPACK_IMPORTED_MODULE_5__.setMaxCapturingHttpPayloadSize)(this._configs.maxCapturingHttpPayloadSize || _config__WEBPACK_IMPORTED_MODULE_4__.DEFAULT_MAX_HTTP_CAPTURING_PAYLOAD_SIZE);
-        (0,_patch__WEBPACK_IMPORTED_MODULE_5__.setShouldRecordHttpData)(this._configs.captureBody, this._configs.captureHeaders);
+        (0,_patch__WEBPACK_IMPORTED_MODULE_6__.setMaxCapturingHttpPayloadSize)(this._configs.maxCapturingHttpPayloadSize || _config__WEBPACK_IMPORTED_MODULE_5__.DEFAULT_MAX_HTTP_CAPTURING_PAYLOAD_SIZE);
+        (0,_patch__WEBPACK_IMPORTED_MODULE_6__.setShouldRecordHttpData)(this._configs.captureBody, this._configs.captureHeaders);
         this._tracer.init(this._configs);
         this._apiService.init(this._configs);
         this._sessionWidget.init(this._configs);
@@ -27357,16 +27411,26 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
             environment: this._configs.environment,
             version: this._configs.version,
         });
+        (0,_services_socket_service__WEBPACK_IMPORTED_MODULE_4__.createSocketService)({
+            apiKey: this._configs.apiKey,
+            socketUrl: this._configs.apiBaseUrl || '',
+            usePostMessageFallback: Boolean(this._configs.usePostMessageFallback),
+            keepAlive: Boolean(this._configs.useWebsocket),
+        });
         if (this._configs.apiKey) {
             this._recorder.init(this._configs);
         }
-        if (this.sessionId && (this.sessionState === _types__WEBPACK_IMPORTED_MODULE_3__.SessionState.started || this.sessionState === _types__WEBPACK_IMPORTED_MODULE_3__.SessionState.paused)) {
+        if (this.sessionId
+            && (this.sessionState === _types__WEBPACK_IMPORTED_MODULE_3__.SessionState.started
+                || this.sessionState === _types__WEBPACK_IMPORTED_MODULE_3__.SessionState.paused)) {
             this._start();
         }
         this._registerWidgetEvents();
         this._registerSessionLimitReach();
         this._registerSessionAutoCreation();
-        _services_messaging_service__WEBPACK_IMPORTED_MODULE_8__["default"].sendMessage('state-change', this.sessionState);
+        this._registerRemoteSessionRecordingStart();
+        this._registerRemoteSessionRecordingStop();
+        _services_messaging_service__WEBPACK_IMPORTED_MODULE_9__["default"].sendMessage('state-change', this.sessionState);
         // Emit init observable event
         this.emit('init', [this]);
     }
@@ -27379,7 +27443,7 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
             if (!this.continuousRecording || !this._configs.showContinuousRecording) {
                 return;
             }
-            this._sessionWidget.updateSaveContinuousDebugSessionState(_sessionWidget_buttonStateConfigs__WEBPACK_IMPORTED_MODULE_12__.ContinuousRecordingSaveButtonState.SAVING);
+            this._sessionWidget.updateSaveContinuousDebugSessionState(_sessionWidget_buttonStateConfigs__WEBPACK_IMPORTED_MODULE_13__.ContinuousRecordingSaveButtonState.SAVING);
             const res = await this._apiService.saveContinuousDebugSession(this.sessionId, {
                 sessionAttributes: this.sessionAttributes,
                 resourceAttributes: (0,_utils__WEBPACK_IMPORTED_MODULE_2__.getNavigatorInfo)(),
@@ -27388,7 +27452,7 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
                     ? `${this.sessionAttributes.userName}'s session on ${(0,_utils__WEBPACK_IMPORTED_MODULE_2__.getFormattedDate)(Date.now(), { month: 'short', day: 'numeric' })}`
                     : `Session on ${(0,_utils__WEBPACK_IMPORTED_MODULE_2__.getFormattedDate)(Date.now())}`,
             });
-            this._sessionWidget.updateSaveContinuousDebugSessionState(_sessionWidget_buttonStateConfigs__WEBPACK_IMPORTED_MODULE_12__.ContinuousRecordingSaveButtonState.SAVED);
+            this._sessionWidget.updateSaveContinuousDebugSessionState(_sessionWidget_buttonStateConfigs__WEBPACK_IMPORTED_MODULE_13__.ContinuousRecordingSaveButtonState.SAVED);
             const sessionUrl = res === null || res === void 0 ? void 0 : res.url;
             this._sessionWidget.showToast({
                 type: 'success',
@@ -27401,11 +27465,11 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
         }
         catch (error) {
             this.error = error.message;
-            this._sessionWidget.updateSaveContinuousDebugSessionState(_sessionWidget_buttonStateConfigs__WEBPACK_IMPORTED_MODULE_12__.ContinuousRecordingSaveButtonState.ERROR);
+            this._sessionWidget.updateSaveContinuousDebugSessionState(_sessionWidget_buttonStateConfigs__WEBPACK_IMPORTED_MODULE_13__.ContinuousRecordingSaveButtonState.ERROR);
         }
         finally {
             setTimeout(() => {
-                this._sessionWidget.updateSaveContinuousDebugSessionState(_sessionWidget_buttonStateConfigs__WEBPACK_IMPORTED_MODULE_12__.ContinuousRecordingSaveButtonState.IDLE);
+                this._sessionWidget.updateSaveContinuousDebugSessionState(_sessionWidget_buttonStateConfigs__WEBPACK_IMPORTED_MODULE_13__.ContinuousRecordingSaveButtonState.IDLE);
             }, 3000);
         }
     }
@@ -27414,11 +27478,11 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
      * @param type - the type of session to start
      * @param session - the session to start
      */
-    start(type = _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_11__.SessionType.MANUAL, session) {
+    start(type = _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_12__.SessionType.MANUAL, session) {
         this._checkOperation('start');
         // If continuous recording is disabled, force plain mode
-        if (type === _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_11__.SessionType.CONTINUOUS && !this._configs.showContinuousRecording) {
-            type = _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_11__.SessionType.MANUAL;
+        if (type === _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_12__.SessionType.CONTINUOUS && !this._configs.showContinuousRecording) {
+            type = _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_12__.SessionType.MANUAL;
         }
         this.sessionType = type;
         this._startRequestController = new AbortController();
@@ -27439,7 +27503,7 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
             this._stop();
             if (this.continuousRecording) {
                 await this._apiService.stopContinuousDebugSession(this.sessionId);
-                this.sessionType = _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_11__.SessionType.MANUAL;
+                this.sessionType = _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_12__.SessionType.MANUAL;
             }
             else {
                 const request = {
@@ -27447,7 +27511,7 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
                     stoppedAt: this._recorder.stoppedAt,
                 };
                 const response = await this._apiService.stopSession(this.sessionId, request);
-                _eventBus__WEBPACK_IMPORTED_MODULE_6__.recorderEventBus.emit(_config__WEBPACK_IMPORTED_MODULE_4__.SESSION_RESPONSE, response);
+                _eventBus__WEBPACK_IMPORTED_MODULE_7__.recorderEventBus.emit(_config__WEBPACK_IMPORTED_MODULE_5__.SESSION_RESPONSE, response);
             }
             this._clearSession();
         }
@@ -27488,7 +27552,7 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
             this._stop();
             if (this.continuousRecording) {
                 await this._apiService.stopContinuousDebugSession(this.sessionId);
-                this.sessionType = _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_11__.SessionType.MANUAL;
+                this.sessionType = _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_12__.SessionType.MANUAL;
             }
             else {
                 await this._apiService.cancelSession(this.sessionId);
@@ -27512,7 +27576,7 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
      *                  The function receives the click event as its parameter and
      *                  should return `false` to prevent the default button action,
      *                  or `true` (or nothing) to allow it.
-    */
+     */
     set recordingButtonClickHandler(handler) {
         this._sessionWidget.buttonClickExternalHandler = handler;
     }
@@ -27548,11 +27612,12 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
                 ...(0,_utils__WEBPACK_IMPORTED_MODULE_2__.getNavigatorInfo)(),
                 ...((sessionPayload === null || sessionPayload === void 0 ? void 0 : sessionPayload.resourceAttributes) || {}),
             },
+            userAttributes: this._userAttributes
         };
         const { state } = await this._apiService.checkRemoteSession(payload);
         if (state == 'START') {
             if (this.sessionState !== _types__WEBPACK_IMPORTED_MODULE_3__.SessionState.started) {
-                await this.start(_multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_11__.SessionType.CONTINUOUS);
+                await this.start(_multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_12__.SessionType.CONTINUOUS);
             }
         }
         else if (state == 'STOP') {
@@ -27601,7 +27666,7 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
     }
     _handleStart() {
         if (this.sessionState === _types__WEBPACK_IMPORTED_MODULE_3__.SessionState.stopped) {
-            this.start(_multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_11__.SessionType.MANUAL);
+            this.start(_multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_12__.SessionType.MANUAL);
         }
     }
     _handleStop(comment) {
@@ -27631,14 +27696,14 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
     }
     _handleContinuousDebugging() {
         if (this.sessionState === _types__WEBPACK_IMPORTED_MODULE_3__.SessionState.stopped) {
-            this.start(_multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_11__.SessionType.CONTINUOUS);
+            this.start(_multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_12__.SessionType.CONTINUOUS);
         }
     }
     /**
      * Register session limit reaching listeners for controlling session end
      */
     _registerSessionLimitReach() {
-        _eventBus__WEBPACK_IMPORTED_MODULE_6__.recorderEventBus.on(_config__WEBPACK_IMPORTED_MODULE_4__.SESSION_STOPPED_EVENT, () => {
+        _eventBus__WEBPACK_IMPORTED_MODULE_7__.recorderEventBus.on(_config__WEBPACK_IMPORTED_MODULE_5__.SESSION_STOPPED_EVENT, () => {
             this._stop();
             this._clearSession();
             this._sessionWidget.handleUIReseting();
@@ -27648,7 +27713,7 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
      * Register session auto creation listeners during continuous recording
      */
     _registerSessionAutoCreation() {
-        _eventBus__WEBPACK_IMPORTED_MODULE_6__.recorderEventBus.on(_config__WEBPACK_IMPORTED_MODULE_4__.SESSION_AUTO_CREATED, (payload) => {
+        _eventBus__WEBPACK_IMPORTED_MODULE_7__.recorderEventBus.on(_config__WEBPACK_IMPORTED_MODULE_5__.SESSION_AUTO_CREATED, (payload) => {
             var _a;
             if (!(payload === null || payload === void 0 ? void 0 : payload.data))
                 return;
@@ -27662,6 +27727,18 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
             }, 5000);
         });
     }
+    _registerRemoteSessionRecordingStart() {
+        _eventBus__WEBPACK_IMPORTED_MODULE_7__.recorderEventBus.on(_config__WEBPACK_IMPORTED_MODULE_5__.REMOTE_SESSION_RECORDING_START, (payload) => {
+            console.log('REMOTE_SESSION_RECORDING_START', payload);
+            this.start();
+        });
+    }
+    _registerRemoteSessionRecordingStop() {
+        _eventBus__WEBPACK_IMPORTED_MODULE_7__.recorderEventBus.on(_config__WEBPACK_IMPORTED_MODULE_5__.REMOTE_SESSION_RECORDING_STOP, (payload) => {
+            console.log('REMOTE_SESSION_RECORDING_STOP', payload);
+            this.stop();
+        });
+    }
     /**
      * Create a new session and start it
      */
@@ -27672,6 +27749,7 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
             const payload = {
                 sessionAttributes: this.sessionAttributes,
                 resourceAttributes: (0,_utils__WEBPACK_IMPORTED_MODULE_2__.getNavigatorInfo)(),
+                userAttributes: this._userAttributes,
                 name: this.sessionAttributes.userName
                     ? `${this.sessionAttributes.userName}'s session on ${(0,_utils__WEBPACK_IMPORTED_MODULE_2__.getFormattedDate)(Date.now(), { month: 'short', day: 'numeric' })}`
                     : `Session on ${(0,_utils__WEBPACK_IMPORTED_MODULE_2__.getFormattedDate)(Date.now())}`,
@@ -27683,8 +27761,8 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
                 : await this._apiService.startSession(request, signal);
             if (session) {
                 session.sessionType = this.continuousRecording
-                    ? _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_11__.SessionType.CONTINUOUS
-                    : _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_11__.SessionType.MANUAL;
+                    ? _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_12__.SessionType.CONTINUOUS
+                    : _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_12__.SessionType.MANUAL;
                 this._setupSessionAndStart(session, false);
             }
         }
@@ -27692,7 +27770,7 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
             this.error = error.message;
             this.sessionState = _types__WEBPACK_IMPORTED_MODULE_3__.SessionState.stopped;
             if (this.continuousRecording) {
-                this.sessionType = _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_11__.SessionType.MANUAL;
+                this.sessionType = _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_12__.SessionType.MANUAL;
             }
         }
     }
@@ -27707,7 +27785,7 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
         this._recorder.start(this.sessionId, this.sessionType);
         this._navigationRecorder.start({ sessionId: this.sessionId, sessionType: this.sessionType, });
         if (this.session) {
-            _eventBus__WEBPACK_IMPORTED_MODULE_6__.recorderEventBus.emit(_config__WEBPACK_IMPORTED_MODULE_4__.SESSION_STARTED_EVENT, this.session);
+            _eventBus__WEBPACK_IMPORTED_MODULE_7__.recorderEventBus.emit(_config__WEBPACK_IMPORTED_MODULE_5__.SESSION_STARTED_EVENT, this.session);
             this._recorder.subscribeToSession(this.session);
             this._sessionWidget.seconds = (0,_utils__WEBPACK_IMPORTED_MODULE_2__.getTimeDifferenceInSeconds)((_a = this.session) === null || _a === void 0 ? void 0 : _a.startedAt);
         }
@@ -27833,6 +27911,10 @@ class SessionRecorder extends lib0_observable__WEBPACK_IMPORTED_MODULE_14__.Obse
             return { errorInfo: String(errorInfo) };
         }
     }
+    setUser(userAttributes) {
+        this._userAttributes = userAttributes;
+        _services_socket_service__WEBPACK_IMPORTED_MODULE_4__.socketService === null || _services_socket_service__WEBPACK_IMPORTED_MODULE_4__.socketService === void 0 ? void 0 : _services_socket_service__WEBPACK_IMPORTED_MODULE_4__.socketService.setUser(this._userAttributes);
+    }
 }
 
 
@@ -29183,6 +29265,27 @@ const getButtonTemplate = (button) => {
 };
 
 
+/***/ }),
+
+/***/ "./src/types/client-type.enum.ts":
+/*!***************************************!*\
+  !*** ./src/types/client-type.enum.ts ***!
+  \***************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   UserType: () => (/* binding */ UserType)
+/* harmony export */ });
+var UserType;
+(function (UserType) {
+    UserType["USER"] = "USER";
+    UserType["VISITOR"] = "VISITOR";
+    UserType["API_CLIENT"] = "API_CLIENT";
+})(UserType || (UserType = {}));
+
+
 /***/ }),
 
 /***/ "./src/types/index.ts":
@@ -29196,11 +29299,14 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 /* harmony export */   DebugSessionDataType: () => (/* reexport safe */ _session__WEBPACK_IMPORTED_MODULE_1__.DebugSessionDataType),
 /* harmony export */   SessionState: () => (/* reexport safe */ _sessionRecorder__WEBPACK_IMPORTED_MODULE_2__.SessionState),
+/* harmony export */   UserType: () => (/* reexport safe */ _client_type_enum__WEBPACK_IMPORTED_MODULE_3__.UserType),
 /* harmony export */   WidgetButtonPlacement: () => (/* reexport safe */ _sessionRecorder__WEBPACK_IMPORTED_MODULE_2__.WidgetButtonPlacement)
 /* harmony export */ });
 /* harmony import */ var _widget__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./widget */ "./src/types/widget.ts");
 /* harmony import */ var _session__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./session */ "./src/types/session.ts");
 /* harmony import */ var _sessionRecorder__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./sessionRecorder */ "./src/types/sessionRecorder.ts");
+/* harmony import */ var _client_type_enum__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./client-type.enum */ "./src/types/client-type.enum.ts");
+
 
 
 
@@ -49366,6 +49472,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   SessionRecorderTraceIdRatioBasedSampler: () => (/* reexport safe */ _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_6__.SessionRecorderTraceIdRatioBasedSampler),
 /* harmony export */   SessionState: () => (/* reexport safe */ _types__WEBPACK_IMPORTED_MODULE_4__.SessionState),
 /* harmony export */   SessionType: () => (/* reexport safe */ _multiplayer_app_session_recorder_common__WEBPACK_IMPORTED_MODULE_6__.SessionType),
+/* harmony export */   UserType: () => (/* reexport safe */ _types__WEBPACK_IMPORTED_MODULE_4__.UserType),
 /* harmony export */   WidgetButtonPlacement: () => (/* reexport safe */ _types__WEBPACK_IMPORTED_MODULE_4__.WidgetButtonPlacement),
 /* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__),
 /* harmony export */   recorderEventBus: () => (/* reexport safe */ _eventBus__WEBPACK_IMPORTED_MODULE_2__.recorderEventBus)