@zaplier/sdk 1.3.7 → 1.4.0

package/dist/sdk.js

@@ -19012,35 +19012,25 @@
     !function(t2) {
       t2[t2.NotStarted = 0] = "NotStarted", t2[t2.Running = 1] = "Running", t2[t2.Stopped = 2] = "Stopped";
     }(n || (n = {}));
-    const { takeFullSnapshot } = record;
 
     /**
-     * Session Replay Engine
-     * Uses rrweb to capture DOM snapshots and events for session replay
+     * Session Replay Engine - Simplified Implementation
+     * Based on official rrweb example for maximum compatibility
      */
     class SessionReplayEngine {
         constructor(sessionId, config = {}) {
             this.events = [];
             this.isActive = false;
-            this.hasFullSnapshot = false;
-            this.startTime = 0;
             this.sessionId = sessionId;
             this.config = {
                 enabled: true,
-                sampleRate: 1.0, // 100% for development/testing
-                maskSensitiveFields: true,
-                maxEventBuffer: 1000,
-                batchInterval: 2000, // Send every 2 seconds for faster testing
-                captureClicks: true,
-                captureScrolls: true,
-                captureInputs: true,
-                captureMouseMoves: false, // Disabled by default for performance
-                compressionEnabled: true,
+                sampleRate: 1.0,
+                batchInterval: 10000, // 10 seconds like official example
                 ...config,
             };
         }
         /**
-         * Start session replay recording using rrweb
+         * Start session replay recording - Simplified like official example
          */
         start() {
             if (!this.config.enabled || this.isActive) {
@@ -19051,60 +19041,16 @@
                 return false;
             }
             try {
-                // Start rrweb recording
-                // Using minimal configuration to avoid known bugs in alpha versions
-                // blockSelector and maskTextSelector removed due to node.matches error
+                // Simple rrweb recording configuration like official example
                 this.rrwebStopRecord = record({
                     emit: (event) => {
-                        this.handleRRWebEvent(event);
+                        // Simple event capture - no processing
+                        this.events.push(event);
                     },
-                    maskAllInputs: this.config.maskSensitiveFields,
-                    // maskTextSelector removed - causes node.matches error in some cases
-                    // blockSelector removed - causes node.matches error
-                    recordCanvas: false, // Disable canvas recording for performance
-                    recordCrossOriginIframes: false,
-                    inlineStylesheet: true,
-                    collectFonts: false, // Disable font collection for smaller payloads
                 });
                 this.isActive = true;
-                this.hasFullSnapshot = false;
-                this.startTime = Date.now();
                 this.startBatchTimer();
-                // WORKAROUND: Force FullSnapshot creation IMMEDIATELY to fix rrweb 2.0.0-alpha bug
-                // where FullSnapshot is sometimes not created as the first event
-                setTimeout(() => {
-                    if (!this.hasFullSnapshot) {
-                        console.log("[Zaplier] Forcing immediate FullSnapshot to ensure correct event order...");
-                        try {
-                            takeFullSnapshot(true); // Force a new FullSnapshot immediately
-                            console.log("[Zaplier] FullSnapshot manually triggered");
-                        }
-                        catch (error) {
-                            console.error("[Zaplier] Failed to force FullSnapshot:", error);
-                        }
-                    }
-                }, 50); // Very short delay but let natural events come first
-                // Set timeout to check if FullSnapshot was captured
-                this.snapshotTimeout = window.setTimeout(() => {
-                    if (!this.hasFullSnapshot) {
-                        console.error("[Zaplier] CRITICAL: FullSnapshot not captured after 5 seconds!", {
-                            eventsReceived: this.events.length,
-                            eventTypes: this.events.map((e) => e.type).slice(0, 10),
-                        });
-                        // Try one more forced snapshot as last resort
-                        try {
-                            console.warn("[Zaplier] Last resort: forcing FullSnapshot...");
-                            takeFullSnapshot(true);
-                        }
-                        catch (error) {
-                            console.error("[Zaplier] Failed to create emergency FullSnapshot:", error);
-                        }
-                    }
-                    else {
-                        console.log("[Zaplier] ✅ FullSnapshot confirmed captured");
-                    }
-                }, 5000);
-                console.log("[Zaplier] Session replay started with rrweb");
+                console.log("[Zaplier] Session replay started - simple mode");
                 return true;
             }
             catch (error) {
@@ -19128,87 +19074,9 @@
                 clearInterval(this.batchTimer);
                 this.batchTimer = undefined;
             }
-            if (this.snapshotTimeout) {
-                clearTimeout(this.snapshotTimeout);
-                this.snapshotTimeout = undefined;
-            }
             // Send final batch
             this.sendBatch();
         }
-        /**
-         * Handle events from rrweb
-         */
-        handleRRWebEvent(event) {
-            try {
-                // Log ALL events until we get FullSnapshot, then log first 5
-                const shouldLog = !this.hasFullSnapshot || this.events.length < 5;
-                if (shouldLog) {
-                    const eventTypeNames = {
-                        [EventType.DomContentLoaded]: "DomContentLoaded",
-                        [EventType.Load]: "Load",
-                        [EventType.FullSnapshot]: "FullSnapshot",
-                        [EventType.IncrementalSnapshot]: "IncrementalSnapshot",
-                        [EventType.Meta]: "Meta",
-                        [EventType.Custom]: "Custom",
-                        [EventType.Plugin]: "Plugin",
-                    };
-                    console.log(`[Zaplier] Received event type ${event.type} (${eventTypeNames[event.type] || "Unknown"})`, {
-                        timestamp: new Date(event.timestamp).toISOString(),
-                        isFirst: this.events.length === 0,
-                        totalEvents: this.events.length + 1,
-                    });
-                }
-                // Check if this is a FullSnapshot
-                if (event.type === EventType.FullSnapshot) {
-                    this.hasFullSnapshot = true;
-                    console.log("[Zaplier] ✅ FullSnapshot captured! Replay will work correctly.");
-                    // Clear timeout since we got the snapshot
-                    if (this.snapshotTimeout) {
-                        clearTimeout(this.snapshotTimeout);
-                        this.snapshotTimeout = undefined;
-                    }
-                }
-                else if (this.events.length === 0) {
-                    // First event is NOT a FullSnapshot - this is a problem!
-                    console.error(`[Zaplier] ⚠️ WARNING: First event is type ${event.type}, not FullSnapshot! Replay may not work.`);
-                }
-                // Add event to buffer
-                this.addEvent(event);
-                // If we just got the FullSnapshot and have events, try sending immediately
-                if (event.type === EventType.FullSnapshot && this.events.length > 0) {
-                    // Small delay to ensure all initial events are captured
-                    setTimeout(() => {
-                        this.sendBatch();
-                    }, 100);
-                }
-            }
-            catch (error) {
-                // Silently ignore errors from rrweb to prevent breaking the app
-                // The error is likely from rrweb's internal processing
-                console.warn("[Zaplier] Error handling rrweb event:", error);
-            }
-        }
-        /**
-         * Add event to buffer
-         */
-        addEvent(event) {
-            this.events.push(event);
-            // Prevent memory overflow
-            if (this.events.length > this.config.maxEventBuffer) {
-                // Keep FullSnapshot if present
-                const fullSnapshotIndex = this.events.findIndex((e) => e.type === EventType.FullSnapshot);
-                if (fullSnapshotIndex >= 0 &&
-                    fullSnapshotIndex < this.events.length - this.config.maxEventBuffer) {
-                    // Keep snapshot and recent events
-                    const snapshot = this.events[fullSnapshotIndex];
-                    const recentEvents = this.events.slice(-this.config.maxEventBuffer + 1);
-                    this.events = [snapshot, ...recentEvents];
-                }
-                else {
-                    this.events = this.events.slice(-this.config.maxEventBuffer);
-                }
-            }
-        }
         /**
          * Start batch timer
          */
@@ -19218,48 +19086,29 @@
             }, this.config.batchInterval);
         }
         /**
-         * Send batch of events
+         * Send batch of events - Simplified like official example
          */
         sendBatch() {
             if (this.events.length === 0) {
                 return;
             }
-            // CRITICAL: Never send batches without FullSnapshot - replay won't work!
-            if (!this.hasFullSnapshot) {
-                const waitTime = Date.now() - this.startTime;
-                // Only log every 2 seconds to avoid spam
-                if (waitTime % 2000 < 100) {
-                    console.warn(`[Zaplier] Waiting for FullSnapshot before sending batch... (${Math.floor(waitTime / 1000)}s). Events so far: ${this.events.length}, types:`, this.events.map((e) => e.type).slice(0, 5));
-                }
-                return; // Don't send without FullSnapshot
-            }
-            const batch = [...this.events];
-            this.events = [];
-            // IMPORTANT: Ensure FullSnapshot comes first in the batch
-            const fullSnapshotIndex = batch.findIndex((e) => e.type === EventType.FullSnapshot);
-            if (fullSnapshotIndex > 0) {
-                console.log("[Zaplier] Reordering events - moving FullSnapshot to first position");
-                const fullSnapshot = batch.splice(fullSnapshotIndex, 1)[0];
-                if (fullSnapshot) {
-                    batch.unshift(fullSnapshot);
-                }
-            }
-            // Verify batch has FullSnapshot
-            const hasSnapshot = batch.some((e) => e.type === EventType.FullSnapshot);
-            if (!hasSnapshot && this.hasFullSnapshot) {
-                console.warn("[Zaplier] Batch missing FullSnapshot, but one was captured earlier");
-            }
-            console.log(`[Zaplier] Sending batch with ${batch.length} events for session ${this.sessionId}`, { hasSnapshot, firstEventType: batch[0]?.type, eventTypes: batch.slice(0, 5).map(e => e.type) });
+            // Simple payload structure like official example
             const payload = {
                 sessionId: this.sessionId,
-                events: batch,
+                events: [...this.events], // Copy events array
                 metadata: {
                     userAgent: navigator.userAgent,
                     timestamp: Date.now(),
-                    compression: this.config.compressionEnabled,
+                    startUrl: window.location.href,
+                    duration: Date.now() - (performance.timeOrigin || Date.now()),
+                    funnelSteps: [],
+                    hasConversion: false,
                 },
             };
-            // This will be handled by the anti-adblock manager
+            // Reset events array like official example
+            this.events = [];
+            console.log(`[Zaplier] Sending batch with ${payload.events.length} events`);
+            // Send to backend
             this.sendToBackend(payload);
         }
         /**
@@ -19277,24 +19126,8 @@
                     console.error("[Zaplier] No SDK instance available for replay transport");
                     return;
                 }
-                console.log(`[Zaplier] Sending replay batch via SDK transport`);
-                console.log(`[Zaplier] Payload:`, {
-                    sessionId: payload.sessionId,
-                    eventCount: payload.events.length,
-                    hasMetadata: !!payload.metadata,
-                });
-                // Use SDK's sendReplayBatch method
-                const result = await this.sdkInstance.sendReplayBatch({
-                    sessionId: payload.sessionId,
-                    events: payload.events,
-                    metadata: {
-                        startUrl: window.location.href,
-                        duration: Date.now() - (performance.timeOrigin || Date.now()),
-                        funnelSteps: [],
-                        hasConversion: false,
-                        ...payload.metadata,
-                    },
-                });
+                // Use SDK's sendReplayBatch method with simplified payload
+                const result = await this.sdkInstance.sendReplayBatch(payload);
                 if (result && result.success) {
                     console.log("[Zaplier] Session replay batch sent successfully");
                 }
@@ -19424,8 +19257,6 @@
                         // When explicitly enabled, use 100% sample rate
                         this.replayEngine = new SessionReplayEngine(sessionId, {
                             sampleRate: 1.0, // Force 100% when explicitly enabled
-                            maskSensitiveFields: this.config.replayMaskInputs,
-                            compressionEnabled: true,
                         });
                         // Connect to anti-adblock manager
                         if (this.antiAdblockManager) {
@@ -19452,8 +19283,6 @@
                             const sessionId = this.sessionId;
                             this.replayEngine = new SessionReplayEngine(sessionId, {
                                 sampleRate: 1.0, // Force 100% when explicitly enabled
-                                maskSensitiveFields: this.config.replayMaskInputs,
-                                compressionEnabled: true,
                             });
                             // Connect to anti-adblock manager
                             if (this.antiAdblockManager) {
@@ -19494,8 +19323,6 @@
                         const sessionId = this.sessionId;
                         this.replayEngine = new SessionReplayEngine(sessionId, {
                             sampleRate: 1.0, // Force recording when manually started
-                            maskSensitiveFields: this.config.replayMaskInputs,
-                            compressionEnabled: true,
                         });
                         // Connect to anti-adblock manager
                         if (this.antiAdblockManager) {
@@ -19600,8 +19427,6 @@
                     const sampleRate = this.config.replay === true ? 1.0 : this.config.replaySampling;
                     this.replayEngine = new SessionReplayEngine(this.sessionId, {
                         sampleRate: sampleRate,
-                        maskSensitiveFields: this.config.replayMaskInputs,
-                        compressionEnabled: true,
                     });
                     // Connect SDK instance for transport
                     this.replayEngine.setSDKInstance(this);