@devskin/browser-sdk 1.0.33 → 1.0.35

package/dist/devskin.cjs.js

@@ -13860,6 +13860,7 @@ class DevSkinSDK {
         this.anonymousId = null;
         this.sessionStartTime = 0;
         this.initialized = false;
+        this.heartbeatInterval = null;
         // Collectors
         this.deviceCollector = null;
         this.locationCollector = null;
@@ -13960,6 +13961,8 @@ class DevSkinSDK {
             }
             // Track initial page view
             this.trackPageView();
+            // Start heartbeat to update session duration every 30 seconds
+            this.startHeartbeat();
         }).catch((err) => {
             console.error('[DevSkin] Failed to create session:', err);
         });
@@ -14175,47 +14178,66 @@ class DevSkinSDK {
     }
     setupUnloadTracking() {
         // CRITICAL: Flush data BEFORE page unloads to avoid losing final events
+        // IMPORTANT: NEVER clear sessionStorage - it expires naturally when tab closes
         // 1. visibilitychange - fires when tab is hidden (most reliable)
         document.addEventListener('visibilitychange', () => {
             var _a, _b;
             if (document.hidden) {
-                // User switched tabs or minimized - flush immediately
+                // User switched tabs or minimized - update duration and flush
+                this.updateSessionDuration();
                 (_a = this.rrwebRecorder) === null || _a === void 0 ? void 0 : _a.stop(); // Stop recording and flush
                 (_b = this.transport) === null || _b === void 0 ? void 0 : _b.flush(true); // Use beacon
             }
         });
         // 2. pagehide - fires when page is being unloaded
-        window.addEventListener('pagehide', (event) => {
-            var _a, _b, _c;
-            const isActualClose = !event.persisted;
-            if (isActualClose) {
-                // Tab is closing - end session
-                this.track('page_unload');
-                if (this.sessionId && this.sessionStartTime) {
-                    const endedAt = new Date();
-                    const durationMs = Date.now() - this.sessionStartTime;
-                    // Use beacon for reliable delivery during page unload
-                    (_a = this.transport) === null || _a === void 0 ? void 0 : _a.startSession(Object.assign({ sessionId: this.sessionId, userId: this.userId || undefined, anonymousId: this.anonymousId, endedAt: endedAt.toISOString(), durationMs: durationMs, platform: 'web' }, this.getContextData()), true); // true = use sendBeacon
-                    // Clear session storage since session is ending
-                    sessionStorage.removeItem('devskin_session_id');
-                    sessionStorage.removeItem('devskin_session_start');
-                }
-            }
-            else {
-                // Navigation - track page change
-                this.track('page_navigation');
-            }
-            // ALWAYS flush (whether navigation or close)
-            (_b = this.rrwebRecorder) === null || _b === void 0 ? void 0 : _b.stop(); // Stop recording and flush remaining events
-            (_c = this.transport) === null || _c === void 0 ? void 0 : _c.flush(true); // Use beacon for reliability
+        window.addEventListener('pagehide', () => {
+            var _a, _b;
+            // Track navigation (we can't distinguish between page navigation and tab close reliably)
+            this.track('page_navigation');
+            // Update duration but DON'T mark as ending (let heartbeat timeout handle session expiry)
+            this.updateSessionDuration(false);
+            // NEVER clear sessionStorage - it persists across navigations in same tab
+            // and expires automatically when tab actually closes
+            // Flush data before page unloads
+            (_a = this.rrwebRecorder) === null || _a === void 0 ? void 0 : _a.stop(); // Stop recording and flush remaining events
+            (_b = this.transport) === null || _b === void 0 ? void 0 : _b.flush(true); // Use beacon for reliability
         });
         // 3. beforeunload - backup for older browsers
         window.addEventListener('beforeunload', () => {
             var _a, _b;
+            // Update duration but DON'T mark as ending
+            this.updateSessionDuration(false);
             (_a = this.rrwebRecorder) === null || _a === void 0 ? void 0 : _a.stop();
             (_b = this.transport) === null || _b === void 0 ? void 0 : _b.flush(true);
         });
     }
+    /**
+     * Start heartbeat to update session duration periodically
+     */
+    startHeartbeat() {
+        // Update duration every 30 seconds
+        this.heartbeatInterval = setInterval(() => {
+            this.updateSessionDuration();
+        }, 30000); // 30 seconds
+    }
+    /**
+     * Update session duration
+     */
+    updateSessionDuration(isEnding = false) {
+        var _a, _b;
+        if (!this.sessionId || !this.sessionStartTime)
+            return;
+        const durationMs = Date.now() - this.sessionStartTime;
+        const payload = Object.assign({ sessionId: this.sessionId, userId: this.userId || undefined, anonymousId: this.anonymousId, durationMs: durationMs, platform: 'web' }, this.getContextData());
+        if (isEnding) {
+            payload.endedAt = new Date().toISOString();
+        }
+        // Use beacon if ending, otherwise regular request
+        (_a = this.transport) === null || _a === void 0 ? void 0 : _a.startSession(payload, isEnding);
+        if ((_b = this.config) === null || _b === void 0 ? void 0 : _b.debug) {
+            console.log('[DevSkin] Session duration updated:', durationMs, 'ms', isEnding ? '(ending)' : '');
+        }
+    }
 }
 // Create singleton instance
 const DevSkin = new DevSkinSDK();