@zaplier/sdk 1.7.2 → 1.7.3

package/dist/index.cjs

@@ -19276,85 +19276,6 @@ class AutoTracker {
          */
         this.cachedScrollElements = null;
         this.lastScrollElementsCheck = 0;
-        this.handleScroll = () => {
-            if (!this.config.trackScrolls)
-                return;
-            // Throttle scroll events for performance
-            const now = Date.now();
-            if (now - this.scrollThrottle < 100)
-                return; // 100ms throttle
-            this.scrollThrottle = now;
-            const scrollElements = document.querySelectorAll('[data-track-scroll]');
-            if (this.config.debug && scrollElements.length > 0) {
-                console.log(`[AutoTracker] Checking ${scrollElements.length} scroll elements`, {
-                    scrollY: window.scrollY,
-                    innerHeight: window.innerHeight
-                });
-            }
-            scrollElements.forEach((element) => {
-                let hasTriggered = element.getAttribute('data-scroll-triggered') === 'true';
-                if (hasTriggered)
-                    return;
-                const threshold = parseFloat(element.getAttribute("data-scroll-threshold") || "0.5");
-                const rect = element.getBoundingClientRect();
-                const elementHeight = rect.height;
-                const visibleHeight = Math.min(rect.bottom, window.innerHeight) - Math.max(rect.top, 0);
-                const visibilityRatio = Math.max(0, visibleHeight) / elementHeight;
-                if (this.config.debug) {
-                    console.log(`[AutoTracker] Element check:`, {
-                        elementId: element.id || element.className,
-                        visibilityRatio: Math.round(visibilityRatio * 100) / 100,
-                        threshold,
-                        triggered: hasTriggered
-                    });
-                }
-                if (visibilityRatio >= threshold) {
-                    element.setAttribute('data-scroll-triggered', 'true');
-                    const eventName = element.getAttribute("data-track-scroll");
-                    if (!eventName)
-                        return;
-                    const metadata = this.extractMetadata(element);
-                    this.trackEvent(eventName, {
-                        type: "scroll",
-                        element: element.tagName.toLowerCase(),
-                        threshold,
-                        scrollDepth: window.scrollY,
-                        visibilityRatio: Math.round(visibilityRatio * 100) / 100,
-                        ...metadata,
-                    });
-                    if (this.config.debug) {
-                        console.log(`[AutoTracker] Scroll tracked: ${eventName}`, {
-                            threshold,
-                            visibilityRatio,
-                            scrollDepth: window.scrollY,
-                            ...metadata
-                        });
-                    }
-                }
-            });
-        };
-        this.handleClick = (event) => {
-            if (!this.config.trackClicks)
-                return;
-            const target = event.target;
-            if (!target || !target.hasAttribute("data-track-click"))
-                return;
-            const eventName = target.getAttribute("data-track-click");
-            if (!eventName)
-                return;
-            const metadata = this.extractMetadata(target);
-            this.trackEvent(eventName, {
-                type: "click",
-                element: target.tagName.toLowerCase(),
-                ...metadata,
-            });
-            if (this.config.debug) {
-                console.log(`[AutoTracker] Click tracked: ${eventName}`, {
-                    element: target.tagName.toLowerCase(),
-                    ...metadata
-                });
-            }
-        };
         this.sdkInstance = sdkInstance;
         this.config = {
             enabled: true,
@@ -19645,18 +19566,44 @@ class AutoTracker {
             const clickHandler = this.createReactCompatibleClickHandler();
             this.delegationHandlers.set('click', clickHandler);
             delegationTarget.addEventListener('click', clickHandler, this.getEventOptions('click'));
+            if (this.config.debug) {
+                console.log("[👆 AutoTracker] Click delegation handler added");
+            }
         }
-        // Scroll delegation with enhanced detection
+        // CRITICAL FIX: Scroll delegation with enhanced detection
         if (this.config.trackScrolls) {
             const scrollHandler = this.createEnhancedScrollHandler();
             this.delegationHandlers.set('scroll', scrollHandler);
+            // Always use document for scroll events (window doesn't work with removeEventListener)
             document.addEventListener('scroll', scrollHandler, this.getEventOptions('scroll'));
+            if (this.config.debug) {
+                console.log("[📜 AutoTracker] Scroll delegation handler added to document");
+                // Immediate test of element detection
+                setTimeout(() => {
+                    const scrollElements = this.getCachedScrollElements();
+                    console.log(`[📜 AutoTracker] Initial scroll elements check: ${scrollElements.length} found`);
+                    if (scrollElements.length > 0) {
+                        Array.from(scrollElements).forEach((element, index) => {
+                            console.log(`[📜 AutoTracker] Element ${index + 1}:`, {
+                                id: element.id || 'no-id',
+                                trackEvent: element.getAttribute('data-track-scroll'),
+                                threshold: element.getAttribute('data-scroll-threshold') || '0.5',
+                                tagName: element.tagName
+                            });
+                        });
+                    }
+                }, 100);
+            }
         }
         // Setup debounced mutation observer for dynamic content
         this.setupIntelligentMutationObserver();
         this.isInitialized = true;
         if (this.config.debug) {
-            console.log("[✅ AutoTracker] Event delegation setup complete");
+            console.log("[✅ AutoTracker] Event delegation setup complete", {
+                clickHandler: this.delegationHandlers.has('click'),
+                scrollHandler: this.delegationHandlers.has('scroll'),
+                totalHandlers: this.delegationHandlers.size
+            });
         }
     }
     /**
@@ -19795,33 +19742,50 @@ class AutoTracker {
                 this.scrollThrottle = now;
                 // Enhanced element finding with caching
                 const scrollElements = this.getCachedScrollElements();
-                if (this.config.debug && scrollElements.length > 0) {
-                    console.log(`[📜 AutoTracker] Processing ${scrollElements.length} scroll elements`, {
+                if (this.config.debug) {
+                    console.log(`[📜 AutoTracker] Enhanced scroll handler triggered`, {
+                        scrollElementsFound: scrollElements.length,
+                        scrollY: window.scrollY,
                         throttleDelay,
-                        timeDelta,
-                        scrollY: window.scrollY
+                        timeDelta
                     });
                 }
                 // Process elements with enhanced visibility detection
-                scrollElements.forEach((element) => {
-                    this.processScrollElementEnhanced(element);
-                });
+                if (scrollElements.length > 0) {
+                    scrollElements.forEach((element) => {
+                        this.processScrollElementEnhanced(element);
+                    });
+                }
+                else if (this.config.debug) {
+                    console.log(`[📜 AutoTracker] No scroll elements found to process`);
+                }
             }
             catch (error) {
                 if (this.config.debug) {
-                    console.error('[❌ AutoTracker] Scroll handler error:', error);
+                    console.error('[❌ AutoTracker] Enhanced scroll handler error:', error);
                 }
             }
         };
     }
     getCachedScrollElements() {
         const now = Date.now();
-        const cacheExpiry = 5000; // 5 seconds
+        const cacheExpiry = 2000; // Reduced to 2 seconds for faster detection
         if (!this.cachedScrollElements || (now - this.lastScrollElementsCheck) > cacheExpiry) {
             this.cachedScrollElements = document.querySelectorAll('[data-track-scroll]');
             this.lastScrollElementsCheck = now;
             if (this.config.debug) {
-                console.log(`[🔄 AutoTracker] Refreshed scroll elements cache: ${this.cachedScrollElements.length} elements`);
+                console.log(`[🔄 AutoTracker] Refreshed scroll elements cache: ${this.cachedScrollElements.length} elements found`);
+                // Log each element found for debugging
+                Array.from(this.cachedScrollElements).forEach((element, index) => {
+                    console.log(`[🔄 AutoTracker] Cached element ${index + 1}:`, {
+                        id: element.id || 'no-id',
+                        className: element.className || 'no-class',
+                        trackEvent: element.getAttribute('data-track-scroll'),
+                        threshold: element.getAttribute('data-scroll-threshold') || '0.5',
+                        tagName: element.tagName,
+                        triggered: element.getAttribute('data-scroll-triggered') === 'true'
+                    });
+                });
             }
         }
         return this.cachedScrollElements;
@@ -19832,43 +19796,63 @@ class AutoTracker {
     processScrollElementEnhanced(element) {
         try {
             const hasTriggered = element.getAttribute('data-scroll-triggered') === 'true';
-            if (hasTriggered)
+            if (hasTriggered) {
+                if (this.config.debug) {
+                    console.log(`[⏭️ AutoTracker] Element already triggered, skipping:`, element.id || element.className || 'no-id');
+                }
                 return;
+            }
             const threshold = parseFloat(element.getAttribute('data-scroll-threshold') || '0.5');
             // Enhanced visibility calculation
             const rect = element.getBoundingClientRect();
             const elementHeight = rect.height;
             const windowHeight = window.innerHeight;
             // Handle edge cases
-            if (elementHeight <= 0)
+            if (elementHeight <= 0) {
+                if (this.config.debug) {
+                    console.log(`[⚠️ AutoTracker] Element has no height, skipping:`, element.id || 'no-id');
+                }
                 return;
+            }
             const visibleTop = Math.max(rect.top, 0);
             const visibleBottom = Math.min(rect.bottom, windowHeight);
             const visibleHeight = Math.max(0, visibleBottom - visibleTop);
             const visibilityRatio = visibleHeight / elementHeight;
+            const eventName = element.getAttribute('data-track-scroll');
+            if (!eventName) {
+                if (this.config.debug) {
+                    console.log(`[⚠️ AutoTracker] Element missing data-track-scroll attribute:`, element.id || 'no-id');
+                }
+                return;
+            }
             if (this.config.debug) {
-                console.log(`[📊 AutoTracker] Enhanced scroll check:`, {
+                console.log(`[📊 AutoTracker] Enhanced scroll check for "${eventName}":`, {
                     elementId: element.id || element.className || 'no-id',
                     rect: {
                         top: Math.round(rect.top),
                         bottom: Math.round(rect.bottom),
                         height: Math.round(elementHeight)
                     },
+                    window: {
+                        height: windowHeight,
+                        scrollY: window.scrollY
+                    },
                     visibility: {
+                        visibleTop,
+                        visibleBottom,
+                        visibleHeight,
                         ratio: Math.round(visibilityRatio * 1000) / 1000,
                         threshold,
-                        triggered: hasTriggered
-                    },
-                    scroll: window.scrollY
+                        triggered: hasTriggered,
+                        shouldTrigger: visibilityRatio >= threshold
+                    }
                 });
             }
             if (visibilityRatio >= threshold) {
+                // Mark as triggered to prevent duplicate events
                 element.setAttribute('data-scroll-triggered', 'true');
-                const eventName = element.getAttribute('data-track-scroll');
-                if (!eventName)
-                    return;
                 const metadata = this.extractMetadata(element);
-                this.trackEvent(eventName, {
+                const eventData = {
                     type: 'scroll',
                     element: element.tagName.toLowerCase(),
                     threshold,
@@ -19876,20 +19860,22 @@ class AutoTracker {
                     visibilityRatio: Math.round(visibilityRatio * 1000) / 1000,
                     enhanced: true,
                     ...metadata,
-                });
+                };
                 if (this.config.debug) {
-                    console.log(`[🎯 AutoTracker] Scroll tracked (enhanced): ${eventName}`, {
-                        threshold,
-                        visibilityRatio: Math.round(visibilityRatio * 1000) / 1000,
-                        scrollDepth: window.scrollY,
-                        ...metadata
-                    });
+                    console.log(`[🎯 AutoTracker] TRIGGERING scroll event "${eventName}":`, eventData);
+                }
+                this.trackEvent(eventName, eventData);
+                if (this.config.debug) {
+                    console.log(`[✅ AutoTracker] Scroll event "${eventName}" sent successfully`);
                 }
             }
         }
         catch (error) {
             if (this.config.debug) {
-                console.error('[❌ AutoTracker] Scroll element processing error:', error);
+                console.error('[❌ AutoTracker] Scroll element processing error:', error, {
+                    element: element.id || element.className || 'no-id',
+                    tagName: element.tagName
+                });
             }
         }
     }
@@ -20271,6 +20257,8 @@ class AutoTracker {
             errors
         };
     }
+    // Legacy handlers removed - now using enhanced event delegation system
+    // All tracking is now handled by createEnhancedScrollHandler and createReactCompatibleClickHandler
     /**
      * Modern API: Refresh tracking for dynamic content (React/SPA support)
      * Industry best practice for SPA route changes
@@ -20396,6 +20384,33 @@ class AutoTracker {
     }
 }
 
+/**
+ * Centralized Session Utilities
+ * Standardized session ID generation for consistency across SDK and backend
+ */
+/**
+ * Generate standardized session ID
+ * Format: visitorId_YYYYMMDD_HH
+ * Example: f697a6e1-1aae-48db-bc6a-afc1d2c01852_20251231_03
+ */
+function generateSessionId(visitorId, date) {
+    const sessionDate = date || new Date();
+    // Format: YYYYMMDD
+    const year = sessionDate.getFullYear();
+    const month = (sessionDate.getMonth() + 1).toString().padStart(2, '0');
+    const day = sessionDate.getDate().toString().padStart(2, '0');
+    const dateStr = `${year}${month}${day}`;
+    // Format: HH (24-hour format)
+    const hour = sessionDate.getHours().toString().padStart(2, '0');
+    return `${visitorId}_${dateStr}_${hour}`;
+}
+/**
+ * Generate session ID for current time
+ */
+function generateCurrentSessionId(visitorId) {
+    return generateSessionId(visitorId, new Date());
+}
+
 /**
  * Visitor Persistence Manager for SDK
  * Implements client-side visitor identification with localStorage camouflage
@@ -20555,9 +20570,23 @@ class VisitorIdentityManager {
     // REMOVED: generateVisitorId() and generateVisitorIdFromHash() methods
     // SDK no longer generates visitor IDs - only backend does
     generateSessionId() {
-        return "ses_" + Array.from(crypto.getRandomValues(new Uint8Array(8)))
-            .map(b => b.toString(16).padStart(2, '0'))
-            .join('') + "_" + Date.now().toString(36);
+        // Try to get existing visitor identity from storage
+        const { value: storedData } = PersistenceManager.get(STORAGE_KEYS.prefs);
+        if (storedData) {
+            try {
+                const parsed = JSON.parse(storedData);
+                if (parsed._v && parsed._vb === true) {
+                    // We have a valid visitor ID from backend
+                    return generateCurrentSessionId(parsed._v);
+                }
+            }
+            catch (e) {
+                // Invalid data, continue to fallback
+            }
+        }
+        // Fallback for cases where visitor ID is not available yet
+        const tempVisitorId = "temp-" + Date.now().toString(36);
+        return generateCurrentSessionId(tempVisitorId);
     }
     createCamouflageData(visitorId, sessionId, stableCoreHash, fromBackend = false) {
         return {
@@ -20567,7 +20596,7 @@ class VisitorIdentityManager {
             analytics: true,
             cookies: true,
             _v: visitorId, // Hidden visitor ID
-            _s: sessionId, // Hidden session ID  
+            _s: sessionId, // Hidden session ID
             _sc: stableCoreHash, // Hidden stable core
             _vb: fromBackend ? true : undefined, // Flag: visitor ID from backend (v1.7.0+)
             ts: Date.now(),
@@ -20611,7 +20640,9 @@ class VisitorIdentityManager {
         const { value: storedData, method } = PersistenceManager.get(STORAGE_KEYS.prefs);
         if (storedData) {
             const existingIdentity = this.extractFromCamouflage(storedData);
-            if (existingIdentity && existingIdentity.stableCoreHash === stableCoreHash && existingIdentity.visitorId) {
+            if (existingIdentity &&
+                existingIdentity.stableCoreHash === stableCoreHash &&
+                existingIdentity.visitorId) {
                 // Update last seen time only if we have a valid visitor ID from backend
                 const updatedCamouflage = this.createCamouflageData(existingIdentity.visitorId, existingIdentity.sessionId, stableCoreHash);
                 PersistenceManager.set(STORAGE_KEYS.prefs, JSON.stringify(updatedCamouflage));
@@ -20631,7 +20662,7 @@ class VisitorIdentityManager {
             stableCoreHash,
             deviceFingerprint: params.deviceFingerprint,
             persistenceMethod: "memory", // Start with memory, upgrade after backend response
-            confidence: 0.90,
+            confidence: 0.9,
             createdAt: Date.now(),
             lastSeen: Date.now(),
             reused: false,
@@ -20646,7 +20677,12 @@ class VisitorIdentityManager {
     async updateVisitorIdFromBackend(visitorId, stableCoreHash, sessionId) {
         try {
             // Create or update camouflaged data with backend visitor ID
-            const currentSessionId = sessionId || this.getCurrentSessionId() || this.generateSessionId();
+            // Regenerate session ID with proper visitor ID if needed
+            let currentSessionId = sessionId || this.getCurrentSessionId();
+            // If we have a temp session ID or no session ID, generate a new one with the proper visitor ID
+            if (!currentSessionId || currentSessionId.includes("temp-")) {
+                currentSessionId = generateCurrentSessionId(visitorId);
+            }
             const camouflageData = this.createCamouflageData(visitorId, currentSessionId, stableCoreHash, true // Mark as coming from backend
             );
             const { success, method } = PersistenceManager.set(STORAGE_KEYS.prefs, JSON.stringify(camouflageData));
@@ -20658,7 +20694,7 @@ class VisitorIdentityManager {
             return false;
         }
         catch (error) {
-            console.error('[VisitorIdentityManager] Failed to update visitor ID from backend:', error);
+            console.error("[VisitorIdentityManager] Failed to update visitor ID from backend:", error);
             return false;
         }
     }
@@ -21112,36 +21148,17 @@ class ZaplierSDK {
         }
     }
     /**
-     * Generate session ID
+     * Generate session ID using standardized format
      */
     generateSessionId() {
-        // Create deterministic session ID based on page load time and stable browser characteristics
-        const pageLoadTime = performance.timeOrigin || Date.now();
-        const browserFingerprint = this.getBrowserFingerprint();
-        // Use page load time + browser fingerprint for session uniqueness within same page load
-        return pageLoadTime.toString(36) + browserFingerprint.substring(0, 8);
-    }
-    /**
-     * Get stable browser characteristics for session ID generation
-     * Uses only stable, privacy-safe values that don't change during session
-     */
-    getBrowserFingerprint() {
-        const components = [
-            navigator.userAgent || "",
-            navigator.platform || "",
-            screen.width || 0,
-            screen.height || 0,
-            new Date(2024, 0, 1).getTimezoneOffset(),
-            navigator.language || "",
-            navigator.hardwareConcurrency || 0,
-        ];
-        const combined = components.join("|");
-        let hash = 0;
-        for (let i = 0; i < combined.length; i++) {
-            const char = combined.charCodeAt(i);
-            hash = ((hash << 5) - hash + char) & 0xffffffff;
+        // Use centralized session generation with current visitor ID
+        if (this.backendVisitorId) {
+            return generateCurrentSessionId(this.backendVisitorId);
         }
-        return Math.abs(hash).toString(36);
+        // Fallback for cases where backendVisitorId is not available yet
+        // This should be rare and will be updated when visitor ID is available
+        const tempVisitorId = this.visitorId || 'temp-' + Date.now().toString(36);
+        return generateCurrentSessionId(tempVisitorId);
     }
     /**
      * Initialize Anti-Adblock Manager
@@ -21400,6 +21417,10 @@ class ZaplierSDK {
             if (response.sessionId) {
                 this.sessionId = response.sessionId;
             }
+            else if (this.backendVisitorId && (!this.sessionId || this.sessionId.includes('temp-'))) {
+                // Generate new session ID now that we have the proper visitor ID
+                this.sessionId = generateCurrentSessionId(this.backendVisitorId);
+            }
             return response;
         }
         catch (error) {