Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

React Native, Invariant Violation: Native module cannot be null. (pointing to OneSignal module)

I'm writing tests with Jest+Enzyme for a react native app that utilizes OneSignal.

There's have a similar issue (I think) here: https://github.com/facebook/jest/issues/2208, but this issue is quite old, and I have followed the solutions there, but none worked for me.

At first, I encountered this error for running jest:

home/nrion/Desktop/mobile-ui/PriceInsight_app/node_modules/react-native-onesignal/index.js:4
    import { NativeModules, NativeEventEmitter, NetInfo, Platform } from 'react-native';
    ^^^^^^

    SyntaxError: Unexpected token import

    > 1 | import OneSignal from 'react-native-onesignal';
      2 | 
      3 | export const STORE_TIMEFRAME = 'STORE_TIMEFRAME';
      4 | export const STORE_TIMEFRAMES = 'STORE_TIMEFRAMES';

      at ScriptTransformer._transformAndBuildScript (../../../../../usr/lib/node_modules/jest-cli/node_modules/jest-runtime/build/script_transformer.js:316:17)
      at Object.<anonymous> (src/actions/subscription.js:1:387)
      at Object.<anonymous> (src/reducers/subscription.js:1:402)

So i went ahead and added react-native-onesignal to package.jsonas such:

"transformIgnorePatterns": [
      "node_modules/(?!(react-native-onesignal|react-native-login|react-native-elements)/)"
    ]

So that solved my problem. But here comes another problem:

 Invariant Violation: Native module cannot be null.

    > 1 | import OneSignal from 'react-native-onesignal';
      2 | 
      3 | export const STORE_TIMEFRAME = 'STORE_TIMEFRAME';
      4 | export const STORE_TIMEFRAMES = 'STORE_TIMEFRAMES';

      at invariant (node_modules/fbjs/lib/invariant.js:42:15)
      at new NativeEventEmitter (node_modules/react-native/Libraries/EventEmitter/NativeEventEmitter.js:37:31)
      at Object.<anonymous> (node_modules/react-native-onesignal/index.js:9:33)

I tried mocking OneSignal, but this is what happens when I do that:

 Cannot find module 'OneSignal' from 'Main.test.js'

    > 1 | import React from 'react'
      2 | import { shallow } from '../../jest-setup'
      3 | import configureStore from 'redux-mock-store'
      4 | import OneSignal from 'react-native-onesignal'

      at Resolver.resolveModule (../../../../../usr/lib/node_modules/jest-cli/node_modules/jest-resolve/build/index.js:169:17)
      at Object.<anonymous> (src/__tests__/Main.test.js:1:108)

I've been weirded out by this issue for hours! Any insight will be very much appreciated.

like image 228
nrion Avatar asked Mar 23 '26 03:03

nrion


1 Answers

So it turns out that my mock up was wrong. It should be:

jest.mock('react-native-onesignal', () => ({
  addEventListener: jest.fn(),
  removeEventListener: jest.fn(),
  inFocusDisplaying: jest.fn()
}))

as pointed out by this thread: https://github.com/facebook/jest/issues/6382#issuecomment-394104956

like image 132
nrion Avatar answered Mar 25 '26 15:03

nrion



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!