Flow Annotations causing Jest Test to fail.

[cvongrim]

Preliminary Info

What Urban Airship dependencies are you using?

urbanairship-react-native: 2.1.3
react-native: 0.57.5

What are the versions of any relevant development tools you are using?

n/a

Report

What unexpected behavior are you seeing?

When running Jest, Urban Airship throws an error due to flow type annotations.

/node_modules/urbanairship-react-native/js/UACustomEvent.js:8
        _name: string;
             ^

    SyntaxError: Unexpected token :

What is the expected behavior?

To be able to continue running my existing Jest Test.

I assume something needs to be added to strip out the Flow annotations when Jest is ran. I would assume this could be a common issue since Jest comes with React Native as the default Testing library.

What are the steps to reproduce the unexpected behavior?

Run a Jest Test on any component that imports urbanairship-react-native.

Do you have logging for the issue?

No

[rlepinski]

@cvongrim jestjs/jest#607

Can you try using babel-jest?

[cvongrim]

@rlepinski I am using it on my project. I am using Flow in all of my code without issue. I only started running into Jest Flow errors when I import Urban Airship. If I remove the Urban Airship import they go away.

[rlepinski]

Ok, I have no idea why our plugin would be at fault but I will take a look. If you could provide a sample project that reproduces the issue that would be extremely helpful.

[cvongrim]

Here is an example project. Just pull it down, yarn install and try running yarn test. On my actual project, I have gone through the steps of fully setting up Urban Airship to where it does receive Push Notifications successfully. I am going to keep looking for a solution too. Thanks!

[rlepinski]

Some progress: https://jestjs.io/docs/en/tutorial-react-native#transformignorepatterns-customization

    "transformIgnorePatterns": [
      "node_modules/(?!(react-native|urbanairship-react-native)/)"
    ]

Moves past the error but onto a new one:

  ● Test suite failed to run

    Invariant Violation: Native module cannot be null.

      at invariant (node_modules/fbjs/lib/invariant.js:40:15)
      at UAEventEmitter.NativeEventEmitter (node_modules/react-native/Libraries/EventEmitter/NativeEventEmitter.js:36:36)
      at new UAEventEmitter (node_modules/urbanairship-react-native/js/UAEventEmitter.js:14:140)
      at Object.<anonymous> (node_modules/urbanairship-react-native/js/UrbanAirship.js:14:20)
      at Object.<anonymous> (node_modules/urbanairship-react-native/js/index.js:16:24)

[rlepinski]

Ok, was able to run tests by adding a module mock jestjs/jest#2208

jest.mock('urbanairship-react-native', () => {
  return {
  }
})

[rlepinski]

@cvongrim I think you should be unblocked for now if you add the above. I will look into precompiling the module on publish and possibly providing a default mock for jest.

[cvongrim]

Great! Added that and that fixed it. I have been trying to figure this out all day. Thanks for looking into it.

[nelsonchen5]

@rlepinski

Running into this problem as well, added the above, however when the tests are run, I'll receive a "Cannot read property 'setUserNotificationsEnabled' of undefined

Any chance this has something to do with the jest.mock?

[cvongrim]

@nelsonchen5 This looks to be a different issue than what I had. I didn't have a problem with UrbanAirship. UrbanAirship is imported right? Depending on your test, you might need to mock UrbanAirship. Something like the following.

jest.mock('urbanairship-react-native, () => {
  return {
    setUserNotificationsEnabled: jest.fn(),
  };
});

[nelsonchen5]

@cvongrim Hi, thanks for the response. I tried mocking it and it doesn't seem to recognize UrbanAirship for some reason

[rlepinski]

@nelsonchen5 This issue is unrelated to the original issue.

Please open a new issue with more details. We will probably need a project that reproduces the issue to know your exact issue. Most likely the module is not installed properly (npm install) or you are missing an include somewhere.