[Bug]: Invariant Violation: new NativeEventEmitter() requires a non-null argument.

Question

[Bug]: Invariant Violation: new NativeEventEmitter() requires a non-null argument.

Jack-Gill-TH opened this issue a year ago · comments

Jack-Gill-TH commented a year ago

Which Platforms?

iOS

Which React Native Version?

0.68.7

Which @braze/react-native-sdk SDK version?

5.2.0

Repro Rate

100%

Steps To Reproduce

Example:

import { BrazePlugin } from '@segment/analytics-react-native-plugin-braze';.
Run the app.

Expected Behavior

App should run correctly

Actual Incorrect Behavior

App freezes after loading bundle from Metro

Verbose Logs

 ERROR  Invariant Violation: `new NativeEventEmitter()` requires a non-null argument., js engine: hermes
 WARN  Module RNEventEmitter requires main queue setup since it overrides `constantsToExport` but doesn't implement `requiresMainQueueSetup`. In a future release React Native will default to initializing all native modules on a background thread unless explicitly opted-out of.
 WARN  Module RNLocalization requires main queue setup since it overrides `constantsToExport` but doesn't implement `requiresMainQueueSetup`. In a future release React Native will default to initializing all native modules on a background thread unless explicitly opted-out of.
 ERROR  Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect.
      This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native., js engine: hermes
 ERROR  Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect.
      This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native., js engine: hermes

Note: RNLocalization and RNEventEmitter are modules created for this project.

Additional Information

I originally raised this issue on the github for the segment Braze plugin, and you can find that thread here: segmentio/analytics-react-native#888

However, I've confirmed that it is a line from braze-react-native-sdk that is causing the problem: https://github.com/braze-inc/braze-react-native-sdk/blob/4ef01ede9c36a6f557d25cf7c704271c54d99a40/src/braze.js#L37C46-L37C46

It seems to be that I am not setting up the bridge correctly/something is incompatible between my app and the Braze iOS code. If I add a new bit of code to the constructor of my main App file to import NativeModules.BrazeReactBridge and create a NativeEventEmitter with it, it does not throw an error. Also, I can log out the BrazeReactBridge and see that it is NOT null, so it seems like some kind of race condition? The BrazeReactBridge is null when the Braze class from your sdk is instantiated.

You can find my AppDelegate files here: https://drive.google.com/drive/folders/1hRVjZYsGNHjFJwZRbIOppcZQV-Htb-KZ?usp=sharing

Any support is greatly appreciated!

Daniel Hok · Answer 1 · Fri Oct 20 2023 07:17:54 GMT+0800 (China Standard Time)

Hi @Jack-Gill-TH,

Thanks for filing this issue and linking between the thread here and the one on Segment's React Native Braze partner SDK. Since it appears to be a pretty technical issue (possibly related to a race condition), would you be able to try to reproduce this in a fresh project to ensure that it isn't interfering with other parts of the app? It's pretty difficult to debug the root cause if there are many unknowns in a larger production app.

Thank you!

Jack-Gill-TH · Answer 2 · Mon Oct 23 2023 20:54:32 GMT+0800 (China Standard Time)

Hi @hokstuff thanks for getting back to me!

I have set up a fresh React Native project, using the same version of RN as our project is using, and followed the Braze iOS integration steps, and I cannot reproduce the problem. I am importing BrazePlugin at the top of the App.js file and immediately adding it as a plugin, but it seems to have no problem accessing NativeModules.BrazeReactBridge.

One extra odd thing is that I'm getting a linting error for the import line in my project (Unable to resolve path to module '@segment/analytics-react-native-plugin-braze'.) but no such error for any of my other modules, including the others that end up under 'node_modules/@segment'. Not sure if that's related at all!

I'm continuing to investigate, though I've been looking at this for a few weeks now and I'm running out of ideas 😅 Is there any kind of 'ready' state I should be waiting for before I try and import Braze?

Jeriel Ng · Answer 3 · Mon Oct 23 2023 21:34:38 GMT+0800 (China Standard Time)

Thanks @Jack-Gill-TH, we'll take a deeper dive into the issue, but there shouldn't be any kind of waiting before you can use Braze in the React Native SDK. If you have followed those setup steps, your instance should be ready to go.

I'm not sure about the linting error, though. It may be possible you need to reinstall it. Have you verified that the plugin appears under the file hierarchy?

Jack-Gill-TH · Answer 4 · Mon Oct 23 2023 21:52:59 GMT+0800 (China Standard Time)

Thanks @jerielng thats's useful to know.

I've definitely reinstalled it plenty of times, and I've confirmed that the plugin files definitely are in the file hierarchy where I would expect them to be. Was just wondering whether it could be connected - trying to give as much info as possible because I know it's a big ask to ask you to figure out what's wrong with a big project!

Jeriel Ng · Answer 5 · Mon Oct 23 2023 22:03:05 GMT+0800 (China Standard Time)

Thanks for the confirmation, and we appreciate the information! We'll try our best to diagnose the issue, but If there's any reproduction steps you are able to come up with and share, please continue to let us know!

Jack-Gill-TH · Answer 6 · Mon Oct 23 2023 22:10:47 GMT+0800 (China Standard Time)

@jerielng of course, I'll keep at it! My next idea is to take a close look at the settings in XCode for my project and the fresh one - maybe there's some kind of compile-order setting that's configured differently in my project? It's at least six years old so there's often bits of legacy config hiding where you'd least expect 😅

Jack-Gill-TH · Answer 7 · Tue Oct 24 2023 19:10:41 GMT+0800 (China Standard Time)

Some more findings:

I get the same problem when I just integrate the Braze RN SDK. As soon as I add import Braze from '@braze/react-native-sdk'; to my App.js file I get the 'new NativeEventEmitter() requires a non-null argument.' error. But if I log NativeModules.BrazeReactBridge to the console I see what is definitely the correct object with all of the expected Braze functions on it.

I tried making a release build with the import line in and got the same result, or rather, the app immediately crashes as opposed to showing the RN logbox.

Jeriel Ng · Answer 8 · Wed Oct 25 2023 01:13:21 GMT+0800 (China Standard Time)

Thanks, @Jack-Gill-TH, one thing that might help as well: Is this a new integration? Are you able to confirm what is the earliest version that's causing this?

Jack-Gill-TH · Answer 9 · Wed Oct 25 2023 16:42:12 GMT+0800 (China Standard Time)

Hi @jerielng - this is a new integration, we've had segment and firebase set up for a while but this is the first time we've ever included the Braze sdk. I'll do some experimentation today to see if I can find an earlier version where this isn't a problem. I've tried going down to 4.1.0 of the Braze SDK and that had the same problem, but I'll check earlier versions.

Jack-Gill-TH · Answer 10 · Wed Oct 25 2023 20:55:56 GMT+0800 (China Standard Time)

@jerielng I've tried with 3.0.0 as well and get the exact same error. Unfortunately when I tried 2.0.0 I couldn't get XCode to create a debug build and it seemed like it was just too old and was using some no longer available Interfaces/Functions.