@statsig/web-analytics 3.25.0-beta.1 → 3.25.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@statsig/web-analytics",
-  "version": "3.25.0-beta.1",
+  "version": "3.25.1",
   "license": "ISC",
   "homepage": "https://github.com/statsig-io/js-client-monorepo",
   "repository": {
@@ -9,8 +9,8 @@
     "directory": "packages/web-analytics"
   },
   "dependencies": {
-    "@statsig/client-core": "3.25.0-beta.1",
-    "@statsig/js-client": "3.25.0-beta.1",
+    "@statsig/client-core": "3.25.1",
+    "@statsig/js-client": "3.25.1",
     "web-vitals": "5.0.3"
   },
   "jsdelivr": "./build/statsig-web-analytics.min.js",

package/src/AutoCapture.d.ts

@@ -20,6 +20,7 @@ export declare class AutoCapture {
     private _webVitalsManager;
     private _deadClickManager;
     private _consoleLogManager;
+    private _options?;
     constructor(_client: PrecomputedEvaluationsInterface, options?: AutoCaptureOptions);
     private _addEventHandlers;
     private _addPageViewTracking;

package/src/AutoCapture.js

@@ -49,6 +49,7 @@ class AutoCapture {
         this._hasLoggedPageViewEnd = false;
         this._pageViewLogged = false;
         const { sdkKey, errorBoundary, values } = _client.getContext();
+        this._options = options;
         this._disabledEvents = (_b = (_a = values === null || values === void 0 ? void 0 : values.auto_capture_settings) === null || _a === void 0 ? void 0 : _a.disabled_events) !== null && _b !== void 0 ? _b : {};
         this._errorBoundary = errorBoundary;
         this._errorBoundary.wrap(this, 'autoCapture:');
@@ -111,23 +112,23 @@ class AutoCapture {
         if (!win || !doc) {
             return;
         }
-        (0, commonUtils_1._registerEventHandler)(win, 'popstate', () => this._tryLogPageView());
+        (0, commonUtils_1._registerEventHandler)(win, 'popstate', () => this._tryLogPageView('popstate'));
         window.history.pushState = new Proxy(window.history.pushState, {
             apply: (target, thisArg, [state, unused, url]) => {
                 target.apply(thisArg, [state, unused, url]);
-                this._tryLogPageView();
+                this._tryLogPageView('pushstate');
             },
         });
         window.history.replaceState = new Proxy(window.history.replaceState, {
             apply: (target, thisArg, [state, unused, url]) => {
                 target.apply(thisArg, [state, unused, url]);
-                this._tryLogPageView();
+                this._tryLogPageView('replacestate');
             },
         });
         this._tryLogPageView();
     }
     _autoLogEvent(event) {
-        var _a, _b, _c;
+        var _a, _b, _c, _d;
         const eventType = (_a = event.type) === null || _a === void 0 ? void 0 : _a.toLowerCase();
         if (eventType === 'error' && event instanceof ErrorEvent) {
             this._logError(event);
@@ -151,11 +152,16 @@ class AutoCapture {
             if (!selectedText) {
                 return;
             }
-            metadata['selectedText'] = (0, commonUtils_1._sanitizeString)(selectedText);
+            if ((_d = this._options) === null || _d === void 0 ? void 0 : _d.captureCopyText) {
+                metadata['selectedText'] = (0, commonUtils_1._sanitizeString)(selectedText);
+            }
             const clipType = event.type || 'clipboard';
             metadata['clipType'] = clipType;
         }
         const { value, metadata: eventMetadata } = (0, eventUtils_1._gatherEventData)(target);
+        if (eventMetadata['isOutbound']) {
+            this._engagementManager.setMeaningfulEngagementOccurred(true);
+        }
         Object.assign(metadata, eventMetadata);
         const allMetadata = (0, metadataUtils_1._gatherAllMetadata)((0, commonUtils_1._getSafeUrl)());
         this._enqueueAutoCapture(eventName, value, Object.assign(Object.assign({}, allMetadata), metadata));
@@ -204,15 +210,18 @@ class AutoCapture {
             this._errorBoundary.logError('AC::logSession', err);
         }
     }
-    _tryLogPageView() {
+    _tryLogPageView(navigationType) {
         const url = (0, commonUtils_1._getSafeUrl)();
         const last = this._previousLoggedPageViewUrl;
-        if (last && url.href === last.href) {
+        if (last && url.pathname === last.pathname) {
             return;
         }
         this._engagementManager.setLastPageViewTime(Date.now());
         this._hasLoggedPageViewEnd = false;
         const payload = (0, metadataUtils_1._gatherAllMetadata)(url);
+        if (navigationType) {
+            payload['navigation_type'] = navigationType;
+        }
         if (this._previousLoggedPageViewUrl) {
             payload['last_page_view_url'] = this._previousLoggedPageViewUrl.href;
         }
@@ -232,14 +241,14 @@ class AutoCapture {
             return;
         }
         this._hasLoggedPageViewEnd = true;
-        const scrollMetrics = this._engagementManager.getScrollMetrics();
-        const pageViewLength = this._engagementManager.getPageViewLength();
-        this._enqueueAutoCapture(AutoCaptureEvent_1.AutoCaptureEventName.PAGE_VIEW_END, (0, commonUtils_1._getSanitizedPageUrl)(), Object.assign(Object.assign({}, scrollMetrics), { pageViewLength,
-            dueToInactivity }), {
+        this._enqueueAutoCapture(AutoCaptureEvent_1.AutoCaptureEventName.PAGE_VIEW_END, (0, commonUtils_1._getSanitizedPageUrl)(), Object.assign(Object.assign({}, this._engagementManager.getPageViewEndMetadata()), { dueToInactivity }), {
             flushImmediately: true,
         });
     }
     _logRageClick(e) {
+        if (!(0, commonUtils_1._shouldLogEvent)(e, e.target)) {
+            return;
+        }
         const { value, metadata } = (0, eventUtils_1._gatherEventData)(e.target);
         this._enqueueAutoCapture(AutoCaptureEvent_1.AutoCaptureEventName.RAGE_CLICK, value, Object.assign(Object.assign({ x: e.clientX, y: e.clientY, timestamp: Date.now() }, (0, metadataUtils_1._gatherAllMetadata)((0, commonUtils_1._getSafeUrl)())), metadata));
     }
@@ -311,7 +320,10 @@ class AutoCapture {
         const typedClient = this._client;
         typedClient._possibleFirstTouchMetadata =
             (0, metadataUtils_1._getPossibleFirstTouchMetadata)((0, commonUtils_1._getSafeUrl)());
-        typedClient._user = Object.assign(Object.assign({}, typedClient._user), { analyticsOnlyMetadata: Object.assign(Object.assign({}, typedClient._possibleFirstTouchMetadata), typedClient._user.analyticsOnlyMetadata) });
+        // Only update user if first touch metadata is not empty
+        if (Object.keys(typedClient._possibleFirstTouchMetadata).length > 0) {
+            typedClient._user = Object.assign(Object.assign({}, typedClient._user), { analyticsOnlyMetadata: Object.assign(Object.assign({}, typedClient._possibleFirstTouchMetadata), typedClient._user.analyticsOnlyMetadata) });
+        }
     }
     _flushImmediately() {
         this._client.flush().catch((e) => {

package/src/AutoCaptureOptions.d.ts

@@ -1,11 +1,54 @@
 import { AutoCaptureEvent } from './AutoCaptureEvent';
 import { ConsoleLogLevel } from './ConsoleLogManager';
 export type AutoCaptureOptions = {
+    /**
+     * Optional function to filter which auto-capture events should be recorded.
+     * If provided, this function will be called for each auto-capture event.
+     * Return true to capture the event, false to ignore it.
+     *
+     * @param event - The auto-capture event to evaluate
+     * @returns true if the event should be captured, false otherwise
+     */
     eventFilterFunc?: (event: AutoCaptureEvent) => boolean;
+    /**
+     * Settings for automatically capturing console log events.
+     * When enabled, console.log, console.warn, console.error, etc. calls
+     * will be automatically tracked as statsig::log_line events.
+     */
     consoleLogAutoCaptureSettings?: ConsoleLogAutoCaptureSettings;
+    /**
+     * Whether to capture text content when copy events occur.
+     * When true, the actual text being copied will be sanitized and included in copy event data.
+     * When false or undefined, copy events will be tracked without the text content.
+     *
+     * @default false
+     */
+    captureCopyText?: boolean;
 };
 export type ConsoleLogAutoCaptureSettings = {
+    /**
+     * Whether console log auto-capture is enabled.
+     * When true, console method calls will be automatically tracked.
+     * When false, console events will not be captured.
+     */
     enabled: boolean;
+    /**
+     * The minimum log level to capture.
+     * Only console methods at or above this level will be tracked.
+     * For example, if set to 'warn', only console.warn and console.error will be captured.
+     *
+     * @default 'info' - captures info, log, warn, error levels
+     */
     logLevel?: ConsoleLogLevel;
+    /**
+     * Sampling rate for console log events (0.0 to 1.0).
+     * Determines what percentage of console events should be captured.
+     * 1.0 means capture all events, 0.5 means capture 50% of events, etc.
+     *
+     * @default 1.0 - capture all events
+     */
     sampleRate?: number;
+    maxKeys?: number;
+    maxDepth?: number;
+    maxStringLength?: number;
 };

package/src/ConsoleLogManager.d.ts

@@ -10,12 +10,13 @@ export declare class ConsoleLogManager {
     private _isTracking;
     private _logLevel;
     private readonly __source;
+    private readonly _maxKeys;
+    private readonly _maxDepth;
+    private readonly _maxStringLength;
     constructor(_enqueueFn: (eventName: AutoCaptureEventName, value: string, metadata: Record<string, unknown>) => void, _errorBoundary: ErrorBoundary, _options: ConsoleLogAutoCaptureSettings);
     startTracking(): void;
     stopTracking(): void;
     private _patchConsole;
     private _enqueueConsoleLog;
     private _shouldLog;
-    private _safeStringify;
-    private _getStackTrace;
 }

package/src/ConsoleLogManager.js

@@ -5,6 +5,7 @@ exports.ConsoleLogManager = void 0;
 const client_core_1 = require("@statsig/client-core");
 const AutoCaptureEvent_1 = require("./AutoCaptureEvent");
 const commonUtils_1 = require("./utils/commonUtils");
+const consoleLogsUtils_1 = require("./utils/consoleLogsUtils");
 const metadataUtils_1 = require("./utils/metadataUtils");
 const ConsoleLogPriority = {
     trace: 10,
@@ -14,9 +15,12 @@ const ConsoleLogPriority = {
     warn: 40,
     error: 50,
 };
+const DEFAULT_MAX_KEYS = 10;
+const DEFAULT_MAX_DEPTH = 10;
+const DEFAULT_MAX_STRING_LENGTH = 500;
 class ConsoleLogManager {
     constructor(_enqueueFn, _errorBoundary, _options) {
-        var _a;
+        var _a, _b, _c, _d;
         this._enqueueFn = _enqueueFn;
         this._errorBoundary = _errorBoundary;
         this._options = _options;
@@ -25,6 +29,10 @@ class ConsoleLogManager {
         this._logLevel = 'info';
         this.__source = 'js-auto-capture';
         this._logLevel = (_a = this._options.logLevel) !== null && _a !== void 0 ? _a : 'info';
+        this._maxKeys = (_b = this._options.maxKeys) !== null && _b !== void 0 ? _b : DEFAULT_MAX_KEYS;
+        this._maxDepth = (_c = this._options.maxDepth) !== null && _c !== void 0 ? _c : DEFAULT_MAX_DEPTH;
+        this._maxStringLength =
+            (_d = this._options.maxStringLength) !== null && _d !== void 0 ? _d : DEFAULT_MAX_STRING_LENGTH;
     }
     startTracking() {
         try {
@@ -63,8 +71,8 @@ class ConsoleLogManager {
                         return;
                     inStack = true;
                     try {
-                        const payload = args.map((a) => this._safeStringify(a));
-                        const trace = this._getStackTrace();
+                        const payload = args.map((a) => (0, consoleLogsUtils_1._safeStringify)(a, this._maxKeys, this._maxDepth, this._maxStringLength));
+                        const trace = (0, consoleLogsUtils_1._getStackTrace)();
                         this._enqueueConsoleLog(level, payload, trace);
                     }
                     catch (err) {
@@ -95,26 +103,5 @@ class ConsoleLogManager {
         }
         return Math.random() < this._options.sampleRate;
     }
-    _safeStringify(val) {
-        try {
-            if (typeof val === 'string')
-                return val;
-            if (typeof val === 'object' && val !== null)
-                return JSON.stringify(val);
-            return String(val);
-        }
-        catch (_a) {
-            return '[Unserializable]';
-        }
-    }
-    _getStackTrace() {
-        var _a, _b;
-        try {
-            return (_b = (_a = new Error().stack) === null || _a === void 0 ? void 0 : _a.split('\n').slice(2)) !== null && _b !== void 0 ? _b : [];
-        }
-        catch (_c) {
-            return [];
-        }
-    }
 }
 exports.ConsoleLogManager = ConsoleLogManager;

package/src/EngagementManager.d.ts

@@ -6,6 +6,7 @@ export declare class EngagementManager {
     private _lastPageViewTime;
     private _inactiveTimer;
     private _onInactivityCallback;
+    private _meaningfulEngagementOccurred;
     constructor();
     private _initializeScrollTracking;
     private _handleScroll;
@@ -20,4 +21,6 @@ export declare class EngagementManager {
     setLastPageViewTime(time: number): void;
     startInactivityTracking(callback: () => void): void;
     bumpInactiveTimer(): void;
+    setMeaningfulEngagementOccurred(occurred: boolean): void;
+    getPageViewEndMetadata(): Record<string, unknown>;
 }

package/src/EngagementManager.js

@@ -12,6 +12,7 @@ class EngagementManager {
         this._lastPageViewTime = Date.now();
         this._inactiveTimer = null;
         this._onInactivityCallback = null;
+        this._meaningfulEngagementOccurred = false;
         this._initializeScrollTracking();
     }
     _initializeScrollTracking() {
@@ -69,5 +70,13 @@ class EngagementManager {
             }
         }, PAGE_INACTIVE_TIMEOUT);
     }
+    setMeaningfulEngagementOccurred(occurred) {
+        this._meaningfulEngagementOccurred = occurred;
+    }
+    getPageViewEndMetadata() {
+        const pageviewEndMetadata = Object.assign(Object.assign({}, this.getScrollMetrics()), { pageViewLength: this.getPageViewLength(), meaningfulEngagementOccurred: this._meaningfulEngagementOccurred });
+        this.setMeaningfulEngagementOccurred(false);
+        return pageviewEndMetadata;
+    }
 }
 exports.EngagementManager = EngagementManager;

package/src/utils/commonUtils.js

@@ -59,7 +59,14 @@ function _shouldLogEvent(e, el, isCopyEvent = false) {
             return ['change', 'click'].indexOf(eventType) >= 0;
         default:
             if (eventType === 'click') {
-                if (tagName === 'button') {
+                const compStyles = window.getComputedStyle(el);
+                if (compStyles && compStyles.getPropertyValue('cursor') === 'pointer') {
+                    return true;
+                }
+                if (exports.interactiveElements.includes(tagName)) {
+                    return true;
+                }
+                if (el.getAttribute('contenteditable') === 'true') {
                     return true;
                 }
                 const anchor = _getAnchorNodeInHierarchy(el);

package/src/utils/consoleLogsUtils.d.ts

@@ -0,0 +1,2 @@
+export declare function _safeStringify(val: unknown, maxKeysCount: number, maxDepth: number, maxLength: number): string;
+export declare function _getStackTrace(): string[];

package/src/utils/consoleLogsUtils.js

@@ -0,0 +1,66 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports._getStackTrace = exports._safeStringify = void 0;
+function _truncateString(str, maxLength) {
+    if (str.length <= maxLength) {
+        return str;
+    }
+    return str.slice(0, maxLength) + '...';
+}
+function _safeStringify(val, maxKeysCount, maxDepth, maxLength) {
+    try {
+        if (_shouldNotStringify(val, maxKeysCount, maxDepth)) {
+            return _simpleStringify(val, maxLength);
+        }
+        if (typeof val === 'string') {
+            return _truncateString(val, maxLength);
+        }
+        if (typeof val === 'object' && val !== null) {
+            return _truncateString(JSON.stringify(val), maxLength);
+        }
+        return _truncateString(String(val), maxLength);
+    }
+    catch (_a) {
+        return _truncateString('[Unserializable]', maxLength);
+    }
+}
+exports._safeStringify = _safeStringify;
+function _getStackTrace() {
+    var _a, _b;
+    try {
+        return (_b = (_a = new Error().stack) === null || _a === void 0 ? void 0 : _a.split('\n').slice(2)) !== null && _b !== void 0 ? _b : [];
+    }
+    catch (_c) {
+        return [];
+    }
+}
+exports._getStackTrace = _getStackTrace;
+function _shouldNotStringify(val, maxKeysCount, maxDepth) {
+    if (_isPlainObject(val)) {
+        if (Object.keys(val).length > maxKeysCount) {
+            return true;
+        }
+        if (_isObjectTooDeep(val, maxDepth)) {
+            return true;
+        }
+    }
+    if (typeof val === 'function') {
+        return true;
+    }
+    return false;
+}
+function _isPlainObject(obj) {
+    return Object.prototype.toString.call(obj) === '[object Object]';
+}
+function _isObjectTooDeep(obj, maxDepth) {
+    if (maxDepth <= 0) {
+        return true;
+    }
+    if (typeof obj !== 'object' || obj === null) {
+        return false;
+    }
+    return Object.keys(obj).some((key) => _isObjectTooDeep(obj[key], maxDepth - 1));
+}
+function _simpleStringify(val, maxLength) {
+    return _truncateString(val.toString(), maxLength);
+}

package/src/utils/eventUtils.d.ts

@@ -1,5 +1,5 @@
 export declare function _gatherEventData(target: Element): {
-    value: string | null;
+    value: string;
     metadata: Record<string, unknown>;
 };
 export declare function _gatherCopyEventData(e: Event): Record<string, unknown>;

package/src/utils/eventUtils.js

@@ -7,12 +7,13 @@ const MAX_ATTRIBUTE_LENGTH = 1000;
 const MAX_CLASS_LIST_LENGTH = 100;
 const MAX_SELECTOR_DEPTH = 50;
 function _gatherEventData(target) {
+    const value = (0, commonUtils_1._getSanitizedPageUrl)() || '';
+    const tagName = target.tagName.toLowerCase();
+    // If the element is sensitive, we only gather safe attribute fields
     if (_isSensitiveElement(target)) {
-        return { value: null, metadata: {} };
+        return { value, metadata: _getSafeMetadataAttributes(target) };
     }
-    const tagName = target.tagName.toLowerCase();
     const metadata = {};
-    const value = (0, commonUtils_1._getSanitizedPageUrl)() || '';
     metadata['tagName'] = tagName;
     const elementMetadata = _getMetadataFromElement(target);
     Object.assign(metadata, elementMetadata);
@@ -29,6 +30,9 @@ function _gatherEventData(target) {
     if (tagName === 'button' || anchor) {
         Object.assign(metadata, _getButtonMetadata(anchor || target));
     }
+    if (_isOutboundLink(metadata)) {
+        metadata['isOutbound'] = 'true';
+    }
     return { value, metadata };
 }
 exports._gatherEventData = _gatherEventData;
@@ -95,14 +99,35 @@ function _truncateString(str, maxLength) {
         return null;
     return str.length > maxLength ? str.substring(0, maxLength) + '...' : str;
 }
+function _isOutboundLink(metadata) {
+    var _a;
+    if (Array.isArray(metadata['classList']) &&
+        ((_a = metadata['classList']) === null || _a === void 0 ? void 0 : _a.includes('statsig-ctr-capture'))) {
+        return true;
+    }
+    const href = metadata['href'];
+    if (href) {
+        const currentUrl = (0, commonUtils_1._getSafeUrl)();
+        const linkUrl = new URL(href);
+        return currentUrl.host !== linkUrl.host;
+    }
+    return false;
+}
+function _getSafeMetadataAttributes(elem) {
+    const metadata = {};
+    metadata['class'] = _normalizeClassAttribute(_truncateString(elem.getAttribute('class'), MAX_ATTRIBUTE_LENGTH) || '');
+    metadata['id'] = _truncateString(elem.getAttribute('id'), MAX_ATTRIBUTE_LENGTH);
+    metadata['ariaLabel'] = _truncateString(elem.getAttribute('aria-label'), MAX_ATTRIBUTE_LENGTH);
+    metadata['name'] = _truncateString(elem.getAttribute('name'), MAX_ATTRIBUTE_LENGTH);
+    return metadata;
+}
 function _getMetadataFromElement(target) {
     const metadata = {};
+    const safeAttributes = _getSafeMetadataAttributes(target);
+    Object.assign(metadata, safeAttributes);
     const classList = Array.from(target.classList);
     metadata['classList'] =
         classList.length > 0 ? classList.slice(0, MAX_CLASS_LIST_LENGTH) : null;
-    metadata['class'] = _normalizeClassAttribute(_truncateString(target.getAttribute('class'), MAX_ATTRIBUTE_LENGTH) || '');
-    metadata['id'] = _truncateString(target.getAttribute('id'), MAX_ATTRIBUTE_LENGTH);
-    metadata['ariaLabel'] = _truncateString(target.getAttribute('aria-label'), MAX_ATTRIBUTE_LENGTH);
     metadata['selector'] = _generateCssSelector(target);
     return metadata;
 }