MixPanel causing app to crash on latest react native

[matthewmturner]

Since upgrading to react native .71 and enabling hermes we have been seeing more crashes and I think they are coming from the native implementation of mixpanel based on the reports we are getting from Sentry. Stack trace included below. We are on version 2.1.

Is this something that you can fix on your side?

[matthewmturner]

I've double checked and every instance of this error weve seen was on iOS 16.1+ with React Native .71 (hermes enabled)

[Allanbcruz]

I also have the same error, I managed to get the log using adb

[matthewmturner]

@Allanbcruz which version of react native are you on?

[Allanbcruz]

I migrated today from version:
"react": "17.0.2",
"react-native": "0.67.5",
"mixpanel-react-native": "^2.1.0",
for version:
"react": "18.2.0",
"react-native": "0.71.4",
"mixpanel-react-native": "^2.2.0",

Before it was working normally!

[matthewmturner]

Yup same for me only had issues after upgrade. I was on .65 before though.

[matthewmturner]

It's very inconsistent for me though - what about you? The app still works a good amount of the time it just crashes a lot more than it used to (usually after opening the app).

[Allanbcruz]

making a "My bad", sorry @matthewmturner, the error I reported was actually caused by me calling the mixpanel track before it had initialized

[matthewmturner]

@Allanbcruz Had you changed anything about your Mixpanel code when upgrading React Native?

[Allanbcruz]

No @matthewmturner, due to a failure of the team to manage the releases of our application, there was a coincidence that the faulty code (failed implementation trying to call the mixpanel track before Init()) and the React-Native update version were on the same branch.

[matthewmturner]

@Allanbcruz Ah ok, thanks for information!

[matthewmturner]

were going to try upgrading to 0.71.4 to see if that helps. if not we will likely have to disable mixpanel

[matthewmturner]

Were also going to upgrade from mixpanel 2.1 to 2.2, i see that updated the target deployment version so maybe that will help

[matthewmturner]

Any feedback from the Mixpanel team please? We updated on our side but it seems likely that the bug is persisting as already saw an instance of it on the version with the fix

[jaredmixpanel]

@matthewmturner I'm not able to reproduce the crash and this is the only report we have of such a crash, so I'm not sure what the cause is. But from the screenshot of the stack trace we can see that the crash occurs in AutomaticProperties.setAutomaticProperties which can be found here: https://github.com/mixpanel/mixpanel-react-native/blob/master/ios/AutomaticProperties.swift#L7-L9

Which is called from here: https://github.com/mixpanel/mixpanel-react-native/blob/master/ios/MixpanelReactNative.swift#L22

Which receives the superProperties object param from your init call: https://github.com/mixpanel/mixpanel-react-native/blob/master/index.js#L65-L67

Are you providing superProperties in your init call? If so, what are they and how exactly are you doing it? Let me know if you get any additional information and I'll take a closer look.

[matthewmturner]

@jaredmixpanel thanks for the response! we dont use superProperties anywhere. Below is our core mixpanel code. Using that we just call mixpanelInstance.track throughout the app as needed.

and unfortunately i havent been able to reproduce this in development. im only getting the sentry crash reports in production.

import config from 'config';
import { Mixpanel } from 'mixpanel-react-native';

class MixpanelInstance {
  mixpanel: Mixpanel | null;

  isInitialized: boolean;

  constructor() {
    this.mixpanel = null;
    this.isInitialized = false;
  }

  init() {
    try {
      const trackAutomaticEvents = true;
      const mixpanel = new Mixpanel(config.mixpanelToken, trackAutomaticEvents);
      mixpanel.init();
      this.mixpanel = mixpanel;
      this.isInitialized = true;
    } catch (e) {
      console.error(e);
      this.mixpanel = null;
      this.isInitialized = false;
    }
  }

  identify(userId: string) {
    if (!this.isInitialized) return;
    try {
      // We know from the constructor that if isInitialized is true,
      // then mixpanel is not null
      this.mixpanel!.identify(userId);
    } catch (e) {
      console.error(e);
    }
  }

  updateCurrentUser(properties: Object) {
    if (!this.isInitialized) return;
    try {
      // We know from the constructor that if isInitialized is true,
      // then mixpanel is not null
      this.mixpanel!.getPeople().set(properties);
    } catch (e) {
      console.error(e);
    }
  }

  track(name: string, properties: Object) {
    if (!this.isInitialized) return;
    try {
      // We know from the constructor that if isInitialized is true,
      // then mixpanel is not null
      this.mixpanel!.track(name, properties);
    } catch (error) {
      console.error(error);
    }
  }
}

const mixpanelInstance = new MixpanelInstance();

export { mixpanelInstance };