@brainfish-ai/web-tracker 0.0.28 → 0.0.30

package/dist/tracker.es.js

@@ -3574,7 +3574,7 @@ const _TrackerSdk = class _TrackerSdk {
       delete this.eventListeners[event];
     }
   }
-  async send(payload, responseCallback) {
+  async send(payload) {
     if (this.options.disabled) {
       return Promise.resolve();
     }
@@ -3588,7 +3588,7 @@ const _TrackerSdk = class _TrackerSdk {
       this.queue.push(payload);
       return Promise.resolve();
     }
-    return this.client.send("t", payload, responseCallback);
+    return this.client.send("t", payload);
   }
   setGlobalProperties(properties) {
     this.global = {
@@ -3663,6 +3663,18 @@ const _TrackerSdk = class _TrackerSdk {
       });
     }
   }
+  async getSessionId() {
+    if (this.options.disabled) {
+      return Promise.resolve(null);
+    }
+    if (this.trackingDisabled) {
+      return Promise.resolve(null);
+    }
+    const response = await this.httpClient.send("/sid", {
+      userId: this.userId
+    });
+    return response?.sessionId || null;
+  }
   async record(events) {
     if (this.options.disabled) {
       return Promise.resolve(null);
@@ -24456,6 +24468,212 @@ class Stasher {
     });
   }
 }
+const USER_ACTIONS = [
+  IncrementalSource.MouseMove,
+  IncrementalSource.MouseInteraction,
+  IncrementalSource.Scroll,
+  IncrementalSource.ViewportResize,
+  IncrementalSource.Input,
+  IncrementalSource.TouchMove,
+  IncrementalSource.MediaInteraction,
+  IncrementalSource.Drag
+];
+class RecordingManager {
+  constructor(agent) {
+    __publicField(this, "agent");
+    __publicField(this, "recorder");
+    __publicField(this, "stasher");
+    this.agent = agent;
+    this.recorder = new Recorder(this.handleEvent.bind(this));
+    this.stasher = new Stasher(this);
+  }
+  start() {
+    this.recorder.start();
+  }
+  handleEvent(event) {
+    const url2 = new URL(window.location.href);
+    const cleanUrl = url2.origin + url2.pathname;
+    if (this.agent.sessionManager.isIdle) {
+      if (this.isInteractiveEvent(event)) {
+        this.agent.handleActivityDuringIdle();
+      } else {
+        return;
+      }
+    }
+    if (this.isClick(event)) {
+      let clickedNode = record.mirror.getNode(event.data.id);
+      if (clickedNode && this.nodeIsInteresting(clickedNode)) {
+        event["conversionData"] = {};
+        event.conversionData.eventType = "click";
+        event.conversionData.textContent = clickedNode.textContent;
+        event.conversionData.htmlElement = clickedNode.nodeName?.toLowerCase();
+        event.conversionData.location = cleanUrl;
+      }
+    }
+    if (this.isCustom(event)) {
+      event["conversionData"] = {};
+      event.conversionData.eventType = "custom";
+      event.conversionData.customEventType = event.data.tag;
+      event.conversionData.location = cleanUrl;
+    }
+    if (this.stasher.isRunning) {
+      this.stasher.handle(event);
+      return;
+    }
+    this.publishEvent(event);
+  }
+  publishEvent(event) {
+    this.agent.sender.handle(event);
+    if (this.agent.timer) {
+      this.agent.timer.restart();
+    }
+  }
+  startRecorderWithStasher() {
+    this.stasher.start();
+    this.recorder = new Recorder(this.handleEvent.bind(this));
+    this.recorder.start();
+  }
+  isClick(event) {
+    return event.type === EventType.IncrementalSnapshot && // incremental snapshot event
+    event.data.source === IncrementalSource.MouseInteraction && // source of incremental snapshot is a mouse action
+    event.data.type === MouseInteractions.Click;
+  }
+  nodeIsInteresting(clickedNode) {
+    return clickedNode.nodeName === "BUTTON" || clickedNode.nodeName === "ANCHOR";
+  }
+  isCustom(event) {
+    return event.type === EventType.Custom;
+  }
+  isInteractiveEvent(event) {
+    return event.type === EventType.IncrementalSnapshot && USER_ACTIONS.includes(event.data?.source);
+  }
+}
+class Timer {
+  constructor(agent, MAX_IDLE_TIME2) {
+    __publicField(this, "agent");
+    __publicField(this, "MAX_IDLE_TIME");
+    __publicField(this, "timeoutId");
+    this.agent = agent;
+    this.MAX_IDLE_TIME = MAX_IDLE_TIME2;
+    this.timeoutId = 0;
+  }
+  restart() {
+    this.stop();
+    this.start();
+  }
+  stop() {
+    clearTimeout(this.timeoutId);
+  }
+  start() {
+    this.timeoutId = window.setTimeout(
+      this.agent.handleTimeout.bind(this.agent),
+      this.MAX_IDLE_TIME
+    );
+  }
+}
+const _SessionManager = class _SessionManager {
+  constructor() {
+    __publicField(this, "sessionId", null);
+    __publicField(this, "lastScreenViewEventTime", 0);
+    __publicField(this, "isIdle", false);
+  }
+  static getInstance() {
+    if (!_SessionManager.instance) {
+      _SessionManager.instance = new _SessionManager();
+    }
+    return _SessionManager.instance;
+  }
+  /**
+   * Determines the current session state based on previous and current session IDs
+   */
+  determineSessionState(newSessionId) {
+    if (!this.sessionId && newSessionId) {
+      return "new";
+    }
+    if (this.sessionId && newSessionId && this.sessionId !== newSessionId) {
+      return "changed";
+    }
+    if (this.sessionId === newSessionId && this.sessionId !== null) {
+      return "active";
+    }
+    return "expired";
+  }
+  /**
+   * Handles session state transitions and triggers appropriate actions
+   */
+  handleSessionTransition(state, callbacks) {
+    switch (state) {
+      case "new":
+      case "changed":
+        this.updateIdleStatus(false);
+        callbacks.takeFullSnapshot?.();
+        break;
+    }
+  }
+  /**
+   * Updates the session state based on a new session ID
+   * @param newSessionId The new session ID from the server
+   * @param callbacks Optional callbacks for session state changes
+   */
+  updateSession(newSessionId, callbacks = {}) {
+    const sessionState = this.determineSessionState(newSessionId);
+    this.handleSessionTransition(sessionState, callbacks);
+    this.sessionId = newSessionId;
+  }
+  updateLastScreenViewEventTime() {
+    this.lastScreenViewEventTime = Date.now();
+  }
+  updateIdleStatus(isIdle) {
+    this.isIdle = isIdle;
+  }
+  getLastScreenViewEventTime() {
+    return this.lastScreenViewEventTime;
+  }
+  getCurrentSessionId() {
+    return this.sessionId;
+  }
+};
+__publicField(_SessionManager, "instance");
+let SessionManager = _SessionManager;
+class UrlMonitor {
+  constructor(callback) {
+    __publicField(this, "currentUrl");
+    __publicField(this, "callback");
+    __publicField(this, "originalPushState");
+    __publicField(this, "originalReplaceState");
+    __publicField(this, "handlePopState", () => {
+      this.checkUrlChange();
+    });
+    this.currentUrl = window.location.href;
+    this.callback = callback;
+    this.originalPushState = history.pushState;
+    this.originalReplaceState = history.replaceState;
+    this.setupListeners();
+  }
+  setupListeners() {
+    window.addEventListener("popstate", this.handlePopState);
+    history.pushState = (...args) => {
+      this.originalPushState.apply(history, args);
+      this.checkUrlChange();
+    };
+    history.replaceState = (...args) => {
+      this.originalReplaceState.apply(history, args);
+      this.checkUrlChange();
+    };
+  }
+  checkUrlChange() {
+    const newUrl = window.location.href;
+    if (newUrl !== this.currentUrl) {
+      this.currentUrl = newUrl;
+      this.callback();
+    }
+  }
+  destroy() {
+    history.pushState = this.originalPushState;
+    history.replaceState = this.originalReplaceState;
+    window.removeEventListener("popstate", this.handlePopState);
+  }
+}
 function lexer(str) {
   var tokens = [];
   var i = 0;
@@ -24795,181 +25013,9 @@ function canDiscover(recordingBlocklist, allowLocalhostRecording) {
   }
   return true;
 }
-const USER_ACTIONS = [
-  IncrementalSource.MouseMove,
-  IncrementalSource.MouseInteraction,
-  IncrementalSource.Scroll,
-  IncrementalSource.ViewportResize,
-  IncrementalSource.Input,
-  IncrementalSource.TouchMove,
-  IncrementalSource.MediaInteraction,
-  IncrementalSource.Drag
-];
-class RecordingManager {
-  constructor(agent) {
-    __publicField(this, "agent");
-    __publicField(this, "recorder");
-    __publicField(this, "stasher");
-    this.agent = agent;
-    this.recorder = new Recorder(this.handleEvent.bind(this));
-    this.stasher = new Stasher(this);
-  }
-  start() {
-    this.recorder.start();
-  }
-  handleEvent(event) {
-    const url2 = new URL(window.location.href);
-    const cleanUrl = url2.origin + url2.pathname;
-    if (!canDiscover(
-      this.agent.recordingBlocklist,
-      this.agent._allowLocalhostRecording
-    )) {
-      return;
-    }
-    if (this.agent.sessionManager.isIdle) {
-      if (this.isInteractiveEvent(event)) {
-        this.agent.handleActivityDuringIdle();
-      } else {
-        return;
-      }
-    }
-    if (this.isClick(event)) {
-      let clickedNode = record.mirror.getNode(event.data.id);
-      if (clickedNode && this.nodeIsInteresting(clickedNode)) {
-        event["conversionData"] = {};
-        event.conversionData.eventType = "click";
-        event.conversionData.textContent = clickedNode.textContent;
-        event.conversionData.htmlElement = clickedNode.nodeName?.toLowerCase();
-        event.conversionData.location = cleanUrl;
-      }
-    }
-    if (this.isCustom(event)) {
-      event["conversionData"] = {};
-      event.conversionData.eventType = "custom";
-      event.conversionData.customEventType = event.data.tag;
-      event.conversionData.location = cleanUrl;
-    }
-    if (this.stasher.isRunning) {
-      this.stasher.handle(event);
-      return;
-    }
-    this.publishEvent(event);
-  }
-  publishEvent(event) {
-    this.agent.sender.handle(event);
-    if (this.agent.timer) {
-      this.agent.timer.restart();
-    }
-  }
-  startRecorderWithStasher() {
-    this.stasher.start();
-    this.recorder = new Recorder(this.handleEvent.bind(this));
-    this.recorder.start();
-  }
-  isClick(event) {
-    return event.type === EventType.IncrementalSnapshot && // incremental snapshot event
-    event.data.source === IncrementalSource.MouseInteraction && // source of incremental snapshot is a mouse action
-    event.data.type === MouseInteractions.Click;
-  }
-  nodeIsInteresting(clickedNode) {
-    return clickedNode.nodeName === "BUTTON" || clickedNode.nodeName === "ANCHOR";
-  }
-  isCustom(event) {
-    return event.type === EventType.Custom;
-  }
-  isInteractiveEvent(event) {
-    return event.type === EventType.IncrementalSnapshot && USER_ACTIONS.includes(event.data?.source);
-  }
-}
-class Timer {
-  constructor(agent, MAX_IDLE_TIME2) {
-    __publicField(this, "agent");
-    __publicField(this, "MAX_IDLE_TIME");
-    __publicField(this, "timeoutId");
-    this.agent = agent;
-    this.MAX_IDLE_TIME = MAX_IDLE_TIME2;
-    this.timeoutId = 0;
-  }
-  restart() {
-    this.stop();
-    this.start();
-  }
-  stop() {
-    clearTimeout(this.timeoutId);
-  }
-  start() {
-    this.timeoutId = window.setTimeout(
-      this.agent.handleTimeout.bind(this.agent),
-      this.MAX_IDLE_TIME
-    );
-  }
-}
-const _SessionManager = class _SessionManager {
-  constructor() {
-    __publicField(this, "sessionId", null);
-    __publicField(this, "lastScreenViewEventTime", 0);
-    __publicField(this, "isIdle", false);
-  }
-  static getInstance() {
-    if (!_SessionManager.instance) {
-      _SessionManager.instance = new _SessionManager();
-    }
-    return _SessionManager.instance;
-  }
-  /**
-   * Determines the current session state based on previous and current session IDs
-   */
-  determineSessionState(newSessionId) {
-    if (!this.sessionId && newSessionId) {
-      return "new";
-    }
-    if (this.sessionId && newSessionId && this.sessionId !== newSessionId) {
-      return "changed";
-    }
-    if (this.sessionId === newSessionId && this.sessionId !== null) {
-      return "active";
-    }
-    return "expired";
-  }
-  /**
-   * Handles session state transitions and triggers appropriate actions
-   */
-  handleSessionTransition(state, callbacks) {
-    switch (state) {
-      case "new":
-      case "changed":
-        this.updateIdleStatus(false);
-        callbacks.takeFullSnapshot?.();
-        break;
-    }
-  }
-  /**
-   * Updates the session state based on a new session ID
-   * @param newSessionId The new session ID from the server
-   * @param callbacks Optional callbacks for session state changes
-   */
-  updateSession(newSessionId, callbacks = {}) {
-    const sessionState = this.determineSessionState(newSessionId);
-    this.handleSessionTransition(sessionState, callbacks);
-    this.sessionId = newSessionId;
-  }
-  updateLastScreenViewEventTime() {
-    this.lastScreenViewEventTime = Date.now();
-  }
-  updateIdleStatus(isIdle) {
-    this.isIdle = isIdle;
-  }
-  getLastScreenViewEventTime() {
-    return this.lastScreenViewEventTime;
-  }
-  getCurrentSessionId() {
-    return this.sessionId;
-  }
-};
-__publicField(_SessionManager, "instance");
-let SessionManager = _SessionManager;
 const MAX_IDLE_TIME = 60 * 1e3;
 const SCREEN_VIEW_EVENT_COOLDOWN = 5 * 1e3;
+const RESUME_RECORDING_DEBOUNCE_MS = 3e3;
 const _Agent = class _Agent {
   constructor() {
     __publicField(this, "recordingManager");
@@ -24981,6 +25027,9 @@ const _Agent = class _Agent {
     __publicField(this, "recordingBlocklist", []);
     __publicField(this, "_allowLocalhostRecording");
     __publicField(this, "sessionCreationPromise", null);
+    __publicField(this, "urlMonitor");
+    __publicField(this, "isRecordingStopped", false);
+    __publicField(this, "resumeRecordingTimer");
     this.recordingManager = new RecordingManager(this);
     this.sender = new Sender(this);
   }
@@ -25000,7 +25049,61 @@ const _Agent = class _Agent {
     this.MAX_IDLE_TIME = MAX_IDLE_TIME;
     this.timer = new Timer(this, this.MAX_IDLE_TIME);
     this.sender.start();
-    this.recordingManager.start();
+    const shouldRecordInitialPage = canDiscover(
+      this.recordingBlocklist,
+      this._allowLocalhostRecording
+    );
+    if (shouldRecordInitialPage) {
+      this.recordingManager.start();
+      this.isRecordingStopped = false;
+    } else {
+      this.isRecordingStopped = true;
+    }
+    this.urlMonitor = new UrlMonitor(() => this.handleUrlChange());
+  }
+  handleUrlChange() {
+    const shouldRecord = canDiscover(
+      this.recordingBlocklist,
+      this._allowLocalhostRecording
+    );
+    if (!shouldRecord) {
+      if (this.resumeRecordingTimer) {
+        clearTimeout(this.resumeRecordingTimer);
+        this.resumeRecordingTimer = void 0;
+      }
+      if (!this.isRecordingStopped) {
+        this.stopRecording();
+      }
+    } else {
+      if (this.isRecordingStopped) {
+        if (this.resumeRecordingTimer) {
+          clearTimeout(this.resumeRecordingTimer);
+        }
+        this.resumeRecordingTimer = window.setTimeout(() => {
+          this.resumeRecording();
+          this.resumeRecordingTimer = void 0;
+        }, RESUME_RECORDING_DEBOUNCE_MS);
+      }
+    }
+  }
+  stopRecording() {
+    record.addCustomEvent("recording_stopped_blocklist", {
+      url: window.location.href,
+      timestamp: Date.now()
+    });
+    if (this.recordingManager.recorder.stop) {
+      this.recordingManager.recorder.stop();
+    }
+    this.sender.send();
+    this.isRecordingStopped = true;
+  }
+  resumeRecording() {
+    this.recordingManager.recorder.start();
+    record.addCustomEvent("recording_resumed_blocklist", {
+      url: window.location.href,
+      timestamp: Date.now()
+    });
+    this.isRecordingStopped = false;
   }
   handleTimeout() {
     if (this.recordingManager.recorder.stop) {
@@ -25044,16 +25147,45 @@ const _Agent = class _Agent {
       console.error("Failed to send screen_view event:", error);
     }
   }
+  stop() {
+    if (this.resumeRecordingTimer) {
+      clearTimeout(this.resumeRecordingTimer);
+      this.resumeRecordingTimer = void 0;
+    }
+    if (this.urlMonitor) {
+      this.urlMonitor.destroy();
+      this.urlMonitor = void 0;
+    }
+    if (!this.isRecordingStopped && this.recordingManager.recorder.stop) {
+      this.recordingManager.recorder.stop();
+    }
+    if (this.timer) {
+      this.timer.stop();
+    }
+  }
 };
 __publicField(_Agent, "_sessionManager", SessionManager.getInstance());
 let Agent = _Agent;
+const DEFAULT_SAMPLE_RATE = 5;
+function shouldSampleRecording(sampleRate, sessionId) {
+  if (sampleRate === void 0 || sampleRate === null || typeof sampleRate !== "number" || isNaN(sampleRate) || sampleRate < 0 || sampleRate > 100) {
+    sampleRate = DEFAULT_SAMPLE_RATE;
+  }
+  let hash = 0;
+  for (let i = 0; i < sessionId.length; i++) {
+    hash = (hash << 5) - hash + sessionId.charCodeAt(i);
+    hash = hash & hash;
+  }
+  const bucket = Math.abs(hash) % 100;
+  return bucket < sampleRate;
+}
 function toCamelCase(str) {
   return str.replace(
     /([-_][a-z])/gi,
     ($1) => $1.toUpperCase().replace("-", "").replace("_", "")
   );
 }
-const VERSION = "0.0.28";
+const VERSION = "0.0.30";
 class Tracker extends TrackerSdk {
   constructor(options) {
     super({
@@ -25067,9 +25199,10 @@ class Tracker extends TrackerSdk {
     __publicField(this, "sessionManager", SessionManager.getInstance());
     __publicField(this, "recordingBlocklist", []);
     __publicField(this, "isRecordingActive", false);
+    __publicField(this, "onFirstScreenViewTracked", null);
     this.options = options;
     this.agent = new Agent();
-    this.recordingBlocklist = options.recordingBlocklist || [];
+    this.recordingBlocklist = options.recordingOptions?.blocklist ?? options.recordingBlocklist ?? [];
     if (!this.isServer()) {
       this.setGlobalProperties({
         __referrer: document.referrer
@@ -25078,17 +25211,17 @@ class Tracker extends TrackerSdk {
       if (this.options.trackOutgoingLinks && !trackingDisabled) {
         this.trackOutgoingLinks();
       }
+      if (this.options.enableRecording && !trackingDisabled) {
+        this.onFirstScreenViewTracked = () => {
+          this.initializeRecordingWithSessionId();
+        };
+      }
       if (this.options.trackScreenViews) {
         this.trackScreenViews();
       }
       if (this.options.trackAttributes && !trackingDisabled) {
         this.trackAttributes();
       }
-      if (this.options.enableRecording && !trackingDisabled) {
-        this.startRecording();
-        this.isRecordingActive = true;
-        console.log("Brainfish has started ambient learning");
-      }
     }
   }
   debounce(func, delay) {
@@ -25176,7 +25309,7 @@ class Tracker extends TrackerSdk {
       sendEvents: this.recordEventsToServer.bind(this),
       sendScreenViewEvent: this.sendScreenViewEvent.bind(this),
       recordingBlocklist: this.recordingBlocklist,
-      _allowLocalhostRecording: this.options._allowLocalhostRecording
+      _allowLocalhostRecording: this.options.recordingOptions?._allowLocalhostRecording ?? this.options._allowLocalhostRecording
     });
   }
   async screenView(pathOrProperties, propertiesOrUndefined) {
@@ -25216,21 +25349,45 @@ class Tracker extends TrackerSdk {
       }
     });
   }
+  async initializeRecordingWithSessionId() {
+    try {
+      const sessionId = await super.getSessionId();
+      if (this.isTrackingDisabled()) {
+        return;
+      }
+      if (!sessionId) {
+        console.warn("No sid found");
+        return;
+      }
+      if (shouldSampleRecording(
+        this.options.recordingOptions?.sampleRate,
+        sessionId
+      )) {
+        this.startRecording();
+        this.isRecordingActive = true;
+        console.log("Brainfish has started ambient learning");
+      }
+    } catch (error) {
+      console.warn("Error initializing ambient learning:", error);
+    }
+  }
   sendScreenViewEvent(props) {
-    super.track("screen_view", props);
     this.sessionManager.updateLastScreenViewEventTime();
+    super.track("screen_view", props);
+    if (this.onFirstScreenViewTracked) {
+      this.onFirstScreenViewTracked();
+      this.onFirstScreenViewTracked = null;
+    }
   }
   /**
    * Disables privacy-sensitive tracking features and stops active recording.
    */
   disableTracking() {
     super.disableTracking();
+    console.log("Brainfish has stopped ambient learning");
     if (this.isRecordingActive) {
-      if (this.agent.recordingManager.recorder.stop) {
-        this.agent.recordingManager.recorder.stop();
-      }
+      this.agent.stop();
       this.isRecordingActive = false;
-      console.log("Brainfish has stopped ambient learning");
     }
   }
   /**
@@ -25239,6 +25396,7 @@ class Tracker extends TrackerSdk {
    */
   enableTracking() {
     super.enableTracking();
+    console.log("Brainfish has started ambient learning");
   }
 }
 ((window2) => {