mixpanel-browser 2.75.0 → 2.77.0

package/dist/mixpanel-with-async-recorder.cjs.js

@@ -2,9 +2,17 @@
 
 var Config = {
     DEBUG: false,
-    LIB_VERSION: '2.75.0'
+    LIB_VERSION: '2.77.0'
 };
 
+// Window global names for async modules
+var TARGETING_GLOBAL_NAME = '__mp_targeting';
+var RECORDER_GLOBAL_NAME = '__mp_recorder';
+
+// Constants that are injected at build-time for the names of async modules.
+var RECORDER_FILENAME = 'mixpanel-recorder-DLKbUIEE.js';
+var TARGETING_FILENAME = 'mixpanel-targeting-CmVvUyFM.js';
+
 // since es6 imports are static and we run unit tests from the console, window won't be defined when importing this file
 var win;
 if (typeof(window) === 'undefined') {
@@ -2121,6 +2129,17 @@ var isOnline = function() {
 
 var NOOP_FUNC = function () {};
 
+var urlMatchesRegexList = function (url, regexList) {
+    var matches = false;
+    for (var i = 0; i < regexList.length; i++) {
+        if (url.match(regexList[i])) {
+            matches = true;
+            break;
+        }
+    }
+    return matches;
+};
+
 var JSONStringify = null, JSONParse = null;
 if (typeof JSON !== 'undefined') {
     JSONStringify = JSON.stringify;
@@ -2143,25 +2162,6 @@ _['JSONEncode']             = _.JSONEncode;
 _['toArray']                = _.toArray;
 _['NPO']                    = NpoPromise;
 
-/**
- * @param {import('./session-recording').SerializedRecording} serializedRecording
- * @returns {boolean}
- */
-var isRecordingExpired = function(serializedRecording) {
-    var now = Date.now();
-    return !serializedRecording || now > serializedRecording['maxExpires'] || now > serializedRecording['idleExpires'];
-};
-
-/**
- * Shared global window property names used across modules
- */
-
-// Targeting library global (used by flags and targeting modules)
-var TARGETING_GLOBAL_NAME = '__mp_targeting';
-
-// Recorder library global (used by recorder and mixpanel-core)
-var RECORDER_GLOBAL_NAME = '__mp_recorder';
-
 // stateless utils
 // mostly from https://github.com/mixpanel/mixpanel-js/blob/989ada50f518edab47b9c4fd9535f9fbd5ec5fc0/src/autotrack-utils.js
 
@@ -2267,7 +2267,7 @@ var EVENT_HANDLER_ATTRIBUTES = [
 
 var MAX_DEPTH = 5;
 
-var logger$4 = console_with_prefix('autocapture');
+var logger$5 = console_with_prefix('autocapture');
 
 
 function getClasses(el) {
@@ -2531,7 +2531,7 @@ function isElementAllowed(el, ev, allowElementCallback, allowSelectors) {
                 return false;
             }
         } catch (err) {
-            logger$4.critical('Error while checking element in allowElementCallback', err);
+            logger$5.critical('Error while checking element in allowElementCallback', err);
             return false;
         }
     }
@@ -2548,7 +2548,7 @@ function isElementAllowed(el, ev, allowElementCallback, allowSelectors) {
                 return true;
             }
         } catch (err) {
-            logger$4.critical('Error while checking selector: ' + sel, err);
+            logger$5.critical('Error while checking selector: ' + sel, err);
         }
     }
     return false;
@@ -2563,7 +2563,7 @@ function isElementBlocked(el, ev, blockElementCallback, blockSelectors) {
                 return true;
             }
         } catch (err) {
-            logger$4.critical('Error while checking element in blockElementCallback', err);
+            logger$5.critical('Error while checking element in blockElementCallback', err);
             return true;
         }
     }
@@ -2577,7 +2577,7 @@ function isElementBlocked(el, ev, blockElementCallback, blockSelectors) {
                     return true;
                 }
             } catch (err) {
-                logger$4.critical('Error while checking selector: ' + sel, err);
+                logger$5.critical('Error while checking selector: ' + sel, err);
             }
         }
     }
@@ -3041,7 +3041,7 @@ ShadowDOMObserver.prototype.observeShadowRoot = function(shadowRoot) {
         observer.observe(shadowRoot, this.observerConfig);
         this.shadowObservers.push(observer);
     } catch (e) {
-        logger$4.critical('Error while observing shadow root', e);
+        logger$5.critical('Error while observing shadow root', e);
     }
 };
 
@@ -3052,7 +3052,7 @@ ShadowDOMObserver.prototype.start = function() {
     }
 
     if (!weakSetSupported()) {
-        logger$4.critical('Shadow DOM observation unavailable: WeakSet not supported');
+        logger$5.critical('Shadow DOM observation unavailable: WeakSet not supported');
         return;
     }
 
@@ -3068,7 +3068,7 @@ ShadowDOMObserver.prototype.stop = function() {
         try {
             this.shadowObservers[i].disconnect();
         } catch (e) {
-            logger$4.critical('Error while disconnecting shadow DOM observer', e);
+            logger$5.critical('Error while disconnecting shadow DOM observer', e);
         }
     }
     this.shadowObservers = [];
@@ -3256,7 +3256,7 @@ DeadClickTracker.prototype.startTracking = function() {
 
             this.mutationObserver.observe(document.body || document.documentElement, MUTATION_OBSERVER_CONFIG);
         } catch (e) {
-            logger$4.critical('Error while setting up mutation observer', e);
+            logger$5.critical('Error while setting up mutation observer', e);
         }
     }
 
@@ -3271,7 +3271,7 @@ DeadClickTracker.prototype.startTracking = function() {
             );
             this.shadowDOMObserver.start();
         } catch (e) {
-            logger$4.critical('Error while setting up shadow DOM observer', e);
+            logger$5.critical('Error while setting up shadow DOM observer', e);
             this.shadowDOMObserver = null;
         }
     }
@@ -3298,7 +3298,7 @@ DeadClickTracker.prototype.stopTracking = function() {
         try {
             listener.target.removeEventListener(listener.event, listener.handler, listener.options);
         } catch (e) {
-            logger$4.critical('Error while removing event listener', e);
+            logger$5.critical('Error while removing event listener', e);
         }
     }
     this.eventListeners = [];
@@ -3307,7 +3307,7 @@ DeadClickTracker.prototype.stopTracking = function() {
         try {
             this.mutationObserver.disconnect();
         } catch (e) {
-            logger$4.critical('Error while disconnecting mutation observer', e);
+            logger$5.critical('Error while disconnecting mutation observer', e);
         }
         this.mutationObserver = null;
     }
@@ -3316,7 +3316,7 @@ DeadClickTracker.prototype.stopTracking = function() {
         try {
             this.shadowDOMObserver.stop();
         } catch (e) {
-            logger$4.critical('Error while stopping shadow DOM observer', e);
+            logger$5.critical('Error while stopping shadow DOM observer', e);
         }
         this.shadowDOMObserver = null;
     }
@@ -3394,7 +3394,7 @@ var Autocapture = function(mp) {
 
 Autocapture.prototype.init = function() {
     if (!minDOMApisSupported()) {
-        logger$4.critical('Autocapture unavailable: missing required DOM APIs');
+        logger$5.critical('Autocapture unavailable: missing required DOM APIs');
         return;
     }
     this.initPageListeners();
@@ -3426,27 +3426,15 @@ Autocapture.prototype.getConfig = function(key) {
 };
 
 Autocapture.prototype.currentUrlBlocked = function() {
-    var i;
     var currentUrl = _.info.currentUrl();
 
     var allowUrlRegexes = this.getConfig(CONFIG_ALLOW_URL_REGEXES) || [];
     if (allowUrlRegexes.length) {
         // we're using an allowlist, only track if current URL matches
-        var allowed = false;
-        for (i = 0; i < allowUrlRegexes.length; i++) {
-            var allowRegex = allowUrlRegexes[i];
-            try {
-                if (currentUrl.match(allowRegex)) {
-                    allowed = true;
-                    break;
-                }
-            } catch (err) {
-                logger$4.critical('Error while checking block URL regex: ' + allowRegex, err);
-                return true;
-            }
-        }
-        if (!allowed) {
-            // wasn't allowed by any regex
+        try {
+            return !urlMatchesRegexList(currentUrl, allowUrlRegexes);
+        } catch (err) {
+            logger$5.critical('Error while checking block URL regexes: ', err);
             return true;
         }
     }
@@ -3456,17 +3444,12 @@ Autocapture.prototype.currentUrlBlocked = function() {
         return false;
     }
 
-    for (i = 0; i < blockUrlRegexes.length; i++) {
-        try {
-            if (currentUrl.match(blockUrlRegexes[i])) {
-                return true;
-            }
-        } catch (err) {
-            logger$4.critical('Error while checking block URL regex: ' + blockUrlRegexes[i], err);
-            return true;
-        }
+    try {
+        return urlMatchesRegexList(currentUrl, blockUrlRegexes);
+    } catch (err) {
+        logger$5.critical('Error while checking block URL regexes: ', err);
+        return true;
     }
-    return false;
 };
 
 Autocapture.prototype.pageviewTrackingConfig = function() {
@@ -3602,7 +3585,7 @@ Autocapture.prototype._initScrollDepthTracking = function() {
         return;
     }
 
-    logger$4.log('Initializing scroll depth tracking');
+    logger$5.log('Initializing scroll depth tracking');
 
     this.maxScrollViewDepth = Math.max(document$1.documentElement.clientHeight, win.innerHeight || 0);
 
@@ -3628,7 +3611,7 @@ Autocapture.prototype.initClickTracking = function() {
     if (!this.getConfig(CONFIG_TRACK_CLICK) && !this.mp.get_config('record_heatmap_data')) {
         return;
     }
-    logger$4.log('Initializing click tracking');
+    logger$5.log('Initializing click tracking');
 
     this.listenerClick = function(ev) {
         if (!this.getConfig(CONFIG_TRACK_CLICK) && !this.mp.is_recording_heatmap_data()) {
@@ -3647,7 +3630,7 @@ Autocapture.prototype.initDeadClickTracking = function() {
         return;
     }
 
-    logger$4.log('Initializing dead click tracking');
+    logger$5.log('Initializing dead click tracking');
     if (!this._deadClickTracker) {
         this._deadClickTracker = new DeadClickTracker(function(deadClickEvent) {
             this.trackDomEvent(deadClickEvent, MP_EV_DEAD_CLICK);
@@ -3681,7 +3664,7 @@ Autocapture.prototype.initInputTracking = function() {
     if (!this.getConfig(CONFIG_TRACK_INPUT)) {
         return;
     }
-    logger$4.log('Initializing input tracking');
+    logger$5.log('Initializing input tracking');
 
     this.listenerChange = function(ev) {
         if (!this.getConfig(CONFIG_TRACK_INPUT)) {
@@ -3698,7 +3681,7 @@ Autocapture.prototype.initPageviewTracking = function() {
     if (!this.pageviewTrackingConfig()) {
         return;
     }
-    logger$4.log('Initializing pageview tracking');
+    logger$5.log('Initializing pageview tracking');
 
     var previousTrackedUrl = '';
     var tracked = false;
@@ -3733,7 +3716,7 @@ Autocapture.prototype.initPageviewTracking = function() {
             }
             if (didPathChange) {
                 this.lastScrollCheckpoint = 0;
-                logger$4.log('Path change: re-initializing scroll depth checkpoints');
+                logger$5.log('Path change: re-initializing scroll depth checkpoints');
             }
         }
     }.bind(this));
@@ -3748,7 +3731,7 @@ Autocapture.prototype.initRageClickTracking = function() {
         return;
     }
 
-    logger$4.log('Initializing rage click tracking');
+    logger$5.log('Initializing rage click tracking');
     if (!this._rageClickTracker) {
         this._rageClickTracker = new RageClickTracker();
     }
@@ -3778,7 +3761,7 @@ Autocapture.prototype.initScrollTracking = function() {
     if (!this.getConfig(CONFIG_TRACK_SCROLL)) {
         return;
     }
-    logger$4.log('Initializing scroll tracking');
+    logger$5.log('Initializing scroll tracking');
     this.lastScrollCheckpoint = 0;
 
     var scrollTrackFunction = function() {
@@ -3815,7 +3798,7 @@ Autocapture.prototype.initScrollTracking = function() {
                 }
             }
         } catch (err) {
-            logger$4.critical('Error while calculating scroll percentage', err);
+            logger$5.critical('Error while calculating scroll percentage', err);
         }
         if (shouldTrack) {
             this.mp.track(MP_EV_SCROLL, props);
@@ -3833,7 +3816,7 @@ Autocapture.prototype.initSubmitTracking = function() {
     if (!this.getConfig(CONFIG_TRACK_SUBMIT)) {
         return;
     }
-    logger$4.log('Initializing submit tracking');
+    logger$5.log('Initializing submit tracking');
 
     this.listenerSubmit = function(ev) {
         if (!this.getConfig(CONFIG_TRACK_SUBMIT)) {
@@ -3855,7 +3838,7 @@ Autocapture.prototype.initPageLeaveTracking = function() {
         return;
     }
 
-    logger$4.log('Initializing page visibility tracking.');
+    logger$5.log('Initializing page visibility tracking.');
     this._initScrollDepthTracking();
     var previousTrackedUrl = _.info.currentUrl();
 
@@ -3940,7 +3923,7 @@ var getTargetingPromise = function(loadExtraBundle, targetingSrc) {
     return win[TARGETING_GLOBAL_NAME];
 };
 
-var logger$3 = console_with_prefix('flags');
+var logger$4 = console_with_prefix('flags');
 var FLAGS_CONFIG_KEY = 'flags';
 
 var CONFIG_CONTEXT = 'context';
@@ -3983,7 +3966,7 @@ var FeatureFlagManager = function(initOptions) {
 
 FeatureFlagManager.prototype.init = function() {
     if (!this.minApisSupported()) {
-        logger$3.critical('Feature Flags unavailable: missing minimum required APIs');
+        logger$4.critical('Feature Flags unavailable: missing minimum required APIs');
         return;
     }
 
@@ -4018,7 +4001,7 @@ FeatureFlagManager.prototype.isSystemEnabled = function() {
 
 FeatureFlagManager.prototype.updateContext = function(newContext, options) {
     if (!this.isSystemEnabled()) {
-        logger$3.critical('Feature Flags not enabled, cannot update context');
+        logger$4.critical('Feature Flags not enabled, cannot update context');
         return Promise.resolve();
     }
 
@@ -4035,7 +4018,7 @@ FeatureFlagManager.prototype.updateContext = function(newContext, options) {
 
 FeatureFlagManager.prototype.areFlagsReady = function() {
     if (!this.isSystemEnabled()) {
-        logger$3.error('Feature Flags not enabled');
+        logger$4.error('Feature Flags not enabled');
     }
     return !!this.flags;
 };
@@ -4048,7 +4031,7 @@ FeatureFlagManager.prototype.fetchFlags = function() {
     var distinctId = this.getMpProperty('distinct_id');
     var deviceId = this.getMpProperty('$device_id');
     var traceparent = generateTraceparent();
-    logger$3.log('Fetching flags for distinct ID: ' + distinctId);
+    logger$4.log('Fetching flags for distinct ID: ' + distinctId);
 
     var context = _.extend({'distinct_id': distinctId, 'device_id': deviceId}, this.getConfig(CONFIG_CONTEXT));
     var searchParams = new URLSearchParams();
@@ -4147,11 +4130,11 @@ FeatureFlagManager.prototype.fetchFlags = function() {
             this._loadTargetingIfNeeded();
         }.bind(this)).catch(function(error) {
             this.markFetchComplete();
-            logger$3.error(error);
+            logger$4.error(error);
         }.bind(this));
     }.bind(this)).catch(function(error) {
         this.markFetchComplete();
-        logger$3.error(error);
+        logger$4.error(error);
     }.bind(this));
 
     return this.fetchPromise;
@@ -4159,7 +4142,7 @@ FeatureFlagManager.prototype.fetchFlags = function() {
 
 FeatureFlagManager.prototype.markFetchComplete = function() {
     if (!this._fetchInProgressStartTime) {
-        logger$3.error('Fetch in progress started time not set, cannot mark fetch complete');
+        logger$4.error('Fetch in progress started time not set, cannot mark fetch complete');
         return;
     }
     this._fetchStartTime = this._fetchInProgressStartTime;
@@ -4181,7 +4164,7 @@ FeatureFlagManager.prototype._loadTargetingIfNeeded = function() {
 
     if (hasPropertyFilters) {
         this.getTargeting().then(function() {
-            logger$3.log('targeting loaded for property filter evaluation');
+            logger$4.log('targeting loaded for property filter evaluation');
         });
     }
 };
@@ -4196,7 +4179,7 @@ FeatureFlagManager.prototype.getTargeting = function() {
         this.loadExtraBundle.bind(this),
         this.targetingSrc
     ).catch(function(error) {
-        logger$3.error('Failed to load targeting: ' + error);
+        logger$4.error('Failed to load targeting: ' + error);
     }.bind(this));
 };
 
@@ -4250,7 +4233,7 @@ FeatureFlagManager.prototype._processFirstTimeEventCheck = function(eventName, p
 
         // If no targeting library and event has property filters, skip it
         if (!targeting && pendingEvent['property_filters'] && !_.isEmptyObject(pendingEvent['property_filters'])) {
-            logger$3.warn('Skipping event check for "' + flagKey + '" - property filters require targeting library');
+            logger$4.warn('Skipping event check for "' + flagKey + '" - property filters require targeting library');
             return;
         }
 
@@ -4273,7 +4256,7 @@ FeatureFlagManager.prototype._processFirstTimeEventCheck = function(eventName, p
         }
 
         if (matchResult.error) {
-            logger$3.error('Error checking first-time event for flag "' + flagKey + '": ' + matchResult.error);
+            logger$4.error('Error checking first-time event for flag "' + flagKey + '": ' + matchResult.error);
             return;
         }
 
@@ -4281,7 +4264,7 @@ FeatureFlagManager.prototype._processFirstTimeEventCheck = function(eventName, p
             return;
         }
 
-        logger$3.log('First-time event matched for flag "' + flagKey + '": ' + eventName);
+        logger$4.log('First-time event matched for flag "' + flagKey + '": ' + eventName);
 
         var newVariant = {
             'key': pendingEvent['pending_variant']['variant_key'],
@@ -4322,7 +4305,7 @@ FeatureFlagManager.prototype.recordFirstTimeEvent = function(flagId, projectId,
         'first_time_event_hash': firstTimeEventHash
     };
 
-    logger$3.log('Recording first-time event for flag: ' + flagId);
+    logger$4.log('Recording first-time event for flag: ' + flagId);
 
     // Fire-and-forget POST request
     this.fetch.call(win, url, {
@@ -4335,14 +4318,14 @@ FeatureFlagManager.prototype.recordFirstTimeEvent = function(flagId, projectId,
         'body': JSON.stringify(payload)
     }).catch(function(error) {
         // Silent failure - cohort sync will catch up
-        logger$3.error('Failed to record first-time event for flag ' + flagId + ': ' + error);
+        logger$4.error('Failed to record first-time event for flag ' + flagId + ': ' + error);
     });
 };
 
 FeatureFlagManager.prototype.getVariant = function(featureName, fallback) {
     if (!this.fetchPromise) {
         return new Promise(function(resolve) {
-            logger$3.critical('Feature Flags not initialized');
+            logger$4.critical('Feature Flags not initialized');
             resolve(fallback);
         });
     }
@@ -4350,19 +4333,19 @@ FeatureFlagManager.prototype.getVariant = function(featureName, fallback) {
     return this.fetchPromise.then(function() {
         return this.getVariantSync(featureName, fallback);
     }.bind(this)).catch(function(error) {
-        logger$3.error(error);
+        logger$4.error(error);
         return fallback;
     });
 };
 
 FeatureFlagManager.prototype.getVariantSync = function(featureName, fallback) {
     if (!this.areFlagsReady()) {
-        logger$3.log('Flags not loaded yet');
+        logger$4.log('Flags not loaded yet');
         return fallback;
     }
     var feature = this.flags.get(featureName);
     if (!feature) {
-        logger$3.log('No flag found: "' + featureName + '"');
+        logger$4.log('No flag found: "' + featureName + '"');
         return fallback;
     }
     this.trackFeatureCheck(featureName, feature);
@@ -4373,14 +4356,14 @@ FeatureFlagManager.prototype.getVariantValue = function(featureName, fallbackVal
     return this.getVariant(featureName, {'value': fallbackValue}).then(function(feature) {
         return feature['value'];
     }).catch(function(error) {
-        logger$3.error(error);
+        logger$4.error(error);
         return fallbackValue;
     });
 };
 
 // TODO remove deprecated method
 FeatureFlagManager.prototype.getFeatureData = function(featureName, fallbackValue) {
-    logger$3.critical('mixpanel.flags.get_feature_data() is deprecated and will be removed in a future release. Use mixpanel.flags.get_variant_value() instead.');
+    logger$4.critical('mixpanel.flags.get_feature_data() is deprecated and will be removed in a future release. Use mixpanel.flags.get_variant_value() instead.');
     return this.getVariantValue(featureName, fallbackValue);
 };
 
@@ -4392,7 +4375,7 @@ FeatureFlagManager.prototype.isEnabled = function(featureName, fallbackValue) {
     return this.getVariantValue(featureName).then(function() {
         return this.isEnabledSync(featureName, fallbackValue);
     }.bind(this)).catch(function(error) {
-        logger$3.error(error);
+        logger$4.error(error);
         return fallbackValue;
     });
 };
@@ -4401,7 +4384,7 @@ FeatureFlagManager.prototype.isEnabledSync = function(featureName, fallbackValue
     fallbackValue = fallbackValue || false;
     var val = this.getVariantValueSync(featureName, fallbackValue);
     if (val !== true && val !== false) {
-        logger$3.error('Feature flag "' + featureName + '" value: ' + val + ' is not a boolean; returning fallback value: ' + fallbackValue);
+        logger$4.error('Feature flag "' + featureName + '" value: ' + val + ' is not a boolean; returning fallback value: ' + fallbackValue);
         val = fallbackValue;
     }
     return val;
@@ -4460,143 +4443,618 @@ FeatureFlagManager.prototype['get_feature_data'] = FeatureFlagManager.prototype.
 // Exports intended only for testing
 FeatureFlagManager.prototype['getTargeting'] = FeatureFlagManager.prototype.getTargeting;
 
-/* eslint camelcase: "off" */
+var MIXPANEL_DB_NAME = 'mixpanelBrowserDb';
+
+var RECORDING_EVENTS_STORE_NAME = 'mixpanelRecordingEvents';
+var RECORDING_REGISTRY_STORE_NAME = 'mixpanelRecordingRegistry';
 
+// note: increment the version number when adding new object stores
+var DB_VERSION = 1;
+var OBJECT_STORES = [RECORDING_EVENTS_STORE_NAME, RECORDING_REGISTRY_STORE_NAME];
 
 /**
- * DomTracker Object
- * @constructor
+ * @type {import('./wrapper').StorageWrapper}
  */
-var DomTracker = function() {};
+var IDBStorageWrapper = function (storeName) {
+    /**
+     * @type {Promise<IDBDatabase>|null}
+     */
+    this.dbPromise = null;
+    this.storeName = storeName;
+};
+
+IDBStorageWrapper.prototype._openDb = function () {
+    return new PromisePolyfill(function (resolve, reject) {
+        var openRequest = win.indexedDB.open(MIXPANEL_DB_NAME, DB_VERSION);
+        openRequest['onerror'] = function () {
+            reject(openRequest.error);
+        };
 
+        openRequest['onsuccess'] = function () {
+            resolve(openRequest.result);
+        };
 
-// interface
-DomTracker.prototype.create_properties = function() {};
-DomTracker.prototype.event_handler = function() {};
-DomTracker.prototype.after_track_handler = function() {};
+        openRequest['onupgradeneeded'] = function (ev) {
+            var db = ev.target.result;
 
-DomTracker.prototype.init = function(mixpanel_instance) {
-    this.mp = mixpanel_instance;
-    return this;
+            OBJECT_STORES.forEach(function (storeName) {
+                db.createObjectStore(storeName);
+            });
+        };
+    });
 };
 
-/**
- * @param {Object|string} query
- * @param {string} event_name
- * @param {Object=} properties
- * @param {function=} user_callback
- */
-DomTracker.prototype.track = function(query, event_name, properties, user_callback) {
-    var that = this;
-    var elements = _.dom_query(query);
-
-    if (elements.length === 0) {
-        console.error('The DOM query (' + query + ') returned 0 elements');
-        return;
+IDBStorageWrapper.prototype.init = function () {
+    if (!win.indexedDB) {
+        return PromisePolyfill.reject('indexedDB is not supported in this browser');
     }
 
-    _.each(elements, function(element) {
-        _.register_event(element, this.override_event, function(e) {
-            var options = {};
-            var props = that.create_properties(properties, this);
-            var timeout = that.mp.get_config('track_links_timeout');
-
-            that.event_handler(e, this, options);
-
-            // in case the mixpanel servers don't get back to us in time
-            window.setTimeout(that.track_callback(user_callback, props, options, true), timeout);
+    if (!this.dbPromise) {
+        this.dbPromise = this._openDb();
+    }
 
-            // fire the tracking event
-            that.mp.track(event_name, props, that.track_callback(user_callback, props, options));
+    return this.dbPromise
+        .then(function (dbOrError) {
+            if (dbOrError instanceof win['IDBDatabase']) {
+                return PromisePolyfill.resolve();
+            } else {
+                return PromisePolyfill.reject(dbOrError);
+            }
         });
-    }, this);
+};
 
-    return true;
+IDBStorageWrapper.prototype.isInitialized = function () {
+    return !!this.dbPromise;
 };
 
 /**
- * @param {function} user_callback
- * @param {Object} props
- * @param {boolean=} timeout_occured
+ * @param {IDBTransactionMode} mode
+ * @param {function(IDBObjectStore): void} storeCb
  */
-DomTracker.prototype.track_callback = function(user_callback, props, options, timeout_occured) {
-    timeout_occured = timeout_occured || false;
-    var that = this;
+IDBStorageWrapper.prototype.makeTransaction = function (mode, storeCb) {
+    var storeName = this.storeName;
+    var doTransaction = function (db) {
+        return new PromisePolyfill(function (resolve, reject) {
+            var transaction = db.transaction(storeName, mode);
+            transaction.oncomplete = function () {
+                resolve(transaction);
+            };
+            transaction.onabort = transaction.onerror = function () {
+                reject(transaction.error);
+            };
 
-    return function() {
-        // options is referenced from both callbacks, so we can have
-        // a 'lock' of sorts to ensure only one fires
-        if (options.callback_fired) { return; }
-        options.callback_fired = true;
+            storeCb(transaction.objectStore(storeName));
+        });
+    };
 
-        if (user_callback && user_callback(timeout_occured, props) === false) {
-            // user can prevent the default functionality by
-            // returning false from their callback
-            return;
-        }
+    return this.dbPromise
+        .then(doTransaction)
+        .catch(function (err) {
+            if (err && err['name'] === 'InvalidStateError') {
+                // try reopening the DB if the connection is closed
+                this.dbPromise = this._openDb();
+                return this.dbPromise.then(doTransaction);
+            } else {
+                return PromisePolyfill.reject(err);
+            }
+        }.bind(this));
+};
 
-        that.after_track_handler(props, options, timeout_occured);
-    };
+IDBStorageWrapper.prototype.setItem = function (key, value) {
+    return this.makeTransaction('readwrite', function (objectStore) {
+        objectStore.put(value, key);
+    });
 };
 
-DomTracker.prototype.create_properties = function(properties, element) {
-    var props;
+IDBStorageWrapper.prototype.getItem = function (key) {
+    var req;
+    return this.makeTransaction('readonly', function (objectStore) {
+        req = objectStore.get(key);
+    }).then(function () {
+        return req.result;
+    });
+};
 
-    if (typeof(properties) === 'function') {
-        props = properties(element);
-    } else {
-        props = _.extend({}, properties);
-    }
+IDBStorageWrapper.prototype.removeItem = function (key) {
+    return this.makeTransaction('readwrite', function (objectStore) {
+        objectStore.delete(key);
+    });
+};
 
-    return props;
+IDBStorageWrapper.prototype.getAll = function () {
+    var req;
+    return this.makeTransaction('readonly', function (objectStore) {
+        req = objectStore.getAll();
+    }).then(function () {
+        return req.result;
+    });
 };
 
 /**
- * LinkTracker Object
- * @constructor
- * @extends DomTracker
+ * @param {import('./session-recording').SerializedRecording} serializedRecording
+ * @returns {boolean}
  */
-var LinkTracker = function() {
-    this.override_event = 'click';
+var isRecordingExpired = function(serializedRecording) {
+    var now = Date.now();
+    return !serializedRecording || now > serializedRecording['maxExpires'] || now > serializedRecording['idleExpires'];
 };
-_.inherit(LinkTracker, DomTracker);
-
-LinkTracker.prototype.create_properties = function(properties, element) {
-    var props = LinkTracker.superclass.create_properties.apply(this, arguments);
-
-    if (element.href) { props['url'] = element.href; }
 
-    return props;
+var validateAllowedOrigins = function(origins, logger) {
+    if (!_.isArray(origins)) {
+        if (origins) {
+            logger.critical('record_allowed_iframe_origins must be an array of origin strings, cross-origin recording will be disabled.');
+        }
+        return [];
+    }
+    var valid = [];
+    for (var i = 0; i < origins.length; i++) {
+        try {
+            var origin = new URL(origins[i]).origin;
+            if (origin === 'null') {
+                logger.critical(origins[i] + ' has an opaque origin. Skipping this entry.');
+                continue;
+            }
+            valid.push(origin);
+        } catch (e) {
+            logger.critical(origins[i] + ' is not a valid origin URL. Skipping this entry.');
+        }
+    }
+    return valid;
 };
 
-LinkTracker.prototype.event_handler = function(evt, element, options) {
-    options.new_tab = (
-        evt.which === 2 ||
-        evt.metaKey ||
-        evt.ctrlKey ||
-        element.target === '_blank'
-    );
-    options.href = element.href;
+/* eslint camelcase: "off" */
 
-    if (!options.new_tab) {
-        evt.preventDefault();
-    }
-};
 
-LinkTracker.prototype.after_track_handler = function(props, options) {
-    if (options.new_tab) { return; }
+var logger$3 = console_with_prefix('recorder');
+
+var IFRAME_HANDSHAKE_REQUEST  = 'mp_iframe_handshake_request';
+var IFRAME_HANDSHAKE_RESPONSE = 'mp_iframe_handshake_response';
 
-    setTimeout(function() {
-        window.location = options.href;
-    }, 0);
-};
 
 /**
- * FormTracker Object
+ * RecorderManager: manages session recording initialization, lifecycle and state
  * @constructor
- * @extends DomTracker
  */
-var FormTracker = function() {
+var RecorderManager = function(initOptions) {
+    // TODO - Passing in mixpanel instance as it is still needed for recorder creation
+    // but ideally we should be able to remove this dependency.
+    this.mixpanelInstance = initOptions.mixpanelInstance;
+
+    this.getMpConfig = initOptions.getConfigFunc;
+    this.getTabId = initOptions.getTabIdFunc;
+    this.reportError = initOptions.reportErrorFunc;
+    this.getDistinctId = initOptions.getDistinctIdFunc;
+    this.loadExtraBundle = initOptions.loadExtraBundle;
+    this.recorderSrc = initOptions.recorderSrc;
+    this.targetingSrc = initOptions.targetingSrc;
+    this.libBasePath = initOptions.libBasePath;
+
+    this._recorder = null;
+    this._parentReplayId = null;
+    this._parentFrameRetryInterval = null;
+};
+
+RecorderManager.prototype.shouldLoadRecorder = function() {
+    if (this.getMpConfig('disable_persistence')) {
+        console.log('Load recorder check skipped due to disable_persistence config');
+        return PromisePolyfill.resolve(false);
+    }
+
+    var recording_registry_idb = new IDBStorageWrapper(RECORDING_REGISTRY_STORE_NAME);
+    var tab_id = this.getTabId();
+    return recording_registry_idb.init()
+        .then(function () {
+            return recording_registry_idb.getAll();
+        })
+        .then(function (recordings) {
+            for (var i = 0; i < recordings.length; i++) {
+                // if there are expired recordings in the registry, we should load the recorder to flush them
+                // if there's a recording for this tab id, we should load the recorder to continue the recording
+                if (isRecordingExpired(recordings[i]) || recordings[i]['tabId'] === tab_id) {
+                    return true;
+                }
+            }
+            return false;
+        })
+        .catch(_.bind(function (err) {
+            this.reportError('Error checking recording registry', err);
+            return false;
+        }, this));
+};
+
+RecorderManager.prototype.checkAndStartSessionRecording = function(force_start, rate) {
+    if (!win['MutationObserver']) {
+        console.critical('Browser does not support MutationObserver; skipping session recording');
+        return PromisePolyfill.resolve();
+    }
+
+    var loadRecorder = _.bind(function(startNewIfInactive) {
+        return new PromisePolyfill(_.bind(function(resolve) {
+            var handleLoadedRecorder = safewrap(_.bind(function() {
+                this._recorder = this._recorder || new win[RECORDER_GLOBAL_NAME](this.mixpanelInstance);
+                this._recorder['resumeRecording'](startNewIfInactive);
+                resolve();
+            }, this));
+
+            if (_.isUndefined(win[RECORDER_GLOBAL_NAME])) {
+                var recorderSrc = this.recorderSrc || (this.libBasePath + RECORDER_FILENAME);
+                this.loadExtraBundle(recorderSrc, handleLoadedRecorder);
+            } else {
+                handleLoadedRecorder();
+            }
+        }, this));
+    }, this);
+
+    // Cross-origin iframe handling
+    var allowedOrigins = validateAllowedOrigins(this.getMpConfig('record_allowed_iframe_origins'), logger$3);
+    var isCrossOriginRecordingEnabled = allowedOrigins.length > 0;
+
+    if (isCrossOriginRecordingEnabled) {
+        // listen for handshake requests from their own child iframes (including nested)
+        this._setupParentFrameListener(allowedOrigins);
+
+        if (win.parent !== win) {
+            // also wait for parent's replay ID
+            this._setupChildFrameListener(allowedOrigins, loadRecorder);
+            this._sendParentFrameRequestWithRetry(allowedOrigins);
+            return PromisePolyfill.resolve();
+        }
+    }
+
+    /**
+     * If the user is sampled or start_session_recording is called, we always load the recorder since it's guaranteed a recording should start.
+     * Otherwise, if the recording registry has any records then it's likely there's a recording in progress or orphaned data that needs to be flushed.
+     */
+    var effective_rate = _.isUndefined(rate) ? this.getMpConfig('record_sessions_percent') : rate;
+    var is_sampled = effective_rate > 0 && Math.random() * 100 <= effective_rate;
+    if (force_start || is_sampled) {
+        return loadRecorder(true);
+    } else {
+        return this.shouldLoadRecorder()
+            .then(_.bind(function (shouldLoad) {
+                if (shouldLoad) {
+                    return loadRecorder(false);
+                }
+                return PromisePolyfill.resolve();
+            }, this));
+    }
+};
+
+RecorderManager.prototype.isRecording = function() {
+    // Safety check: ensure isRecording method exists (older CDN builds may not have it)
+    if (!this._recorder || !_.isFunction(this._recorder['isRecording'])) {
+        return false;
+    }
+    try {
+        return this._recorder['isRecording']();
+    } catch (e) {
+        this.reportError('Error checking if recording is active', e);
+        return false;
+    }
+};
+
+RecorderManager.prototype.startRecordingOnEvent = function(event_name, properties) {
+    var isRecording = this.isRecording();
+    var recordingTriggerEvents = this.getMpConfig('recording_event_triggers');
+
+    if (!isRecording && recordingTriggerEvents) {
+        var trigger = recordingTriggerEvents[event_name];
+        if (trigger && typeof trigger['percentage'] === 'number') {
+            var newRate = trigger['percentage'];
+            var propertyFilters = trigger['property_filters'];
+            if (propertyFilters && !_.isEmptyObject(propertyFilters)) {
+                var targetingSrc = this.targetingSrc || (this.libBasePath + TARGETING_FILENAME);
+                getTargetingPromise(this.loadExtraBundle, targetingSrc)
+                    .then(function(targeting) {
+                        try {
+                            var result = targeting['eventMatchesCriteria'](
+                                event_name,
+                                properties,
+                                {
+                                    'event_name': event_name,
+                                    'property_filters': propertyFilters
+                                }
+                            );
+                            if (result['matches']) {
+                                this.checkAndStartSessionRecording(false, newRate);
+                            }
+                        } catch (err) {
+                            console.critical('Could not parse recording event trigger properties logic:', err);
+                        }
+                    }.bind(this)).catch(function(err) {
+                        console.critical('Failed to load targeting library:', err);
+                    });
+            } else {
+                this.checkAndStartSessionRecording(false, newRate);
+            }
+        }
+    }
+};
+
+RecorderManager.prototype.stopSessionRecording = function() {
+    if (this._recorder) {
+        return this._recorder['stopRecording']();
+    }
+    return PromisePolyfill.resolve();
+};
+
+RecorderManager.prototype.pauseSessionRecording = function() {
+    if (this._recorder) {
+        return this._recorder['pauseRecording']();
+    }
+    return PromisePolyfill.resolve();
+};
+
+RecorderManager.prototype.resumeSessionRecording = function() {
+    if (this._recorder) {
+        return this._recorder['resumeRecording']();
+    }
+    return PromisePolyfill.resolve();
+};
+
+RecorderManager.prototype.isRecordingHeatmapData = function() {
+    return this.getSessionReplayId() && this.getMpConfig('record_heatmap_data');
+};
+
+RecorderManager.prototype.getSessionRecordingProperties = function() {
+    var props = {};
+    var replay_id = this.getSessionReplayId();
+    if (replay_id) {
+        props['$mp_replay_id'] = replay_id;
+    }
+    return props;
+};
+
+RecorderManager.prototype.getSessionReplayUrl = function() {
+    var replay_url = null;
+    var replay_id = this.getSessionReplayId();
+    if (replay_id) {
+        var query_params = _.HTTPBuildQuery({
+            'replay_id': replay_id,
+            'distinct_id': this.getDistinctId(),
+            'token': this.getMpConfig('token')
+        });
+        replay_url = 'https://mixpanel.com/projects/replay-redirect?' + query_params;
+    }
+    return replay_url;
+};
+
+RecorderManager.prototype.getSessionReplayId = function() {
+    // Child iframe uses parent's replay ID
+    if (this._parentReplayId) {
+        return this._parentReplayId;
+    }
+    var replay_id = null;
+    if (this._recorder) {
+        replay_id = this._recorder['replayId'];
+    }
+    return replay_id || null;
+};
+
+// "private" public method to reach into the recorder in test cases
+RecorderManager.prototype.getRecorder = function() {
+    return this._recorder;
+};
+
+RecorderManager.prototype._setupChildFrameListener = function(allowedOrigins, loadRecorder) {
+    if (this._childFrameMessageHandler) {
+        return;
+    }
+    var self = this;
+    this._childFrameMessageHandler = function(event) {
+        if (allowedOrigins.indexOf(event.origin) === -1) return;
+        var data = event.data;
+        if (data && data['type'] === IFRAME_HANDSHAKE_RESPONSE && data['token'] === self.getMpConfig('token') && data['replayId']) {
+            self._parentReplayId = data['replayId'];
+            if (data['distinctId']) {
+                self.mixpanelInstance['identify'](data['distinctId']);
+            }
+            self._parentFrameRetryActive = false;
+            win.removeEventListener('message', self._childFrameMessageHandler);
+            self._childFrameMessageHandler = null;
+            loadRecorder(true);
+        }
+    };
+    win.addEventListener('message', this._childFrameMessageHandler);
+};
+
+RecorderManager.prototype._sendParentFrameRequest = function(allowedOrigins) {
+    var message = {};
+    message['type'] = IFRAME_HANDSHAKE_REQUEST;
+    message['token'] = this.getMpConfig('token');
+    for (var i = 0; i < allowedOrigins.length; i++) {
+        try {
+            win.parent.postMessage(message, allowedOrigins[i]);
+        } catch (e) {
+            // origin mismatch - ignore
+        }
+    }
+};
+
+RecorderManager.prototype._sendParentFrameRequestWithRetry = function(allowedOrigins) {
+    var self = this;
+    var maxRetries = 10;
+    var retryCount = 0;
+    var delay = 50;
+    this._parentFrameRetryActive = true;
+
+    this._sendParentFrameRequest(allowedOrigins);
+
+    function scheduleRetry() {
+        setTimeout(function() {
+            if (!self._parentFrameRetryActive || self._parentReplayId || ++retryCount >= maxRetries) {
+                return;
+            }
+            self._sendParentFrameRequest(allowedOrigins);
+            delay *= 2;
+            scheduleRetry();
+        }, delay);
+    }
+    scheduleRetry();
+};
+
+RecorderManager.prototype._setupParentFrameListener = function(allowedOrigins) {
+    if (this._parentFrameMessageHandler) {
+        return;
+    }
+    var self = this;
+    this._parentFrameMessageHandler = function(event) {
+        if (allowedOrigins.indexOf(event.origin) === -1) return;
+        var data = event.data;
+        if (data && data['type'] === IFRAME_HANDSHAKE_REQUEST && data['token'] === self.getMpConfig('token')) {
+            var replayId = self.getSessionReplayId();
+            if (replayId) {
+                var response = {};
+                response['type'] = IFRAME_HANDSHAKE_RESPONSE;
+                response['token'] = self.getMpConfig('token');
+                response['replayId'] = replayId;
+                response['distinctId'] = self.getDistinctId();
+                event.source.postMessage(response, event.origin);
+            }
+        }
+    };
+    win.addEventListener('message', this._parentFrameMessageHandler);
+};
+
+safewrapClass(RecorderManager);
+
+/* eslint camelcase: "off" */
+
+
+/**
+ * DomTracker Object
+ * @constructor
+ */
+var DomTracker = function() {};
+
+
+// interface
+DomTracker.prototype.create_properties = function() {};
+DomTracker.prototype.event_handler = function() {};
+DomTracker.prototype.after_track_handler = function() {};
+
+DomTracker.prototype.init = function(mixpanel_instance) {
+    this.mp = mixpanel_instance;
+    return this;
+};
+
+/**
+ * @param {Object|string} query
+ * @param {string} event_name
+ * @param {Object=} properties
+ * @param {function=} user_callback
+ */
+DomTracker.prototype.track = function(query, event_name, properties, user_callback) {
+    var that = this;
+    var elements = _.dom_query(query);
+
+    if (elements.length === 0) {
+        console.error('The DOM query (' + query + ') returned 0 elements');
+        return;
+    }
+
+    _.each(elements, function(element) {
+        _.register_event(element, this.override_event, function(e) {
+            var options = {};
+            var props = that.create_properties(properties, this);
+            var timeout = that.mp.get_config('track_links_timeout');
+
+            that.event_handler(e, this, options);
+
+            // in case the mixpanel servers don't get back to us in time
+            window.setTimeout(that.track_callback(user_callback, props, options, true), timeout);
+
+            // fire the tracking event
+            that.mp.track(event_name, props, that.track_callback(user_callback, props, options));
+        });
+    }, this);
+
+    return true;
+};
+
+/**
+ * @param {function} user_callback
+ * @param {Object} props
+ * @param {boolean=} timeout_occured
+ */
+DomTracker.prototype.track_callback = function(user_callback, props, options, timeout_occured) {
+    timeout_occured = timeout_occured || false;
+    var that = this;
+
+    return function() {
+        // options is referenced from both callbacks, so we can have
+        // a 'lock' of sorts to ensure only one fires
+        if (options.callback_fired) { return; }
+        options.callback_fired = true;
+
+        if (user_callback && user_callback(timeout_occured, props) === false) {
+            // user can prevent the default functionality by
+            // returning false from their callback
+            return;
+        }
+
+        that.after_track_handler(props, options, timeout_occured);
+    };
+};
+
+DomTracker.prototype.create_properties = function(properties, element) {
+    var props;
+
+    if (typeof(properties) === 'function') {
+        props = properties(element);
+    } else {
+        props = _.extend({}, properties);
+    }
+
+    return props;
+};
+
+/**
+ * LinkTracker Object
+ * @constructor
+ * @extends DomTracker
+ */
+var LinkTracker = function() {
+    this.override_event = 'click';
+};
+_.inherit(LinkTracker, DomTracker);
+
+LinkTracker.prototype.create_properties = function(properties, element) {
+    var props = LinkTracker.superclass.create_properties.apply(this, arguments);
+
+    if (element.href) { props['url'] = element.href; }
+
+    return props;
+};
+
+LinkTracker.prototype.event_handler = function(evt, element, options) {
+    options.new_tab = (
+        evt.which === 2 ||
+        evt.metaKey ||
+        evt.ctrlKey ||
+        element.target === '_blank'
+    );
+    options.href = element.href;
+
+    if (!options.new_tab) {
+        evt.preventDefault();
+    }
+};
+
+LinkTracker.prototype.after_track_handler = function(props, options) {
+    if (options.new_tab) { return; }
+
+    setTimeout(function() {
+        window.location = options.href;
+    }, 0);
+};
+
+/**
+ * FormTracker Object
+ * @constructor
+ * @extends DomTracker
+ */
+var FormTracker = function() {
     this.override_event = 'submit';
 };
 _.inherit(FormTracker, DomTracker);
@@ -6981,133 +7439,6 @@ MixpanelPersistence.prototype.remove_event_timer = function(event_name) {
     return timestamp;
 };
 
-var MIXPANEL_DB_NAME = 'mixpanelBrowserDb';
-
-var RECORDING_EVENTS_STORE_NAME = 'mixpanelRecordingEvents';
-var RECORDING_REGISTRY_STORE_NAME = 'mixpanelRecordingRegistry';
-
-// note: increment the version number when adding new object stores
-var DB_VERSION = 1;
-var OBJECT_STORES = [RECORDING_EVENTS_STORE_NAME, RECORDING_REGISTRY_STORE_NAME];
-
-/**
- * @type {import('./wrapper').StorageWrapper}
- */
-var IDBStorageWrapper = function (storeName) {
-    /**
-     * @type {Promise<IDBDatabase>|null}
-     */
-    this.dbPromise = null;
-    this.storeName = storeName;
-};
-
-IDBStorageWrapper.prototype._openDb = function () {
-    return new PromisePolyfill(function (resolve, reject) {
-        var openRequest = win.indexedDB.open(MIXPANEL_DB_NAME, DB_VERSION);
-        openRequest['onerror'] = function () {
-            reject(openRequest.error);
-        };
-
-        openRequest['onsuccess'] = function () {
-            resolve(openRequest.result);
-        };
-
-        openRequest['onupgradeneeded'] = function (ev) {
-            var db = ev.target.result;
-
-            OBJECT_STORES.forEach(function (storeName) {
-                db.createObjectStore(storeName);
-            });
-        };
-    });
-};
-
-IDBStorageWrapper.prototype.init = function () {
-    if (!win.indexedDB) {
-        return PromisePolyfill.reject('indexedDB is not supported in this browser');
-    }
-
-    if (!this.dbPromise) {
-        this.dbPromise = this._openDb();
-    }
-
-    return this.dbPromise
-        .then(function (dbOrError) {
-            if (dbOrError instanceof win['IDBDatabase']) {
-                return PromisePolyfill.resolve();
-            } else {
-                return PromisePolyfill.reject(dbOrError);
-            }
-        });
-};
-
-IDBStorageWrapper.prototype.isInitialized = function () {
-    return !!this.dbPromise;
-};
-
-/**
- * @param {IDBTransactionMode} mode
- * @param {function(IDBObjectStore): void} storeCb
- */
-IDBStorageWrapper.prototype.makeTransaction = function (mode, storeCb) {
-    var storeName = this.storeName;
-    var doTransaction = function (db) {
-        return new PromisePolyfill(function (resolve, reject) {
-            var transaction = db.transaction(storeName, mode);
-            transaction.oncomplete = function () {
-                resolve(transaction);
-            };
-            transaction.onabort = transaction.onerror = function () {
-                reject(transaction.error);
-            };
-
-            storeCb(transaction.objectStore(storeName));
-        });
-    };
-
-    return this.dbPromise
-        .then(doTransaction)
-        .catch(function (err) {
-            if (err && err['name'] === 'InvalidStateError') {
-                // try reopening the DB if the connection is closed
-                this.dbPromise = this._openDb();
-                return this.dbPromise.then(doTransaction);
-            } else {
-                return PromisePolyfill.reject(err);
-            }
-        }.bind(this));
-};
-
-IDBStorageWrapper.prototype.setItem = function (key, value) {
-    return this.makeTransaction('readwrite', function (objectStore) {
-        objectStore.put(value, key);
-    });
-};
-
-IDBStorageWrapper.prototype.getItem = function (key) {
-    var req;
-    return this.makeTransaction('readonly', function (objectStore) {
-        req = objectStore.get(key);
-    }).then(function () {
-        return req.result;
-    });
-};
-
-IDBStorageWrapper.prototype.removeItem = function (key) {
-    return this.makeTransaction('readwrite', function (objectStore) {
-        objectStore.delete(key);
-    });
-};
-
-IDBStorageWrapper.prototype.getAll = function () {
-    var req;
-    return this.makeTransaction('readonly', function (objectStore) {
-        req = objectStore.getAll();
-    }).then(function () {
-        return req.result;
-    });
-};
-
 /* eslint camelcase: "off" */
 
 /*
@@ -7151,7 +7482,6 @@ var INIT_SNIPPET = 1;
 /** @const */ var SETTING_FALLBACK      = 'fallback';
 /** @const */ var SETTING_DISABLED      = 'disabled';
 
-
 /*
  * Dynamic... constants? Is that an oxymoron?
  */
@@ -7236,19 +7566,24 @@ var DEFAULT_CONFIG = {
     'batch_request_timeout_ms':          90000,
     'batch_autostart':                   true,
     'hooks':                             {},
+    'record_allowed_iframe_origins':     [],
     'record_block_class':                new RegExp('^(mp-block|fs-exclude|amp-block|rr-block|ph-no-capture)$'),
     'record_block_selector':             'img, video, audio',
     'record_canvas':                     false,
     'record_collect_fonts':              false,
     'record_console':                    true,
     'record_heatmap_data':               false,
+    'recording_event_triggers':          {},
     'record_idle_timeout_ms':            30 * 60 * 1000, // 30 minutes
     'record_mask_inputs':                true,
     'record_max_ms':                     MAX_RECORDING_MS,
     'record_min_ms':                     0,
+    'record_network':                    false,
+    'record_network_options':            {},
     'record_sessions_percent':           0,
-    'recorder_src':                      'https://cdn.mxpnl.com/libs/mixpanel-recorder.min.js',
-    'targeting_src':                     'https://cdn.mxpnl.com/libs/mixpanel-targeting.min.js',
+    'recorder_src':                      null,
+    'targeting_src':                     null,
+    'lib_base_path':                     'https://cdn.mxpnl.com/libs/',
     'remote_settings_mode':              SETTING_DISABLED // 'strict', 'fallback', 'disabled'
 };
 
@@ -7402,6 +7737,19 @@ MixpanelLib.prototype._init = function(token, config, name) {
         'callback_fn': ((name === PRIMARY_INSTANCE_NAME) ? name : PRIMARY_INSTANCE_NAME + '.' + name) + '._jsc'
     }));
 
+    this.recorderManager = new RecorderManager({
+        mixpanelInstance: this,
+        getConfigFunc: _.bind(this.get_config, this),
+        setConfigFunc: _.bind(this.set_config, this),
+        getTabIdFunc: _.bind(this.get_tab_id, this),
+        reportErrorFunc: _.bind(this.report_error, this),
+        getDistinctIdFunc: _.bind(this.get_distinct_id, this),
+        recorderSrc: this.get_config('recorder_src'),
+        targetingSrc: this.get_config('targeting_src'),
+        libBasePath: this.get_config('lib_base_path'),
+        loadExtraBundle: load_extra_bundle
+    });
+
     this['_jsc'] = NOOP_FUNC;
 
     this.__dom_loaded_queue = [];
@@ -7480,7 +7828,7 @@ MixpanelLib.prototype._init = function(token, config, name) {
         getPropertyFunc: _.bind(this.get_property, this),
         trackingFunc: _.bind(this.track, this),
         loadExtraBundle: load_extra_bundle,
-        targetingSrc: this.get_config('targeting_src')
+        targetingSrc: this.get_config('targeting_src') || (this.get_config('lib_base_path') + TARGETING_FILENAME)
     });
     this.flags.init();
     this['flags'] = this.flags;
@@ -7493,11 +7841,11 @@ MixpanelLib.prototype._init = function(token, config, name) {
     // Based on remote_settings_mode, fetch remote settings and then start session recording if applicable
     var mode = this.get_config('remote_settings_mode');
     if (mode === SETTING_STRICT || mode === SETTING_FALLBACK) {
-        this._fetch_remote_settings(mode).then(_.bind(function() {
-            this._check_and_start_session_recording();
+        this.__session_recording_init_promise = this._fetch_remote_settings(mode).then(_.bind(function() {
+            return this._check_and_start_session_recording();
         }, this));
     } else {
-        this._check_and_start_session_recording();
+        this.__session_recording_init_promise = this._check_and_start_session_recording();
     }
 };
 
@@ -7541,132 +7889,50 @@ MixpanelLib.prototype.get_tab_id = function () {
     return this.tab_id || null;
 };
 
-MixpanelLib.prototype._should_load_recorder = function () {
-    if (this.get_config('disable_persistence')) {
-        console.log('Load recorder check skipped due to disable_persistence config');
-        return Promise.resolve(false);
-    }
-
-    var recording_registry_idb = new IDBStorageWrapper(RECORDING_REGISTRY_STORE_NAME);
-    var tab_id = this.get_tab_id();
-    return recording_registry_idb.init()
-        .then(function () {
-            return recording_registry_idb.getAll();
-        })
-        .then(function (recordings) {
-            for (var i = 0; i < recordings.length; i++) {
-                // if there are expired recordings in the registry, we should load the recorder to flush them
-                // if there's a recording for this tab id, we should load the recorder to continue the recording
-                if (isRecordingExpired(recordings[i]) || recordings[i]['tabId'] === tab_id) {
-                    return true;
-                }
-            }
-            return false;
-        })
-        .catch(_.bind(function (err) {
-            this.report_error('Error checking recording registry', err);
-        }, this));
-};
-
 MixpanelLib.prototype._check_and_start_session_recording = addOptOutCheckMixpanelLib(function(force_start) {
-    if (!win['MutationObserver']) {
-        console.critical('Browser does not support MutationObserver; skipping session recording');
-        return;
-    }
-
-    var loadRecorder = _.bind(function(startNewIfInactive) {
-        var handleLoadedRecorder = _.bind(function() {
-            this._recorder = this._recorder || new win[RECORDER_GLOBAL_NAME](this);
-            this._recorder['resumeRecording'](startNewIfInactive);
-        }, this);
-
-        if (_.isUndefined(win[RECORDER_GLOBAL_NAME])) {
-            load_extra_bundle(this.get_config('recorder_src'), handleLoadedRecorder);
-        } else {
-            handleLoadedRecorder();
-        }
-    }, this);
-
-    /**
-     * If the user is sampled or start_session_recording is called, we always load the recorder since it's guaranteed a recording should start.
-     * Otherwise, if the recording registry has any records then it's likely there's a recording in progress or orphaned data that needs to be flushed.
-     */
-    var is_sampled = this.get_config('record_sessions_percent') > 0 && Math.random() * 100 <= this.get_config('record_sessions_percent');
-    if (force_start || is_sampled) {
-        loadRecorder(true);
-    } else {
-        this._should_load_recorder()
-            .then(function (shouldLoad) {
-                if (shouldLoad) {
-                    loadRecorder(false);
-                }
-            });
-    }
+    return this.recorderManager.checkAndStartSessionRecording(force_start);
 });
 
+MixpanelLib.prototype._start_recording_on_event = function(event_name, properties) {
+    return this.recorderManager.startRecordingOnEvent(event_name, properties);
+};
+
 MixpanelLib.prototype.start_session_recording = function () {
-    this._check_and_start_session_recording(true);
+    return this._check_and_start_session_recording(true);
 };
 
 MixpanelLib.prototype.stop_session_recording = function () {
-    if (this._recorder) {
-        return this._recorder['stopRecording']();
-    }
-    return Promise.resolve();
+    return this.recorderManager.stopSessionRecording();
 };
 
 MixpanelLib.prototype.pause_session_recording = function () {
-    if (this._recorder) {
-        return this._recorder['pauseRecording']();
-    }
-    return Promise.resolve();
+    return this.recorderManager.pauseSessionRecording();
 };
 
 MixpanelLib.prototype.resume_session_recording = function () {
-    if (this._recorder) {
-        return this._recorder['resumeRecording']();
-    }
-    return Promise.resolve();
+    return this.recorderManager.resumeSessionRecording();
 };
 
 MixpanelLib.prototype.is_recording_heatmap_data = function () {
-    return this._get_session_replay_id() && this.get_config('record_heatmap_data');
+    return this.recorderManager.isRecordingHeatmapData();
 };
 
 MixpanelLib.prototype.get_session_recording_properties = function () {
-    var props = {};
-    var replay_id = this._get_session_replay_id();
-    if (replay_id) {
-        props['$mp_replay_id'] = replay_id;
-    }
-    return props;
+    return this.recorderManager.getSessionRecordingProperties();
 };
 
 MixpanelLib.prototype.get_session_replay_url = function () {
-    var replay_url = null;
-    var replay_id = this._get_session_replay_id();
-    if (replay_id) {
-        var query_params = _.HTTPBuildQuery({
-            'replay_id': replay_id,
-            'distinct_id': this.get_distinct_id(),
-            'token': this.get_config('token')
-        });
-        replay_url = 'https://mixpanel.com/projects/replay-redirect?' + query_params;
-    }
-    return replay_url;
-};
-
-MixpanelLib.prototype._get_session_replay_id = function () {
-    var replay_id = null;
-    if (this._recorder) {
-        replay_id = this._recorder['replayId'];
-    }
-    return replay_id || null;
+    return this.recorderManager.getSessionReplayUrl();
 };
 
 // "private" public method to reach into the recorder in test cases
 MixpanelLib.prototype.__get_recorder = function () {
-    return this._recorder;
+    return this.recorderManager.getRecorder();
+};
+
+// "private" public method to get session recording init promise in test cases
+MixpanelLib.prototype.__get_recording_init_promise = function () {
+    return this.__session_recording_init_promise;
 };
 
 // Private methods
@@ -7924,6 +8190,7 @@ MixpanelLib.prototype._send_request = function(url, data, options, callback) {
 };
 
 MixpanelLib.prototype._fetch_remote_settings = function(mode) {
+    var self = this;
     var disableRecordingIfStrict = function() {
         if (mode === 'strict') {
             self.set_config({'record_sessions_percent': 0});
@@ -7944,7 +8211,6 @@ MixpanelLib.prototype._fetch_remote_settings = function(mode) {
     };
     var query_string = _.HTTPBuildQuery(request_params);
     var full_url = settings_endpoint + '?' + query_string;
-    var self = this;
 
     var abortController = new AbortController();
     var timeout_id = setTimeout(function() {
@@ -8136,6 +8402,34 @@ MixpanelLib.prototype.push = function(item) {
     this._execute_array([item]);
 };
 
+/**
+ * Enables events on the Mixpanel object. If passed no arguments,
+ * this function enable tracking of all events. If passed an
+ * array of event names, those events will be enabled, but other
+ * existing disabled events will continue to be not tracked.
+ *
+ * @param {Array} [events] An array of event names to enable
+ */
+MixpanelLib.prototype.enable = function(events) {
+    var keys, new_disabled_events, i, j;
+
+    if (typeof(events) === 'undefined') {
+        this._flags.disable_all_events = false;
+    } else {
+        keys = {};
+        new_disabled_events = [];
+        for (i = 0; i < events.length; i++) {
+            keys[events[i]] = true;
+        }
+        for (j = 0; j < this.__disabled_events.length; j++) {
+            if (!keys[this.__disabled_events[j]]) {
+                new_disabled_events.push(this.__disabled_events[j]);
+            }
+        }
+        this.__disabled_events = new_disabled_events;
+    }
+};
+
 /**
  * Disable events on the Mixpanel object. If passed no arguments,
  * this function disables tracking of any event. If passed an
@@ -8309,6 +8603,8 @@ MixpanelLib.prototype.track = addOptOutCheckMixpanelLib(function(event_name, pro
         this.report_error('Invalid value for property_blacklist config: ' + property_blacklist);
     }
 
+    this._start_recording_on_event(event_name, properties);
+
     var data = {
         'event': event_name,
         'properties': properties
@@ -9517,6 +9813,7 @@ MixpanelLib.prototype.remove_hook = function(hook_name, hook_fn) {
 // MixpanelLib Exports
 MixpanelLib.prototype['init']                               = MixpanelLib.prototype.init;
 MixpanelLib.prototype['reset']                              = MixpanelLib.prototype.reset;
+MixpanelLib.prototype['enable']                             = MixpanelLib.prototype.enable;
 MixpanelLib.prototype['disable']                            = MixpanelLib.prototype.disable;
 MixpanelLib.prototype['time_event']                         = MixpanelLib.prototype.time_event;
 MixpanelLib.prototype['track']                              = MixpanelLib.prototype.track;
@@ -9560,6 +9857,7 @@ MixpanelLib.prototype['DEFAULT_API_ROUTES']                 = DEFAULT_API_ROUTES
 
 // Exports intended only for testing
 MixpanelLib.prototype['__get_recorder']                     = MixpanelLib.prototype.__get_recorder;
+MixpanelLib.prototype['__get_recording_init_promise']       = MixpanelLib.prototype.__get_recording_init_promise;
 
 // MixpanelPersistence Exports
 MixpanelPersistence.prototype['properties']            = MixpanelPersistence.prototype.properties;