posthog-js 1.15.4 → 1.16.3

package/dist/es.js

@@ -863,9 +863,9 @@ var LZString = {
   }
 };
 
-var version = "1.15.4";
+var version = "1.16.3";
 
-var Config = {
+var Config$1 = {
   DEBUG: false,
   LIB_VERSION: version
 };
@@ -903,7 +903,7 @@ var _ = {
 var console$1 = {
   /** @type {function(...*)} */
   log: function log() {
-    if (Config.DEBUG && !_.isUndefined(window.console) && window.console) {
+    if (Config$1.DEBUG && !_.isUndefined(window.console) && window.console) {
       try {
         window.console.log.apply(window.console, arguments);
       } catch (err) {
@@ -916,7 +916,7 @@ var console$1 = {
 
   /** @type {function(...*)} */
   error: function error() {
-    if (Config.DEBUG && !_.isUndefined(window.console) && window.console) {
+    if (Config$1.DEBUG && !_.isUndefined(window.console) && window.console) {
       var args = ['PostHog error:'].concat(Array.prototype.slice.call(arguments));
 
       try {
@@ -1140,7 +1140,7 @@ _.safewrap = function (f) {
     } catch (e) {
       console$1.critical('Implementation error. Please turn on debug and contact support@posthog.com.');
 
-      if (Config.DEBUG) {
+      if (Config$1.DEBUG) {
         console$1.critical(e);
       }
     }
@@ -1734,7 +1734,7 @@ _.info = {
       $viewport_height: window.innerHeight,
       $viewport_width: window.innerWidth,
       $lib: 'web',
-      $lib_version: Config.LIB_VERSION,
+      $lib_version: Config$1.LIB_VERSION,
       $insert_id: Math.random().toString(36).substring(2, 10) + Math.random().toString(36).substring(2, 10),
       $time: _.timestamp() / 1000 // epoch time in seconds
 
@@ -2006,16 +2006,16 @@ function shouldCaptureValue(value) {
   return true;
 }
 /*
- * Check whether an attribute name is an Angular content attr
+ * Check whether an attribute name is an Angular style attr (either _ngcontent or _nghost)
  * These update on each build and lead to noise in the element chain
- * https://stackoverflow.com/questions/45082129/what-does-ngcontent-c-mean-in-angular
+ * More details on the attributes here: https://angular.io/guide/view-encapsulation
  * @param {string} attributeName - string value to check
  * @returns {boolean} whether the element is an angular tag
  */
 
-function isAngularContentAttr(attributeName) {
+function isAngularStyleAttr(attributeName) {
   if (typeof attributeName === 'string') {
-    return attributeName.substring(0, 10) === '_ngcontent';
+    return attributeName.substring(0, 10) === '_ngcontent' || attributeName.substring(0, 7) === '_nghost';
   }
 
   return false;
@@ -2116,7 +2116,7 @@ var autocapture = {
       // Only capture attributes we know are safe
       if (isSensitiveElement(elem) && ['name', 'id', 'class'].indexOf(attr.name) === -1) return;
 
-      if (!maskInputs && shouldCaptureValue(attr.value) && !isAngularContentAttr(attr.name)) {
+      if (!maskInputs && shouldCaptureValue(attr.value) && !isAngularStyleAttr(attr.name)) {
         props['attr__' + attr.name] = attr.value;
       }
     });
@@ -2537,6 +2537,73 @@ var memoryStore = {
   remove: function remove(name) {
     delete memoryStorage[name];
   }
+}; // Storage that only lasts the length of a tab/window. Survives page refreshes
+
+var sessionStore = {
+  sessionStorageSupported: null,
+  is_supported: function is_supported() {
+    if (sessionStore.sessionStorageSupported !== null) {
+      return sessionStore.sessionStorageSupported;
+    }
+
+    sessionStore.sessionStorageSupported = true;
+
+    if (window) {
+      try {
+        var key = '__support__',
+            val = 'xyz';
+        sessionStore.set(key, val);
+
+        if (sessionStore.get(key) !== '"xyz"') {
+          sessionStore.sessionStorageSupported = false;
+        }
+
+        sessionStore.remove(key);
+      } catch (err) {
+        sessionStore.sessionStorageSupported = false;
+      }
+    } else {
+      sessionStore.sessionStorageSupported = false;
+    }
+
+    return sessionStore.sessionStorageSupported;
+  },
+  error: function error(msg) {
+    if (Config.DEBUG) {
+      console$1.error('sessionStorage error: ', msg);
+    }
+  },
+  get: function get(name) {
+    try {
+      return window.sessionStorage.getItem(name);
+    } catch (err) {
+      sessionStore.error(err);
+    }
+
+    return null;
+  },
+  parse: function parse(name) {
+    try {
+      return JSON.parse(sessionStore.get(name)) || null;
+    } catch (err) {// noop
+    }
+
+    return null;
+  },
+  set: function set(name, value) {
+    try {
+      window.sessionStorage.setItem(name, JSON.stringify(value));
+    } catch (err) {
+      sessionStore.error(err);
+    }
+  },
+  remove: function remove(name) {
+    try {
+      window.sessionStorage.removeItem(name);
+    } catch (err) {
+      sessionStore.error(err);
+    }
+  }
 };
 
 /**
@@ -3512,28 +3579,6 @@ PostHogPersistence.prototype.remove_event_timer = function (event_name) {
   return timestamp;
 };
 
-var SESSION_CHANGE_THRESHOLD = 30 * 60 * 1000; // 30 mins
-
-var sessionIdGenerator = (function (persistence, timestamp) {
-  var _ref = persistence['props'][SESSION_ID] || [0, null],
-      _ref2 = _slicedToArray(_ref, 2),
-      lastTimestamp = _ref2[0],
-      sessionId = _ref2[1];
-
-  var isNewSessionId = false;
-
-  if (Math.abs(timestamp - lastTimestamp) > SESSION_CHANGE_THRESHOLD) {
-    sessionId = _.UUID();
-    isNewSessionId = true;
-  }
-
-  persistence.register(_defineProperty({}, SESSION_ID, [timestamp, sessionId]));
-  return {
-    isNewSessionId: isNewSessionId,
-    sessionId: sessionId
-  };
-});
-
 var replacementImageURI = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJibGFjayIvPgo8cGF0aCBkPSJNOCAwSDE2TDAgMTZWOEw4IDBaIiBmaWxsPSIjMkQyRDJEIi8+CjxwYXRoIGQ9Ik0xNiA4VjE2SDhMMTYgOFoiIGZpbGw9IiMyRDJEMkQiLz4KPC9zdmc+Cg==';
 /*
  * Check whether a data payload is nearing 5mb. If it is, it checks the data for
@@ -3585,6 +3630,10 @@ function filterDataURLsFromLargeDataObjects(data) {
 }
 
 var BASE_ENDPOINT = '/e/';
+var FULL_SNAPSHOT_EVENT_TYPE = 2;
+var META_EVENT_TYPE = 4;
+var INCREMENTAL_SNAPSHOT_EVENT_TYPE = 3;
+var MUTATION_SOURCE_TYPE = 3;
 var SessionRecording = /*#__PURE__*/function () {
   function SessionRecording(instance) {
     _classCallCheck(this, SessionRecording);
@@ -3595,6 +3644,8 @@ var SessionRecording = /*#__PURE__*/function () {
     this.emit = false;
     this.endpoint = BASE_ENDPOINT;
     this.stopRrweb = null;
+    this.windowId = null;
+    this.sessionId = null;
   }
 
   _createClass(SessionRecording, [{
@@ -3664,9 +3715,24 @@ var SessionRecording = /*#__PURE__*/function () {
 
       if (!this.captureStarted && !this.instance.get_config('disable_session_recording')) {
         this.captureStarted = true;
-        loadScript(this.instance.get_config('api_host') + '/static/recorder.js?v=' + Config.LIB_VERSION, _.bind(this._onScriptLoaded, this));
+        loadScript(this.instance.get_config('api_host') + '/static/recorder.js?v=' + Config$1.LIB_VERSION, _.bind(this._onScriptLoaded, this));
       }
     }
+  }, {
+    key: "_updateWindowAndSessionIds",
+    value: function _updateWindowAndSessionIds(event) {
+      var _this$instance$_sessi = this.instance._sessionIdManager.getSessionAndWindowId(event.timestamp || new Date().getTime(), event),
+          windowId = _this$instance$_sessi.windowId,
+          sessionId = _this$instance$_sessi.sessionId; // Event types FullSnapshot and Meta mean we're already in the process of sending a full snapshot
+
+
+      if ((this.windowId !== windowId || this.sessionId !== sessionId) && [FULL_SNAPSHOT_EVENT_TYPE, META_EVENT_TYPE].indexOf(event.type) === -1) {
+        window.rrweb.record.takeFullSnapshot();
+      }
+
+      this.windowId = windowId;
+      this.sessionId = sessionId;
+    }
   }, {
     key: "_onScriptLoaded",
     value: function _onScriptLoaded() {
@@ -3699,23 +3765,20 @@ var SessionRecording = /*#__PURE__*/function () {
       }
 
       this.stopRrweb = window.rrweb.record(_objectSpread2({
-        emit: function emit(data) {
-          data = filterDataURLsFromLargeDataObjects(data);
-          var sessionIdObject = sessionIdGenerator(_this2.instance.persistence, data.timestamp); // Data type 2 and 4 are FullSnapshot and Meta and they mean we're already
-          // in the process of sending a full snapshot
+        emit: function emit(event) {
+          event = filterDataURLsFromLargeDataObjects(event);
 
-          if (sessionIdObject.isNewSessionId && [2, 4].indexOf(data.type) === -1) {
-            window.rrweb.record.takeFullSnapshot();
-          }
+          _this2._updateWindowAndSessionIds(event);
 
           var properties = {
-            $snapshot_data: data,
-            $session_id: sessionIdObject.sessionId
+            $snapshot_data: event,
+            $session_id: _this2.sessionId,
+            $window_id: _this2.windowId
           };
 
           _this2.instance._captureMetrics.incr('rrweb-record');
 
-          _this2.instance._captureMetrics.incr("rrweb-record-".concat(data.type));
+          _this2.instance._captureMetrics.incr("rrweb-record-".concat(event.type));
 
           if (_this2.emit) {
             _this2._captureSnapshot(properties);
@@ -3746,7 +3809,7 @@ var SessionRecording = /*#__PURE__*/function () {
         _noTruncate: true,
         _batchKey: 'sessionRecording',
         _metrics: {
-          rrweb_full_snapshot: properties.$snapshot_data.type === 2
+          rrweb_full_snapshot: properties.$snapshot_data.type === FULL_SNAPSHOT_EVENT_TYPE
         }
       });
     }
@@ -5316,6 +5379,112 @@ var RetryQueue = /*#__PURE__*/function (_RequestQueueScaffold) {
   return RetryQueue;
 }(RequestQueueScaffold);
 
+var SESSION_CHANGE_THRESHOLD = 30 * 60 * 1000; // 30 mins
+
+var SessionIdManager = /*#__PURE__*/function () {
+  function SessionIdManager(config, persistence) {
+    _classCallCheck(this, SessionIdManager);
+
+    this.persistence = persistence;
+
+    if (config['persistence_name']) {
+      this.window_id_storage_key = 'ph_' + config['persistence_name'] + '_window_id';
+    } else {
+      this.window_id_storage_key = 'ph_' + config['token'] + '_window_id';
+    }
+  } // Note: this tries to store the windowId in sessionStorage. SessionStorage is unique to the current window/tab,
+  // and persists page loads/reloads. So it's uniquely suited for storing the windowId. This function also respects
+  // when persistence is disabled (by user config) and when sessionStorage is not supported (it *should* be supported on all browsers),
+  // and in that case, it falls back to memory (which sadly, won't persist page loads)
+
+
+  _createClass(SessionIdManager, [{
+    key: "_setWindowId",
+    value: function _setWindowId(windowId) {
+      if (windowId !== this.windowId) {
+        this.windowId = windowId;
+
+        if (!this.persistence.disabled && sessionStore.is_supported()) {
+          sessionStore.set(this.window_id_storage_key, windowId);
+        }
+      }
+    }
+  }, {
+    key: "_getWindowId",
+    value: function _getWindowId() {
+      if (this.windowId) {
+        return this.windowId;
+      }
+
+      if (!this.persistence.disabled && sessionStore.is_supported()) {
+        return sessionStore.parse(this.window_id_storage_key);
+      }
+
+      return null;
+    } // Note: 'this.persistence.register' can be disabled in the config.
+    // In that case, this works by storing sessionId and the timestamp in memory.
+
+  }, {
+    key: "_setSessionId",
+    value: function _setSessionId(sessionId, timestamp) {
+      if (sessionId !== this.sessionId || timestamp !== this.timestamp) {
+        this.timestamp = timestamp;
+        this.sessionId = sessionId;
+        this.persistence.register(_defineProperty({}, SESSION_ID, [timestamp, sessionId]));
+      }
+    }
+  }, {
+    key: "_getSessionId",
+    value: function _getSessionId() {
+      if (this.sessionId && this.timestamp) {
+        return [this.timestamp, this.sessionId];
+      }
+
+      return this.persistence['props'][SESSION_ID] || [0, null];
+    }
+  }, {
+    key: "getSessionAndWindowId",
+    value: function getSessionAndWindowId() {
+      var _recordingEvent$data;
+
+      var timestamp = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+      var recordingEvent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+      // Some recording events are triggered by non-user events (e.g. "X minutes ago" text updating on the screen).
+      // We don't want to update the session and window ids in these cases. These events are designated by event
+      // type -> incremental update, and source -> mutation.
+      var isUserInteraction = !(recordingEvent && recordingEvent.type === INCREMENTAL_SNAPSHOT_EVENT_TYPE && ((_recordingEvent$data = recordingEvent.data) === null || _recordingEvent$data === void 0 ? void 0 : _recordingEvent$data.source) === MUTATION_SOURCE_TYPE);
+      timestamp = timestamp || new Date().getTime();
+
+      var _this$_getSessionId = this._getSessionId(),
+          _this$_getSessionId2 = _slicedToArray(_this$_getSessionId, 2),
+          lastTimestamp = _this$_getSessionId2[0],
+          sessionId = _this$_getSessionId2[1];
+
+      var windowId = this._getWindowId();
+
+      if (!sessionId || isUserInteraction && Math.abs(timestamp - lastTimestamp) > SESSION_CHANGE_THRESHOLD) {
+        sessionId = _.UUID();
+        windowId = _.UUID();
+      } else if (!windowId) {
+        windowId = _.UUID();
+      }
+
+      var newTimestamp = lastTimestamp === 0 || isUserInteraction ? timestamp : lastTimestamp;
+
+      this._setWindowId(windowId);
+
+      this._setSessionId(sessionId, newTimestamp);
+
+      return {
+        sessionId: sessionId,
+        windowId: windowId
+      };
+    }
+  }]);
+
+  return SessionIdManager;
+}();
+
 /*
 SIMPLE STYLE GUIDE:
 
@@ -5479,7 +5648,7 @@ var create_mplib = function create_mplib(token, config, name) {
   // global debug to be true
 
 
-  Config.DEBUG = Config.DEBUG || instance.get_config('debug'); // if target is not defined, we called init after the lib already
+  Config$1.DEBUG = Config$1.DEBUG || instance.get_config('debug'); // if target is not defined, we called init after the lib already
   // loaded, so there won't be an array of things to execute
 
   if (!_.isUndefined(target) && _.isArray(target)) {
@@ -5556,6 +5725,7 @@ PostHogLib.prototype._init = function (token, config, name) {
   this.__captureHooks = [];
   this.__request_queue = [];
   this['persistence'] = new PostHogPersistence(this['config']);
+  this['_sessionIdManager'] = new SessionIdManager(this['config'], this['persistence']);
 
   this._gdpr_init();
 
@@ -5915,7 +6085,7 @@ PostHogLib.prototype.capture = addOptOutCheckPostHogLib(function (event_name, pr
     this.__compress_and_send_json_request(url, jsonData, options);
   }
 
-  this._invokeCaptureHooks(event_name);
+  this._invokeCaptureHooks(event_name, data);
 
   return data;
 });
@@ -5924,8 +6094,8 @@ PostHogLib.prototype._addCaptureHook = function (callback) {
   this.__captureHooks.push(callback);
 };
 
-PostHogLib.prototype._invokeCaptureHooks = function (eventName) {
-  this.config._onCapture(eventName);
+PostHogLib.prototype._invokeCaptureHooks = function (eventName, eventData) {
+  this.config._onCapture(eventName, eventData);
 
   _.each(this.__captureHooks, function (callback) {
     return callback(eventName);
@@ -5947,6 +6117,15 @@ PostHogLib.prototype._calculate_event_properties = function (event_name, event_p
   if (!_.isUndefined(start_timestamp)) {
     var duration_in_ms = new Date().getTime() - start_timestamp;
     properties['$duration'] = parseFloat((duration_in_ms / 1000).toFixed(3));
+  }
+
+  if (this._sessionIdManager) {
+    var _this$_sessionIdManag = this._sessionIdManager.getSessionAndWindowId(),
+        sessionId = _this$_sessionIdManag.sessionId,
+        windowId = _this$_sessionIdManag.windowId;
+
+    properties['$session_id'] = sessionId;
+    properties['$window_id'] = windowId;
   } // note: extend writes to the first object, so lets make sure we
   // don't write to the persistence properties object and info
   // properties object by passing in a new object
@@ -6185,12 +6364,20 @@ PostHogLib.prototype.identify = function (new_distinct_id, userPropertiesToSet,
   }
 
   this.reloadFeatureFlags();
-}; // Alpha feature, still under development, do not use!
-
+};
+/**
+ * Alpha feature: don't use unless you know what you're doing!
+ *
+ * Sets group analytics information for subsequent events.
+ *
+ * @param {String} groupType Group type (example: 'organization')
+ * @param {String} groupKey Group key (example: 'org::5')
+ * @param {Object} groupPropertiesToSet Optional properties to set for group
+ */
 
-PostHogLib.prototype.__group = function (groupType, groupKey, groupPropertiesToSet) {
-  console$1.error('posthog.__group is still under development and should not be used in production!');
 
+PostHogLib.prototype.group = function (groupType, groupKey, groupPropertiesToSet) {
+  // console.error('posthog.group is still under development and should not be used in production!')
   if (!groupType || !groupKey) {
     console$1.error('posthog.group requires a group type and group key');
     return;
@@ -6202,15 +6389,14 @@ PostHogLib.prototype.__group = function (groupType, groupKey, groupPropertiesToS
   this.register({
     $groups: _objectSpread2(_objectSpread2({}, existingGroups), {}, _defineProperty({}, groupType, groupKey))
   });
-  this.capture('$group', {
-    distinct_id: this.get_distinct_id(),
-    $group: {
-      type: groupType,
-      key: groupKey,
-      $set: groupPropertiesToSet
-    }
-  });
-  this.reloadFeatureFlags();
+
+  if (groupPropertiesToSet) {
+    this.capture('$groupidentify', {
+      $group_type: groupType,
+      $group_key: groupKey,
+      $group_set: groupPropertiesToSet
+    });
+  }
 };
 /**
  * Clears super properties and generates a new random distinct_id for this instance.
@@ -6252,7 +6438,7 @@ PostHogLib.prototype.get_distinct_id = function () {
 };
 
 PostHogLib.prototype.getGroups = function () {
-  return this.get_property('groups');
+  return this.get_property('$groups') || {};
 };
 /**
  * Create an alias, which PostHog will use to link two distinct_ids going forward (not retroactively).
@@ -6455,7 +6641,7 @@ PostHogLib.prototype.set_config = function (config) {
       this['config']['debug'] = true;
     }
 
-    Config.DEBUG = Config.DEBUG || this.get_config('debug');
+    Config$1.DEBUG = Config$1.DEBUG || this.get_config('debug');
 
     if (this.sessionRecording && typeof config.disable_session_recording !== 'undefined') {
       if (oldConfig.disable_session_recording !== config.disable_session_recording) {
@@ -6843,7 +7029,7 @@ PostHogLib.prototype['register'] = PostHogLib.prototype.register;
 PostHogLib.prototype['register_once'] = PostHogLib.prototype.register_once;
 PostHogLib.prototype['unregister'] = PostHogLib.prototype.unregister;
 PostHogLib.prototype['identify'] = PostHogLib.prototype.identify;
-PostHogLib.prototype['__group'] = PostHogLib.prototype.__group;
+PostHogLib.prototype['group'] = PostHogLib.prototype.group;
 PostHogLib.prototype['alias'] = PostHogLib.prototype.alias;
 PostHogLib.prototype['set_config'] = PostHogLib.prototype.set_config;
 PostHogLib.prototype['get_config'] = PostHogLib.prototype.get_config;
@@ -6867,7 +7053,7 @@ PostHogLib.prototype['onFeatureFlags'] = PostHogLib.prototype.onFeatureFlags;
 PostHogLib.prototype['decodeLZ64'] = PostHogLib.prototype.decodeLZ64;
 PostHogLib.prototype['SentryIntegration'] = PostHogLib.prototype.sentry_integration;
 PostHogLib.prototype['debug'] = PostHogLib.prototype.debug;
-PostHogLib.prototype['LIB_VERSION'] = Config.LIB_VERSION;
+PostHogLib.prototype['LIB_VERSION'] = Config$1.LIB_VERSION;
 PostHogLib.prototype['startSessionRecording'] = PostHogLib.prototype.startSessionRecording;
 PostHogLib.prototype['stopSessionRecording'] = PostHogLib.prototype.stopSessionRecording;
 PostHogLib.prototype['sessionRecordingStarted'] = PostHogLib.prototype.sessionRecordingStarted; // PostHogPersistence Exports

package/dist/module.d.ts

@@ -166,6 +166,17 @@ declare class posthog {
      */
     static alias(alias: string, original?: string): posthog.CaptureResult | number
 
+    /**
+     * Alpha feature: don't use unless you know what you're doing!
+     *
+     * Sets group analytics information for subsequent events.
+     *
+     * @param {String} groupType Group type (example: 'organization')
+     * @param {String} groupKey Group key (example: 'org::5')
+     * @param {Object} groupPropertiesToSet Optional properties to set for group
+     */
+    static group(groupType: string, groupKey: string, groupPropertiesToSet?: posthog.Properties): void
+
     /**
      * Update the configuration of a posthog library instance.
      *