mixpanel-browser 2.77.0 → 2.78.0

package/src/flags/index.js

@@ -53,7 +53,9 @@ FeatureFlagManager.prototype.init = function() {
     }
 
     this.flags = null;
-    this.fetchFlags();
+    this.fetchFlags().catch(function() {
+        logger.error('Error fetching flags during init');
+    });
 
     this.trackedFeatures = new Set();
     this.pendingFirstTimeEvents = {};
@@ -94,8 +96,12 @@ FeatureFlagManager.prototype.updateContext = function(newContext, options) {
     var oldContext = (options && options['replace']) ? {} : this.getConfig(CONFIG_CONTEXT);
     ffConfig[CONFIG_CONTEXT] = _.extend({}, oldContext, newContext);
 
-    this.setMpConfig(FLAGS_CONFIG_KEY, ffConfig);
-    return this.fetchFlags();
+    var configUpdate = {};
+    configUpdate[FLAGS_CONFIG_KEY] = ffConfig;
+    this.setMpConfig(configUpdate);
+    return this.fetchFlags().catch(function() {
+        logger.error('Error fetching flags during updateContext');
+    });
 };
 
 FeatureFlagManager.prototype.areFlagsReady = function() {
@@ -132,96 +138,110 @@ FeatureFlagManager.prototype.fetchFlags = function() {
         }
     }).then(function(response) {
         this.markFetchComplete();
-        return response.json().then(function(responseBody) {
-            var responseFlags = responseBody['flags'];
-            if (!responseFlags) {
-                throw new Error('No flags in API response');
-            }
-            var flags = new Map();
-            var pendingFirstTimeEvents = {};
-
-            // Process flags from response
-            _.each(responseFlags, function(data, key) {
-                // Check if this flag has any activated first-time events this session
-                var hasActivatedEvent = false;
-                var prefix = key + ':';
-                _.each(this.activatedFirstTimeEvents, function(activated, eventKey) {
-                    if (eventKey.startsWith(prefix)) {
-                        hasActivatedEvent = true;
-                    }
-                });
-
-                if (hasActivatedEvent) {
-                    // Preserve the activated variant, don't overwrite with server's current variant
-                    var currentFlag = this.flags && this.flags.get(key);
-                    if (currentFlag) {
-                        flags.set(key, currentFlag);
-                    }
-                } else {
-                    // Use server's current variant
-                    flags.set(key, {
-                        'key': data['variant_key'],
-                        'value': data['variant_value'],
-                        'experiment_id': data['experiment_id'],
-                        'is_experiment_active': data['is_experiment_active'],
-                        'is_qa_tester': data['is_qa_tester']
-                    });
+        return response.json();
+    }.bind(this)).then(function(responseBody) {
+        var responseFlags = responseBody['flags'];
+        if (!responseFlags) {
+            throw new Error('No flags in API response');
+        }
+        var flags = new Map();
+        var pendingFirstTimeEvents = {};
+
+        // Process flags from response
+        _.each(responseFlags, function(data, key) {
+            // Check if this flag has any activated first-time events this session
+            var hasActivatedEvent = false;
+            var prefix = key + ':';
+            _.each(this.activatedFirstTimeEvents, function(activated, eventKey) {
+                if (eventKey.startsWith(prefix)) {
+                    hasActivatedEvent = true;
                 }
-            }, this);
+            });
 
-            // Process top-level pending_first_time_events array
-            var topLevelDefinitions = responseBody['pending_first_time_events'];
-            if (topLevelDefinitions && topLevelDefinitions.length > 0) {
-                _.each(topLevelDefinitions, function(def) {
-                    var flagKey = def['flag_key'];
-                    var eventKey = getPendingEventKey(flagKey, def['first_time_event_hash']);
-
-                    // Skip if this specific event has already been activated this session
-                    if (this.activatedFirstTimeEvents[eventKey]) {
-                        return;
-                    }
-
-                    // Store pending event definition using composite key
-                    pendingFirstTimeEvents[eventKey] = {
-                        'flag_key': flagKey,
-                        'flag_id': def['flag_id'],
-                        'project_id': def['project_id'],
-                        'first_time_event_hash': def['first_time_event_hash'],
-                        'event_name': def['event_name'],
-                        'property_filters': def['property_filters'],
-                        'pending_variant': def['pending_variant']
-                    };
-                }, this);
+            if (hasActivatedEvent) {
+                // Preserve the activated variant, don't overwrite with server's current variant
+                var currentFlag = this.flags && this.flags.get(key);
+                if (currentFlag) {
+                    flags.set(key, currentFlag);
+                }
+            } else {
+                // Use server's current variant
+                flags.set(key, {
+                    'key': data['variant_key'],
+                    'value': data['variant_value'],
+                    'experiment_id': data['experiment_id'],
+                    'is_experiment_active': data['is_experiment_active'],
+                    'is_qa_tester': data['is_qa_tester']
+                });
             }
+        }, this);
+
+        // Process top-level pending_first_time_events array
+        var topLevelDefinitions = responseBody['pending_first_time_events'];
+        if (topLevelDefinitions && topLevelDefinitions.length > 0) {
+            _.each(topLevelDefinitions, function(def) {
+                var flagKey = def['flag_key'];
+                var eventKey = getPendingEventKey(flagKey, def['first_time_event_hash']);
+
+                // Skip if this specific event has already been activated this session
+                if (this.activatedFirstTimeEvents[eventKey]) {
+                    return;
+                }
 
-            // Preserve any activated orphaned flags (flags that were activated but are no longer in response)
-            if (this.activatedFirstTimeEvents) {
-                _.each(this.activatedFirstTimeEvents, function(activated, eventKey) {
-                    var flagKey = getFlagKeyFromPendingEventKey(eventKey);
-                    if (activated && !flags.has(flagKey) && this.flags && this.flags.has(flagKey)) {
-                        // Keep the activated flag even though it's not in the new response
-                        flags.set(flagKey, this.flags.get(flagKey));
-                    }
-                }, this);
-            }
+                // Store pending event definition using composite key
+                pendingFirstTimeEvents[eventKey] = {
+                    'flag_key': flagKey,
+                    'flag_id': def['flag_id'],
+                    'project_id': def['project_id'],
+                    'first_time_event_hash': def['first_time_event_hash'],
+                    'event_name': def['event_name'],
+                    'property_filters': def['property_filters'],
+                    'pending_variant': def['pending_variant']
+                };
+            }, this);
+        }
 
-            this.flags = flags;
-            this.pendingFirstTimeEvents = pendingFirstTimeEvents;
-            this._traceparent = traceparent;
+        // Preserve any activated orphaned flags (flags that were activated but are no longer in response)
+        if (this.activatedFirstTimeEvents) {
+            _.each(this.activatedFirstTimeEvents, function(activated, eventKey) {
+                var flagKey = getFlagKeyFromPendingEventKey(eventKey);
+                if (activated && !flags.has(flagKey) && this.flags && this.flags.has(flagKey)) {
+                    // Keep the activated flag even though it's not in the new response
+                    flags.set(flagKey, this.flags.get(flagKey));
+                }
+            }, this);
+        }
 
-            this._loadTargetingIfNeeded();
-        }.bind(this)).catch(function(error) {
-            this.markFetchComplete();
-            logger.error(error);
-        }.bind(this));
+        this.flags = flags;
+        this.pendingFirstTimeEvents = pendingFirstTimeEvents;
+        this._traceparent = traceparent;
+
+        this._loadTargetingIfNeeded();
     }.bind(this)).catch(function(error) {
-        this.markFetchComplete();
+        if (this._fetchInProgressStartTime) {
+            this.markFetchComplete();
+        }
         logger.error(error);
+        throw error;
     }.bind(this));
 
     return this.fetchPromise;
 };
 
+FeatureFlagManager.prototype.loadFlags = function() {
+    if (!this.isSystemEnabled()) {
+        return Promise.resolve();
+    }
+    if (!this.trackedFeatures) {
+        logger.error('loadFlags called before init');
+        return Promise.resolve();
+    }
+    if (this._fetchInProgressStartTime) {
+        return this.fetchPromise;
+    }
+    return this.fetchFlags();
+};
+
 FeatureFlagManager.prototype.markFetchComplete = function() {
     if (!this._fetchInProgressStartTime) {
         logger.error('Fetch in progress started time not set, cannot mark fetch complete');
@@ -501,6 +521,13 @@ FeatureFlagManager.prototype.trackFeatureCheck = function(featureName, feature)
     this.track('$experiment_started', trackingProperties);
 };
 
+FeatureFlagManager.prototype.whenReady = function() {
+    if (this.fetchPromise) {
+        return this.fetchPromise;
+    }
+    return Promise.resolve();
+};
+
 FeatureFlagManager.prototype.minApisSupported = function() {
     return !!this.fetch &&
       typeof Promise !== 'undefined' &&
@@ -517,7 +544,9 @@ FeatureFlagManager.prototype['get_variant_value'] = FeatureFlagManager.prototype
 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['load_flags'] = FeatureFlagManager.prototype.loadFlags;
 FeatureFlagManager.prototype['update_context'] = FeatureFlagManager.prototype.updateContext;
+FeatureFlagManager.prototype['when_ready'] = FeatureFlagManager.prototype.whenReady;
 
 // Deprecated method
 FeatureFlagManager.prototype['get_feature_data'] = FeatureFlagManager.prototype.getFeatureData;

package/src/index.d.ts

@@ -357,6 +357,7 @@ export interface FlagsUpdateContextOptions {
 
 export interface FlagsManager {
   are_flags_ready(): boolean;
+  load_flags(): Promise<void>;
   get_variant(
     featureName: string,
     fallback: FlagsVariant

package/src/mixpanel-core.js

@@ -1724,7 +1724,9 @@ MixpanelLib.prototype.identify = function(
 
     // check feature flags again if distinct id has changed
     if (new_distinct_id !== previous_distinct_id) {
-        this.flags.fetchFlags();
+        this.flags.fetchFlags().catch(function() {
+            console.error('[flags] Error fetching flags during identify');
+        });
     }
 };
 

package/testServer.js

@@ -124,6 +124,8 @@ for (const [suiteId, suite] of Object.entries(TEST_SUITES)) {
     // Cross-origin child iframe page for session recording tests
     app.get('/tests/new/' + suiteId + '-cross-origin-page', function(req, res) {
         res.render('cross-origin-page.pug', {
+            customLibUrl: suite.customLibUrl || './static/build/mixpanel.js',
+            snippetUrl: suite.snippetUrl || './static/src/loaders/mixpanel-jslib-snippet.js',
             testUrl: './static/build/test/browser/cross-origin-page.js'
         });
     });