mixpanel-browser 2.46.0 → 2.47.0

package/.github/workflows/tests.yml

@@ -13,7 +13,7 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [14.x, 16.x]
+        node-version: [16.x, 18.x, 20.x]
 
     steps:
     - uses: actions/checkout@v2

package/CHANGELOG.md

@@ -1,3 +1,9 @@
+**2.47.0** (27 Apr 2023)
+- Collect richer marketing attribution properties for multi-touch attribution
+- New implementation of previously-deprecated track_pageview() method and init option to send automatically
+- Use performance.now when available for time-based entropy component of UUID-generation (thanks @adrianherd)
+- looser API Host check for default JSON-payload sending to mipxanel.com hosts
+
 **2.46.0** (20 Mar 2023)
 - Updates for new identity management system
 - More aggressive deduplication within batch sender

package/dist/mixpanel.amd.js

@@ -2,7 +2,7 @@ define(function () { 'use strict';
 
     var Config = {
         DEBUG: false,
-        LIB_VERSION: '2.46.0'
+        LIB_VERSION: '2.47.0'
     };
 
     // since es6 imports are static and we run unit tests from the console, window won't be defined when importing this file
@@ -832,20 +832,24 @@ define(function () { 'use strict';
 
     _.UUID = (function() {
 
-        // Time/ticks information
-        // 1*new Date() is a cross browser version of Date.now()
+        // Time-based entropy
         var T = function() {
-            var d = 1 * new Date(),
-                i = 0;
-
-            // this while loop figures how many browser ticks go by
-            // before 1*new Date() returns a new number, ie the amount
-            // of ticks that go by per millisecond
-            while (d == 1 * new Date()) {
-                i++;
+            var time = 1 * new Date(); // cross-browser version of Date.now()
+            var ticks;
+            if (window$1.performance && window$1.performance.now) {
+                ticks = window$1.performance.now();
+            } else {
+                // fall back to busy loop
+                ticks = 0;
+
+                // this while loop figures how many browser ticks go by
+                // before 1*new Date() returns a new number, ie the amount
+                // of ticks that go by per millisecond
+                while (time == 1 * new Date()) {
+                    ticks++;
+                }
             }
-
-            return d.toString(16) + i.toString(16);
+            return time.toString(16) + Math.floor(ticks).toString(16);
         };
 
         // Math.Random entropy
@@ -1412,21 +1416,42 @@ define(function () { 'use strict';
         };
     })();
 
+    var CAMPAIGN_KEYWORDS = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_content', 'utm_term'];
+    var CLICK_IDS = ['dclid', 'fbclid', 'gclid', 'ko_click_id', 'li_fat_id', 'msclkid', 'ttclid', 'twclid', 'wbraid'];
+
     _.info = {
-        campaignParams: function() {
-            var campaign_keywords = 'utm_source utm_medium utm_campaign utm_content utm_term'.split(' '),
-                kw = '',
+        campaignParams: function(default_value) {
+            var kw = '',
                 params = {};
-            _.each(campaign_keywords, function(kwkey) {
+            _.each(CAMPAIGN_KEYWORDS, function(kwkey) {
                 kw = _.getQueryParam(document$1.URL, kwkey);
                 if (kw.length) {
                     params[kwkey] = kw;
+                } else if (default_value !== undefined) {
+                    params[kwkey] = default_value;
+                }
+            });
+
+            return params;
+        },
+
+        clickParams: function() {
+            var id = '',
+                params = {};
+            _.each(CLICK_IDS, function(idkey) {
+                id = _.getQueryParam(document$1.URL, idkey);
+                if (id.length) {
+                    params[idkey] = id;
                 }
             });
 
             return params;
         },
 
+        marketingParams: function() {
+            return _.extend(_.info.campaignParams(), _.info.clickParams());
+        },
+
         searchEngine: function(referrer) {
             if (referrer.search('https?://(.*)google.([^/?]*)') === 0) {
                 return 'google';
@@ -1623,12 +1648,13 @@ define(function () { 'use strict';
             });
         },
 
-        pageviewInfo: function(page) {
+        mpPageViewProperties: function() {
             return _.strip_empty_properties({
-                'mp_page': page,
-                'mp_referrer': document$1.referrer,
-                'mp_browser': _.info.browser(userAgent, navigator.vendor, windowOpera),
-                'mp_platform': _.info.os()
+                'current_page_title': document$1.title,
+                'current_domain': window$1.location.hostname,
+                'current_url_path': window$1.location.pathname,
+                'current_url_protocol': window$1.location.protocol,
+                'current_url_search': window$1.location.search
             });
         }
     };
@@ -3806,13 +3832,6 @@ define(function () { 'use strict';
         }
     };
 
-    MixpanelPersistence.prototype.update_campaign_params = function() {
-        if (!this.campaign_params_saved) {
-            this.register_once(_.info.campaignParams());
-            this.campaign_params_saved = true;
-        }
-    };
-
     MixpanelPersistence.prototype.update_search_keyword = function(referrer) {
         this.register(_.info.searchInfo(referrer));
     };
@@ -4137,6 +4156,9 @@ define(function () { 'use strict';
         'cookie_domain':                     '',
         'cookie_name':                       '',
         'loaded':                            NOOP_FUNC,
+        'track_marketing':                   true,
+        'track_pageview':                    false,
+        'skip_first_touch_marketing':        false,
         'store_google':                      true,
         'save_referrer':                     true,
         'test':                              false,
@@ -4203,6 +4225,25 @@ define(function () { 'use strict';
         instance['people'] = new MixpanelPeople();
         instance['people']._init(instance);
 
+        if (!instance.get_config('skip_first_touch_marketing')) {
+            // We need null UTM params in the object because
+            // UTM parameters act as a tuple. If any UTM param
+            // is present, then we set all UTM params including
+            // empty ones together
+            var utm_params = _.info.campaignParams(null);
+            var initial_utm_params = {};
+            var has_utm = false;
+            _.each(utm_params, function(utm_value, utm_key) {
+                initial_utm_params['initial_' + utm_key] = utm_value;
+                if (utm_value) {
+                    has_utm = true;
+                }
+            });
+            if (has_utm) {
+                instance['people'].set_once(initial_utm_params);
+            }
+        }
+
         // if any instance on the page has debug = true, we set the
         // global debug to be true
         Config.DEBUG = Config.DEBUG || instance.get_config('debug');
@@ -4234,7 +4275,7 @@ define(function () { 'use strict';
      *     mixpanel.library_name.track(...);
      *
      * @param {String} token   Your Mixpanel API token
-     * @param {Object} [config]  A dictionary of config options to override. <a href="https://github.com/mixpanel/mixpanel-js/blob/8b2e1f7b/src/mixpanel-core.js#L87-L110">See a list of default config options</a>.
+     * @param {Object} [config]  A dictionary of config options to override. <a href="https://github.com/mixpanel/mixpanel-js/blob/v2.46.0/src/mixpanel-core.js#L88-L127">See a list of default config options</a>.
      * @param {String} [name]    The name for the new mixpanel instance that you want created
      */
     MixpanelLib.prototype.init = function (token, config, name) {
@@ -4272,7 +4313,7 @@ define(function () { 'use strict';
         // default to JSON payload for standard mixpanel.com API hosts
         if (!('api_payload_format' in config)) {
             var api_host = config['api_host'] || DEFAULT_CONFIG['api_host'];
-            if (api_host.match(/\.mixpanel\.com$/)) {
+            if (api_host.match(/\.mixpanel\.com/)) {
                 variable_features['api_payload_format'] = PAYLOAD_TYPE_JSON;
             }
         }
@@ -4347,6 +4388,10 @@ define(function () { 'use strict';
                 '$device_id': uuid
             }, '');
         }
+
+        if (this.get_config('track_pageview')) {
+            this.track_pageview();
+        }
     };
 
     // Private methods
@@ -4360,7 +4405,7 @@ define(function () { 'use strict';
     MixpanelLib.prototype._set_default_superprops = function() {
         this['persistence'].update_search_keyword(document$1.referrer);
         if (this.get_config('store_google')) {
-            this['persistence'].update_campaign_params();
+            this.register(_.info.campaignParams(), {persistent: false});
         }
         if (this.get_config('save_referrer')) {
             this['persistence'].update_referrer_info(document$1.referrer);
@@ -4842,6 +4887,10 @@ define(function () { 'use strict';
 
         this._set_default_superprops();
 
+        var marketing_properties = this.get_config('track_marketing')
+            ? _.info.marketingParams()
+            : {};
+
         // 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
@@ -4850,6 +4899,7 @@ define(function () { 'use strict';
         properties = _.extend(
             {},
             _.info.properties(),
+            marketing_properties,
             this['persistence'].properties(),
             this.unpersisted_superprops,
             properties
@@ -5010,17 +5060,54 @@ define(function () { 'use strict';
     };
 
     /**
-     * Track mp_page_view event. This is now ignored by the server.
+     * Track a default Mixpanel page view event, which includes extra default event properties to
+     * improve page view data. The `config.track_pageview` option for <a href="#mixpanelinit">mixpanel.init()</a>
+     * may be turned on for tracking page loads automatically.
      *
-     * @param {String} [page] The url of the page to record. If you don't include this, it defaults to the current url.
-     * @deprecated
+     * ### Usage
+     *
+     *     // track a default $mp_web_page_view event
+     *     mixpanel.track_pageview();
+     *
+     *     // track a page view event with additional event properties
+     *     mixpanel.track_pageview({'ab_test_variant': 'card-layout-b'});
+     *
+     *     // example approach to track page views on different page types as event properties
+     *     mixpanel.track_pageview({'page': 'pricing'});
+     *     mixpanel.track_pageview({'page': 'homepage'});
+     *
+     *     // UNCOMMON: Tracking a page view event with a custom event_name option. NOT expected to be used for
+     *     // individual pages on the same site or product. Use cases for custom event_name may be page
+     *     // views on different products or internal applications that are considered completely separate
+     *     mixpanel.track_pageview({'page': 'customer-search'}, {'event_name': '[internal] Admin Page View'});
+     *
+     * @param {Object} [properties] An optional set of additional properties to send with the page view event
+     * @param {Object} [options] Page view tracking options
+     * @param {String} [options.event_name] - Alternate name for the tracking event
+     * @returns {Boolean|Object} If the tracking request was successfully initiated/queued, an object
+     * with the tracking payload sent to the API server is returned; otherwise false.
      */
-    MixpanelLib.prototype.track_pageview = function(page) {
-        if (_.isUndefined(page)) {
-            page = document$1.location.href;
+    MixpanelLib.prototype.track_pageview = addOptOutCheckMixpanelLib(function(properties, options) {
+        if (typeof properties !== 'object') {
+            properties = {};
         }
-        this.track('mp_page_view', _.info.pageviewInfo(page));
-    };
+        options = options || {};
+        var event_name = options['event_name'] || '$mp_web_page_view';
+
+        var default_page_properties = _.extend(
+            _.info.mpPageViewProperties(),
+            _.info.campaignParams(),
+            _.info.clickParams()
+        );
+
+        var event_properties = _.extend(
+            {},
+            default_page_properties,
+            properties
+        );
+
+        return this.track(event_name, event_properties);
+    });
 
     /**
      * Track clicks on a set of document elements. Selector must be a
@@ -5516,10 +5603,20 @@ define(function () { 'use strict';
      *       // secure, meaning they will only be transmitted over https
      *       secure_cookie: false
      *
+     *       // disables enriching user profiles with first touch marketing data
+     *       skip_first_touch_marketing: false
+     *
      *       // the amount of time track_links will
      *       // wait for Mixpanel's servers to respond
      *       track_links_timeout: 300
      *
+     *       // adds any UTM parameters and click IDs present on the page to any events fired
+     *       track_marketing: true
+     *
+     *       // enables automatic page view tracking using default page view events through
+     *       // the track_pageview() method
+     *       track_pageview: false
+     *
      *       // if you set upgrade to be true, the library will check for
      *       // a cookie from our old js library and import super
      *       // properties from it, then the old cookie is deleted

package/dist/mixpanel.cjs.js

@@ -2,7 +2,7 @@
 
 var Config = {
     DEBUG: false,
-    LIB_VERSION: '2.46.0'
+    LIB_VERSION: '2.47.0'
 };
 
 // since es6 imports are static and we run unit tests from the console, window won't be defined when importing this file
@@ -832,20 +832,24 @@ _.utf8Encode = function(string) {
 
 _.UUID = (function() {
 
-    // Time/ticks information
-    // 1*new Date() is a cross browser version of Date.now()
+    // Time-based entropy
     var T = function() {
-        var d = 1 * new Date(),
-            i = 0;
-
-        // this while loop figures how many browser ticks go by
-        // before 1*new Date() returns a new number, ie the amount
-        // of ticks that go by per millisecond
-        while (d == 1 * new Date()) {
-            i++;
+        var time = 1 * new Date(); // cross-browser version of Date.now()
+        var ticks;
+        if (window$1.performance && window$1.performance.now) {
+            ticks = window$1.performance.now();
+        } else {
+            // fall back to busy loop
+            ticks = 0;
+
+            // this while loop figures how many browser ticks go by
+            // before 1*new Date() returns a new number, ie the amount
+            // of ticks that go by per millisecond
+            while (time == 1 * new Date()) {
+                ticks++;
+            }
         }
-
-        return d.toString(16) + i.toString(16);
+        return time.toString(16) + Math.floor(ticks).toString(16);
     };
 
     // Math.Random entropy
@@ -1412,21 +1416,42 @@ _.dom_query = (function() {
     };
 })();
 
+var CAMPAIGN_KEYWORDS = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_content', 'utm_term'];
+var CLICK_IDS = ['dclid', 'fbclid', 'gclid', 'ko_click_id', 'li_fat_id', 'msclkid', 'ttclid', 'twclid', 'wbraid'];
+
 _.info = {
-    campaignParams: function() {
-        var campaign_keywords = 'utm_source utm_medium utm_campaign utm_content utm_term'.split(' '),
-            kw = '',
+    campaignParams: function(default_value) {
+        var kw = '',
             params = {};
-        _.each(campaign_keywords, function(kwkey) {
+        _.each(CAMPAIGN_KEYWORDS, function(kwkey) {
             kw = _.getQueryParam(document$1.URL, kwkey);
             if (kw.length) {
                 params[kwkey] = kw;
+            } else if (default_value !== undefined) {
+                params[kwkey] = default_value;
+            }
+        });
+
+        return params;
+    },
+
+    clickParams: function() {
+        var id = '',
+            params = {};
+        _.each(CLICK_IDS, function(idkey) {
+            id = _.getQueryParam(document$1.URL, idkey);
+            if (id.length) {
+                params[idkey] = id;
             }
         });
 
         return params;
     },
 
+    marketingParams: function() {
+        return _.extend(_.info.campaignParams(), _.info.clickParams());
+    },
+
     searchEngine: function(referrer) {
         if (referrer.search('https?://(.*)google.([^/?]*)') === 0) {
             return 'google';
@@ -1623,12 +1648,13 @@ _.info = {
         });
     },
 
-    pageviewInfo: function(page) {
+    mpPageViewProperties: function() {
         return _.strip_empty_properties({
-            'mp_page': page,
-            'mp_referrer': document$1.referrer,
-            'mp_browser': _.info.browser(userAgent, navigator.vendor, windowOpera),
-            'mp_platform': _.info.os()
+            'current_page_title': document$1.title,
+            'current_domain': window$1.location.hostname,
+            'current_url_path': window$1.location.pathname,
+            'current_url_protocol': window$1.location.protocol,
+            'current_url_search': window$1.location.search
         });
     }
 };
@@ -3806,13 +3832,6 @@ MixpanelPersistence.prototype.unregister = function(prop) {
     }
 };
 
-MixpanelPersistence.prototype.update_campaign_params = function() {
-    if (!this.campaign_params_saved) {
-        this.register_once(_.info.campaignParams());
-        this.campaign_params_saved = true;
-    }
-};
-
 MixpanelPersistence.prototype.update_search_keyword = function(referrer) {
     this.register(_.info.searchInfo(referrer));
 };
@@ -4137,6 +4156,9 @@ var DEFAULT_CONFIG = {
     'cookie_domain':                     '',
     'cookie_name':                       '',
     'loaded':                            NOOP_FUNC,
+    'track_marketing':                   true,
+    'track_pageview':                    false,
+    'skip_first_touch_marketing':        false,
     'store_google':                      true,
     'save_referrer':                     true,
     'test':                              false,
@@ -4203,6 +4225,25 @@ var create_mplib = function(token, config, name) {
     instance['people'] = new MixpanelPeople();
     instance['people']._init(instance);
 
+    if (!instance.get_config('skip_first_touch_marketing')) {
+        // We need null UTM params in the object because
+        // UTM parameters act as a tuple. If any UTM param
+        // is present, then we set all UTM params including
+        // empty ones together
+        var utm_params = _.info.campaignParams(null);
+        var initial_utm_params = {};
+        var has_utm = false;
+        _.each(utm_params, function(utm_value, utm_key) {
+            initial_utm_params['initial_' + utm_key] = utm_value;
+            if (utm_value) {
+                has_utm = true;
+            }
+        });
+        if (has_utm) {
+            instance['people'].set_once(initial_utm_params);
+        }
+    }
+
     // if any instance on the page has debug = true, we set the
     // global debug to be true
     Config.DEBUG = Config.DEBUG || instance.get_config('debug');
@@ -4234,7 +4275,7 @@ var create_mplib = function(token, config, name) {
  *     mixpanel.library_name.track(...);
  *
  * @param {String} token   Your Mixpanel API token
- * @param {Object} [config]  A dictionary of config options to override. <a href="https://github.com/mixpanel/mixpanel-js/blob/8b2e1f7b/src/mixpanel-core.js#L87-L110">See a list of default config options</a>.
+ * @param {Object} [config]  A dictionary of config options to override. <a href="https://github.com/mixpanel/mixpanel-js/blob/v2.46.0/src/mixpanel-core.js#L88-L127">See a list of default config options</a>.
  * @param {String} [name]    The name for the new mixpanel instance that you want created
  */
 MixpanelLib.prototype.init = function (token, config, name) {
@@ -4272,7 +4313,7 @@ MixpanelLib.prototype._init = function(token, config, name) {
     // default to JSON payload for standard mixpanel.com API hosts
     if (!('api_payload_format' in config)) {
         var api_host = config['api_host'] || DEFAULT_CONFIG['api_host'];
-        if (api_host.match(/\.mixpanel\.com$/)) {
+        if (api_host.match(/\.mixpanel\.com/)) {
             variable_features['api_payload_format'] = PAYLOAD_TYPE_JSON;
         }
     }
@@ -4347,6 +4388,10 @@ MixpanelLib.prototype._init = function(token, config, name) {
             '$device_id': uuid
         }, '');
     }
+
+    if (this.get_config('track_pageview')) {
+        this.track_pageview();
+    }
 };
 
 // Private methods
@@ -4360,7 +4405,7 @@ MixpanelLib.prototype._loaded = function() {
 MixpanelLib.prototype._set_default_superprops = function() {
     this['persistence'].update_search_keyword(document$1.referrer);
     if (this.get_config('store_google')) {
-        this['persistence'].update_campaign_params();
+        this.register(_.info.campaignParams(), {persistent: false});
     }
     if (this.get_config('save_referrer')) {
         this['persistence'].update_referrer_info(document$1.referrer);
@@ -4842,6 +4887,10 @@ MixpanelLib.prototype.track = addOptOutCheckMixpanelLib(function(event_name, pro
 
     this._set_default_superprops();
 
+    var marketing_properties = this.get_config('track_marketing')
+        ? _.info.marketingParams()
+        : {};
+
     // 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
@@ -4850,6 +4899,7 @@ MixpanelLib.prototype.track = addOptOutCheckMixpanelLib(function(event_name, pro
     properties = _.extend(
         {},
         _.info.properties(),
+        marketing_properties,
         this['persistence'].properties(),
         this.unpersisted_superprops,
         properties
@@ -5010,17 +5060,54 @@ MixpanelLib.prototype.get_group = function (group_key, group_id) {
 };
 
 /**
- * Track mp_page_view event. This is now ignored by the server.
+ * Track a default Mixpanel page view event, which includes extra default event properties to
+ * improve page view data. The `config.track_pageview` option for <a href="#mixpanelinit">mixpanel.init()</a>
+ * may be turned on for tracking page loads automatically.
  *
- * @param {String} [page] The url of the page to record. If you don't include this, it defaults to the current url.
- * @deprecated
+ * ### Usage
+ *
+ *     // track a default $mp_web_page_view event
+ *     mixpanel.track_pageview();
+ *
+ *     // track a page view event with additional event properties
+ *     mixpanel.track_pageview({'ab_test_variant': 'card-layout-b'});
+ *
+ *     // example approach to track page views on different page types as event properties
+ *     mixpanel.track_pageview({'page': 'pricing'});
+ *     mixpanel.track_pageview({'page': 'homepage'});
+ *
+ *     // UNCOMMON: Tracking a page view event with a custom event_name option. NOT expected to be used for
+ *     // individual pages on the same site or product. Use cases for custom event_name may be page
+ *     // views on different products or internal applications that are considered completely separate
+ *     mixpanel.track_pageview({'page': 'customer-search'}, {'event_name': '[internal] Admin Page View'});
+ *
+ * @param {Object} [properties] An optional set of additional properties to send with the page view event
+ * @param {Object} [options] Page view tracking options
+ * @param {String} [options.event_name] - Alternate name for the tracking event
+ * @returns {Boolean|Object} If the tracking request was successfully initiated/queued, an object
+ * with the tracking payload sent to the API server is returned; otherwise false.
  */
-MixpanelLib.prototype.track_pageview = function(page) {
-    if (_.isUndefined(page)) {
-        page = document$1.location.href;
+MixpanelLib.prototype.track_pageview = addOptOutCheckMixpanelLib(function(properties, options) {
+    if (typeof properties !== 'object') {
+        properties = {};
     }
-    this.track('mp_page_view', _.info.pageviewInfo(page));
-};
+    options = options || {};
+    var event_name = options['event_name'] || '$mp_web_page_view';
+
+    var default_page_properties = _.extend(
+        _.info.mpPageViewProperties(),
+        _.info.campaignParams(),
+        _.info.clickParams()
+    );
+
+    var event_properties = _.extend(
+        {},
+        default_page_properties,
+        properties
+    );
+
+    return this.track(event_name, event_properties);
+});
 
 /**
  * Track clicks on a set of document elements. Selector must be a
@@ -5516,10 +5603,20 @@ MixpanelLib.prototype.name_tag = function(name_tag) {
  *       // secure, meaning they will only be transmitted over https
  *       secure_cookie: false
  *
+ *       // disables enriching user profiles with first touch marketing data
+ *       skip_first_touch_marketing: false
+ *
  *       // the amount of time track_links will
  *       // wait for Mixpanel's servers to respond
  *       track_links_timeout: 300
  *
+ *       // adds any UTM parameters and click IDs present on the page to any events fired
+ *       track_marketing: true
+ *
+ *       // enables automatic page view tracking using default page view events through
+ *       // the track_pageview() method
+ *       track_pageview: false
+ *
  *       // if you set upgrade to be true, the library will check for
  *       // a cookie from our old js library and import super
  *       // properties from it, then the old cookie is deleted