mixpanel-browser 2.66.0 → 2.68.0

package/dist/mixpanel.globals.js

@@ -3,7 +3,7 @@
 
     var Config = {
         DEBUG: false,
-        LIB_VERSION: '2.66.0'
+        LIB_VERSION: '2.68.0'
     };
 
     // since es6 imports are static and we run unit tests from the console, window won't be defined when importing this file
@@ -2655,6 +2655,38 @@
         return true;
     }
 
+    /** @const */ var DEFAULT_RAGE_CLICK_THRESHOLD_PX = 30;
+    /** @const */ var DEFAULT_RAGE_CLICK_TIMEOUT_MS = 1000;
+    /** @const */ var DEFAULT_RAGE_CLICK_CLICK_COUNT = 4;
+
+    function RageClickTracker() {
+        this.clicks = [];
+    }
+
+    RageClickTracker.prototype.isRageClick = function(x, y, options) {
+        options = options || {};
+        var thresholdPx = options['threshold_px'] || DEFAULT_RAGE_CLICK_THRESHOLD_PX;
+        var timeoutMs = options['timeout_ms'] || DEFAULT_RAGE_CLICK_TIMEOUT_MS;
+        var clickCount = options['click_count'] || DEFAULT_RAGE_CLICK_CLICK_COUNT;
+        var timestamp = Date.now();
+
+        var lastClick = this.clicks[this.clicks.length - 1];
+        if (
+            lastClick &&
+            timestamp - lastClick.timestamp < timeoutMs &&
+            Math.sqrt(Math.pow(x - lastClick.x, 2) + Math.pow(y - lastClick.y, 2)) < thresholdPx
+        ) {
+            this.clicks.push({ x: x, y: y, timestamp: timestamp });
+            if (this.clicks.length >= clickCount) {
+                this.clicks = [];
+                return true;
+            }
+        } else {
+            this.clicks = [{ x: x, y: y, timestamp: timestamp }];
+        }
+        return false;
+    };
+
     var AUTOCAPTURE_CONFIG_KEY = 'autocapture';
     var LEGACY_PAGEVIEW_CONFIG_KEY = 'track_pageview';
 
@@ -2676,6 +2708,7 @@
     var CONFIG_TRACK_CLICK = 'click';
     var CONFIG_TRACK_INPUT = 'input';
     var CONFIG_TRACK_PAGEVIEW = 'pageview';
+    var CONFIG_TRACK_RAGE_CLICK = 'rage_click';
     var CONFIG_TRACK_SCROLL = 'scroll';
     var CONFIG_TRACK_SUBMIT = 'submit';
 
@@ -2693,6 +2726,7 @@
     CONFIG_DEFAULTS$1[CONFIG_TRACK_CLICK] = true;
     CONFIG_DEFAULTS$1[CONFIG_TRACK_INPUT] = true;
     CONFIG_DEFAULTS$1[CONFIG_TRACK_PAGEVIEW] = PAGEVIEW_OPTION_FULL_URL;
+    CONFIG_DEFAULTS$1[CONFIG_TRACK_RAGE_CLICK] = true;
     CONFIG_DEFAULTS$1[CONFIG_TRACK_SCROLL] = true;
     CONFIG_DEFAULTS$1[CONFIG_TRACK_SUBMIT] = true;
 
@@ -2702,6 +2736,7 @@
 
     var MP_EV_CLICK = '$mp_click';
     var MP_EV_INPUT = '$mp_input_change';
+    var MP_EV_RAGE_CLICK = '$mp_rage_click';
     var MP_EV_SCROLL = '$mp_scroll';
     var MP_EV_SUBMIT = '$mp_submit';
 
@@ -2724,6 +2759,7 @@
         this.initInputTracking();
         this.initScrollTracking();
         this.initSubmitTracking();
+        this.initRageClickTracking();
     };
 
     Autocapture.prototype.getFullConfig = function() {
@@ -2802,6 +2838,11 @@
             return;
         }
 
+        var isCapturedForHeatMap = this.mp.is_recording_heatmap_data() && (
+            (mpEventName === MP_EV_CLICK && !this.getConfig(CONFIG_TRACK_CLICK)) ||
+            (mpEventName === MP_EV_RAGE_CLICK && !this._getRageClickConfig())
+        );
+
         var props = getPropsForDOMEvent(ev, {
             allowElementCallback: this.getConfig(CONFIG_ALLOW_ELEMENT_CALLBACK),
             allowSelectors: this.getConfig(CONFIG_ALLOW_SELECTORS),
@@ -2810,7 +2851,7 @@
             blockSelectors: this.getConfig(CONFIG_BLOCK_SELECTORS),
             captureExtraAttrs: this.getConfig(CONFIG_CAPTURE_EXTRA_ATTRS),
             captureTextContent: this.getConfig(CONFIG_CAPTURE_TEXT_CONTENT),
-            capturedForHeatMap: mpEventName === MP_EV_CLICK && !this.getConfig(CONFIG_TRACK_CLICK) && this.mp.is_recording_heatmap_data(),
+            capturedForHeatMap: isCapturedForHeatMap,
         });
         if (props) {
             _.extend(props, DEFAULT_PROPS);
@@ -2818,6 +2859,24 @@
         }
     };
 
+    Autocapture.prototype._getRageClickConfig = function() {
+        var config = this.getConfig(CONFIG_TRACK_RAGE_CLICK);
+
+        if (!config) {
+            return null; // rage click tracking disabled
+        }
+
+        if (config === true) {
+            return {}; // use defaults
+        }
+
+        if (typeof config === 'object') {
+            return config; // use custom configuration
+        }
+
+        return {}; // fallback to defaults for any other truthy value
+    };
+
     Autocapture.prototype.initClickTracking = function() {
         win.removeEventListener(EV_CLICK, this.listenerClick);
 
@@ -2919,6 +2978,36 @@
         }.bind(this)));
     };
 
+    Autocapture.prototype.initRageClickTracking = function() {
+        win.removeEventListener(EV_CLICK, this.listenerRageClick);
+
+        var rageClickConfig = this._getRageClickConfig();
+        if (!rageClickConfig && !this.mp.get_config('record_heatmap_data')) {
+            return;
+        }
+
+        logger$4.log('Initializing rage click tracking');
+        if (!this._rageClickTracker) {
+            this._rageClickTracker = new RageClickTracker();
+        }
+
+        this.listenerRageClick = function(ev) {
+            var currentRageClickConfig = this._getRageClickConfig();
+            if (!currentRageClickConfig && !this.mp.is_recording_heatmap_data()) {
+                return;
+            }
+
+            if (this.currentUrlBlocked()) {
+                return;
+            }
+
+            if (this._rageClickTracker.isRageClick(ev['pageX'], ev['pageY'], currentRageClickConfig)) {
+                this.trackDomEvent(ev, MP_EV_RAGE_CLICK);
+            }
+        }.bind(this);
+        win.addEventListener(EV_CLICK, this.listenerRageClick);
+    };
+
     Autocapture.prototype.initScrollTracking = function() {
         win.removeEventListener(EV_SCROLLEND, this.listenerScroll);
 
@@ -3003,8 +3092,10 @@
      * @constructor
      */
     var FeatureFlagManager = function(initOptions) {
+        this.getFullApiRoute = initOptions.getFullApiRoute;
         this.getMpConfig = initOptions.getConfigFunc;
-        this.getDistinctId = initOptions.getDistinctIdFunc;
+        this.setMpConfig = initOptions.setConfigFunc;
+        this.getMpProperty = initOptions.getPropertyFunc;
         this.track = initOptions.trackingFunc;
     };
 
@@ -3041,6 +3132,23 @@
         return !!this.getMpConfig(FLAGS_CONFIG_KEY);
     };
 
+    FeatureFlagManager.prototype.updateContext = function(newContext, options) {
+        if (!this.isSystemEnabled()) {
+            logger$3.critical('Feature Flags not enabled, cannot update context');
+            return Promise.resolve();
+        }
+
+        var ffConfig = this.getMpConfig(FLAGS_CONFIG_KEY);
+        if (!_.isObject(ffConfig)) {
+            ffConfig = {};
+        }
+        var oldContext = (options && options['replace']) ? {} : this.getConfig(CONFIG_CONTEXT);
+        ffConfig[CONFIG_CONTEXT] = _.extend({}, oldContext, newContext);
+
+        this.setMpConfig(FLAGS_CONFIG_KEY, ffConfig);
+        return this.fetchFlags();
+    };
+
     FeatureFlagManager.prototype.areFlagsReady = function() {
         if (!this.isSystemEnabled()) {
             logger$3.error('Feature Flags not enabled');
@@ -3050,15 +3158,17 @@
 
     FeatureFlagManager.prototype.fetchFlags = function() {
         if (!this.isSystemEnabled()) {
-            return;
+            return Promise.resolve();
         }
 
-        var distinctId = this.getDistinctId();
+        var distinctId = this.getMpProperty('distinct_id');
+        var deviceId = this.getMpProperty('$device_id');
         logger$3.log('Fetching flags for distinct ID: ' + distinctId);
         var reqParams = {
-            'context': _.extend({'distinct_id': distinctId}, this.getConfig(CONFIG_CONTEXT))
+            'context': _.extend({'distinct_id': distinctId, 'device_id': deviceId}, this.getConfig(CONFIG_CONTEXT))
         };
-        this.fetchPromise = win['fetch'](this.getMpConfig('api_host') + '/' + this.getMpConfig('api_routes')['flags'], {
+        this._fetchInProgressStartTime = Date.now();
+        this.fetchPromise = win['fetch'](this.getFullApiRoute(), {
             'method': 'POST',
             'headers': {
                 'Authorization': 'Basic ' + btoa(this.getMpConfig('token') + ':'),
@@ -3066,6 +3176,7 @@
             },
             'body': JSON.stringify(reqParams)
         }).then(function(response) {
+            this.markFetchComplete();
             return response.json().then(function(responseBody) {
                 var responseFlags = responseBody['flags'];
                 if (!responseFlags) {
@@ -3080,9 +3191,26 @@
                 });
                 this.flags = flags;
             }.bind(this)).catch(function(error) {
+                this.markFetchComplete();
                 logger$3.error(error);
-            });
-        }.bind(this)).catch(function() {});
+            }.bind(this));
+        }.bind(this)).catch(function(error) {
+            this.markFetchComplete();
+            logger$3.error(error);
+        }.bind(this));
+
+        return this.fetchPromise;
+    };
+
+    FeatureFlagManager.prototype.markFetchComplete = function() {
+        if (!this._fetchInProgressStartTime) {
+            logger$3.error('Fetch in progress started time not set, cannot mark fetch complete');
+            return;
+        }
+        this._fetchStartTime = this._fetchInProgressStartTime;
+        this._fetchCompleteTime = Date.now();
+        this._fetchLatency = this._fetchCompleteTime - this._fetchStartTime;
+        this._fetchInProgressStartTime = null;
     };
 
     FeatureFlagManager.prototype.getVariant = function(featureName, fallback) {
@@ -3161,7 +3289,10 @@
         this.track('$experiment_started', {
             'Experiment name': featureName,
             'Variant name': feature['key'],
-            '$experiment_type': 'feature_flag'
+            '$experiment_type': 'feature_flag',
+            'Variant fetch start time': new Date(this._fetchStartTime).toISOString(),
+            'Variant fetch complete time': new Date(this._fetchCompleteTime).toISOString(),
+            'Variant fetch latency (ms)': this._fetchLatency
         });
     };
 
@@ -3181,6 +3312,7 @@
     FeatureFlagManager.prototype['get_variant_value_sync'] = FeatureFlagManager.prototype.getVariantValueSync;
     FeatureFlagManager.prototype['is_enabled'] = FeatureFlagManager.prototype.isEnabled;
     FeatureFlagManager.prototype['is_enabled_sync'] = FeatureFlagManager.prototype.isEnabledSync;
+    FeatureFlagManager.prototype['update_context'] = FeatureFlagManager.prototype.updateContext;
 
     // Deprecated method
     FeatureFlagManager.prototype['get_feature_data'] = FeatureFlagManager.prototype.getFeatureData;
@@ -5952,7 +6084,7 @@
         'batch_autostart':                   true,
         'hooks':                             {},
         'record_block_class':                new RegExp('^(mp-block|fs-exclude|amp-block|rr-block|ph-no-capture)$'),
-        'record_block_selector':             'img, video',
+        'record_block_selector':             'img, video, audio',
         'record_canvas':                     false,
         'record_collect_fonts':              false,
         'record_heatmap_data':               false,
@@ -6172,8 +6304,12 @@
         }
 
         this.flags = new FeatureFlagManager({
+            getFullApiRoute: _.bind(function() {
+                return this.get_api_host('flags') + '/' + this.get_config('api_routes')['flags'];
+            }, this),
             getConfigFunc: _.bind(this.get_config, this),
-            getDistinctIdFunc: _.bind(this.get_distinct_id, this),
+            setConfigFunc: _.bind(this.set_config, this),
+            getPropertyFunc: _.bind(this.get_property, this),
             trackingFunc: _.bind(this.track, this)
         });
         this.flags.init();
@@ -6659,11 +6795,10 @@
 
     MixpanelLib.prototype.get_batcher_configs = function() {
         var queue_prefix = '__mpq_' + this.get_config('token');
-        var api_routes = this.get_config('api_routes');
         this._batcher_configs = this._batcher_configs || {
-            events: {type: 'events', endpoint: '/' + api_routes['track'], queue_key: queue_prefix + '_ev'},
-            people: {type: 'people', endpoint: '/' + api_routes['engage'], queue_key: queue_prefix + '_pp'},
-            groups: {type: 'groups', endpoint: '/' + api_routes['groups'], queue_key: queue_prefix + '_gr'}
+            events: {type: 'events', api_name: 'track', queue_key: queue_prefix + '_ev'},
+            people: {type: 'people', api_name: 'engage', queue_key: queue_prefix + '_pp'},
+            groups: {type: 'groups', api_name: 'groups', queue_key: queue_prefix + '_gr'}
         };
         return this._batcher_configs;
     };
@@ -6677,8 +6812,9 @@
                         libConfig: this['config'],
                         errorReporter: this.get_config('error_reporter'),
                         sendRequestFunc: _.bind(function(data, options, cb) {
+                            var api_routes = this.get_config('api_routes');
                             this._send_request(
-                                this.get_config('api_host') + attrs.endpoint,
+                                this.get_api_host(attrs.api_name) + '/' + api_routes[attrs.api_name],
                                 this._encode_data_for_request(data),
                                 options,
                                 this._prepare_callback(cb, data)
@@ -7406,31 +7542,15 @@
      * Useful for clearing data when a user logs out.
      */
     MixpanelLib.prototype.reset = function() {
-        var self = this;
-
-        var reset = function () {
-            self['persistence'].clear();
-            self._flags.identify_called = false;
-            var uuid = _.UUID();
-            self.register_once({
-                'distinct_id': DEVICE_ID_PREFIX + uuid,
-                '$device_id': uuid
-            }, '');
-        };
-
-        if (self._recorder) {
-            self.stop_session_recording()
-                .then(function () {
-                    reset();
-                    self._check_and_start_session_recording();
-                })
-                .catch(_.bind(function (err) {
-                    reset();
-                    this.report_error('Error restarting recording session', err);
-                }, this));
-        } else {
-            reset();
-        }
+        this.stop_session_recording();
+        this['persistence'].clear();
+        this._flags.identify_called = false;
+        var uuid = _.UUID();
+        this.register_once({
+            'distinct_id': DEVICE_ID_PREFIX + uuid,
+            '$device_id': uuid
+        }, '');
+        this._check_and_start_session_recording();
     };
 
     /**