@devskin/browser-sdk 1.0.24 → 1.0.26

package/dist/devskin.esm.js

@@ -13867,7 +13867,7 @@ class DevSkinSDK {
      * Initialize the DevSkin SDK
      */
     init(config) {
-        var _a, _b, _c, _d;
+        var _a;
         if (this.initialized) {
             console.warn('[DevSkin] SDK already initialized');
             return;
@@ -13903,24 +13903,20 @@ class DevSkinSDK {
             this.networkCollector = new NetworkCollector(this.config, this.transport);
             this.networkCollector.start();
         }
-        // Initialize heatmap collector
-        // Auto-enable heatmap if session recording is enabled
-        const heatmapEnabled = ((_a = this.config.heatmapOptions) === null || _a === void 0 ? void 0 : _a.enabled) || ((_b = this.config.sessionRecording) === null || _b === void 0 ? void 0 : _b.enabled);
-        if (heatmapEnabled) {
-            // Merge default heatmap config with user config
-            const heatmapConfig = Object.assign({ enabled: true, trackClicks: true, trackScroll: true, trackMouseMovement: true, mouseMoveSampling: 0.05 }, this.config.heatmapOptions);
-            this.config.heatmapOptions = heatmapConfig;
-            this.heatmapCollector = new HeatmapCollector(this.config, this.transport);
-            this.heatmapCollector.start();
-            // Initialize screenshot collector and capture page
-            this.screenshotCollector = new ScreenshotCollector(this.config, this.transport);
-            this.screenshotCollector.captureAndSend(this.sessionId, window.location.href);
-            if (this.config.debug) {
-                console.log('[DevSkin] Heatmap collection enabled', ((_c = this.config.sessionRecording) === null || _c === void 0 ? void 0 : _c.enabled) ? '(auto-enabled with session recording)' : '');
-            }
+        // Initialize heatmap collector - SEMPRE habilitado
+        // Merge default heatmap config with user config
+        const heatmapConfig = Object.assign({ enabled: true, trackClicks: true, trackScroll: true, trackMouseMovement: true, mouseMoveSampling: 0.1 }, this.config.heatmapOptions);
+        this.config.heatmapOptions = heatmapConfig;
+        this.heatmapCollector = new HeatmapCollector(this.config, this.transport);
+        this.heatmapCollector.start();
+        // Initialize screenshot collector and capture page
+        this.screenshotCollector = new ScreenshotCollector(this.config, this.transport);
+        this.screenshotCollector.captureAndSend(this.sessionId, window.location.href);
+        if (this.config.debug) {
+            console.log('[DevSkin] Heatmap collection enabled (always on)');
         }
         // Initialize session recording with rrweb
-        if ((_d = this.config.sessionRecording) === null || _d === void 0 ? void 0 : _d.enabled) {
+        if ((_a = this.config.sessionRecording) === null || _a === void 0 ? void 0 : _a.enabled) {
             // Use RRWebRecorder for complete DOM recording
             this.rrwebRecorder = new RRWebRecorder(this.sessionId, {
                 enabled: true,
@@ -14064,11 +14060,32 @@ class DevSkinSDK {
      * Private methods
      */
     startSession() {
-        var _a;
+        var _a, _b, _c;
+        // Check if there's an active session (stored in sessionStorage to persist across page navigations)
+        const existingSessionId = sessionStorage.getItem('devskin_session_id');
+        const existingSessionStart = sessionStorage.getItem('devskin_session_start');
+        if (existingSessionId && existingSessionStart) {
+            // Resume existing session
+            this.sessionId = existingSessionId;
+            this.sessionStartTime = parseInt(existingSessionStart, 10);
+            if ((_a = this.config) === null || _a === void 0 ? void 0 : _a.debug) {
+                console.log('[DevSkin] Resuming existing session:', this.sessionId);
+            }
+            // Send page view but DON'T create a new session
+            // The session is already created, just continue it
+            return;
+        }
+        // Create new session
         this.sessionId = this.generateId();
         this.sessionStartTime = Date.now();
+        // Store in sessionStorage (persists across page navigations in same tab)
+        sessionStorage.setItem('devskin_session_id', this.sessionId);
+        sessionStorage.setItem('devskin_session_start', this.sessionStartTime.toString());
         const sessionData = Object.assign({ session_id: this.sessionId, user_id: this.userId || undefined, anonymous_id: this.anonymousId, started_at: new Date().toISOString() }, this.getContextData());
-        (_a = this.transport) === null || _a === void 0 ? void 0 : _a.startSession(sessionData);
+        (_b = this.transport) === null || _b === void 0 ? void 0 : _b.startSession(sessionData);
+        if ((_c = this.config) === null || _c === void 0 ? void 0 : _c.debug) {
+            console.log('[DevSkin] New session created:', this.sessionId);
+        }
     }
     getContextData() {
         const context = {};
@@ -14105,16 +14122,26 @@ class DevSkinSDK {
         });
     }
     setupUnloadTracking() {
-        window.addEventListener('beforeunload', () => {
+        // Use pagehide event which is more reliable than beforeunload
+        window.addEventListener('pagehide', (event) => {
             var _a, _b;
-            this.track('page_unload');
-            // Send session end update with duration AND context data
-            if (this.sessionId && this.sessionStartTime) {
-                const endedAt = new Date();
-                const durationMs = Date.now() - this.sessionStartTime;
-                (_a = this.transport) === null || _a === void 0 ? void 0 : _a.startSession(Object.assign({ session_id: this.sessionId, user_id: this.userId || undefined, anonymous_id: this.anonymousId, ended_at: endedAt.toISOString(), duration_ms: durationMs }, this.getContextData()));
+            // Only end session if tab is actually closing (not just navigating)
+            // persisted = false means the page is going into bfcache (navigation)
+            // persisted = true OR event doesn't exist means actual close
+            const isActualClose = !event.persisted;
+            if (isActualClose) {
+                this.track('page_unload');
+                // Only send session end if tab is actually closing
+                if (this.sessionId && this.sessionStartTime) {
+                    const endedAt = new Date();
+                    const durationMs = Date.now() - this.sessionStartTime;
+                    (_a = this.transport) === null || _a === void 0 ? void 0 : _a.startSession(Object.assign({ session_id: this.sessionId, user_id: this.userId || undefined, anonymous_id: this.anonymousId, ended_at: endedAt.toISOString(), duration_ms: durationMs }, this.getContextData()));
+                    // Clear session storage since session is ending
+                    sessionStorage.removeItem('devskin_session_id');
+                    sessionStorage.removeItem('devskin_session_start');
+                }
             }
-            // Send any pending data
+            // Always flush pending data (whether navigation or close)
             (_b = this.transport) === null || _b === void 0 ? void 0 : _b.flush(true); // Use beacon for reliability
         });
     }