react-native-intercom: Error: Cannot read property 'UNREAD_CHANGE_NOTIFICATION' of undefined

After adding the line import Intercom from 'react-native-intercom'; I get the following error:

screen shot 2017-06-30 at 19 19 09

I followed all steps of the iOS installation. Could you kindly point me to the right direction?

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Reactions: 5
  • Comments: 22 (5 by maintainers)

Most upvoted comments

If you encounter this issue while testing with Jest, try this mock:

// jest/mocks/react-native-intercom.js:
const mockReactNativeIntercom = {
  registerIdentifiedUser: jest.genMockFn().mockReturnValue(Promise.resolve()),
  registerUnidentifiedUser: jest.genMockFn().mockReturnValue(Promise.resolve()),
  updateUser: jest.genMockFn().mockReturnValue(Promise.resolve()),
  reset: jest.genMockFn().mockReturnValue(Promise.resolve()),
  logEvent: jest.genMockFn().mockReturnValue(Promise.resolve()),
  handlePushMessage: jest.genMockFn().mockReturnValue(Promise.resolve()),
  displayMessenger: jest.genMockFn().mockReturnValue(Promise.resolve()),
  hideMessenger: jest.genMockFn().mockReturnValue(Promise.resolve()),
  displayMessageComposer: jest.genMockFn().mockReturnValue(Promise.resolve()),
  displayMessageComposerWithInitialMessage: jest.genMockFn().mockReturnValue(Promise.resolve()),
  displayConversationsList: jest.genMockFn().mockReturnValue(Promise.resolve()),
  getUnreadConversationCount: jest.genMockFn().mockReturnValue(Promise.resolve()),
  setLauncherVisibility: jest.genMockFn().mockReturnValue(Promise.resolve()),
  setInAppMessageVisibility: jest.genMockFn().mockReturnValue(Promise.resolve()),
  setupAPN: jest.genMockFn().mockReturnValue(Promise.resolve()),
  registerForPush: jest.genMockFn().mockReturnValue(Promise.resolve()),
  setUserHash: jest.genMockFn().mockReturnValue(Promise.resolve()),
  setBottomPadding: jest.genMockFn().mockReturnValue(Promise.resolve()),
  addEventListener: jest.fn(),
  removeEventListener: jest.fn()
};

export default mockReactNativeIntercom;

// jest/setup.js:
import mockReactNativeIntercom from './mocks/react-native-intercom';
jest.mock('react-native-intercom', () => mockReactNativeIntercom);

Something that works for me:

jest.mock('react-native-intercom', () => {}, { virtual: true });

I had this because the library is not linked well, now solved.

I’m encountering this issue when I run my first jest test, I have the required lib in iOS and intercom is working just fine

Here is the output

Test suite failed to run

TypeError: Cannot read property 'UNREAD_CHANGE_NOTIFICATION' of undefined
  
  at new IntercomClient (node_modules/react-native-intercom/lib/IntercomClient.js:26:117)
  at Object.<anonymous> (node_modules/react-native-intercom/lib/IntercomClient.js:356:16)
  at Object.<anonymous> (app/lib/helpers/intercomHelpers.js:5:174)

My test is simple

it('renders correctly', () => {
    const tree = renderer.create(
        <Login />
    ).toJSON();
    expect(tree).toMatchSnapshot();
}); 

Anyone have any ideas how to fix this

If you encounter this issue while testing with Jest, try this mock:

// jest/mocks/react-native-intercom.js:
const mockReactNativeIntercom = {
  registerIdentifiedUser: jest.genMockFn().mockReturnValue(Promise.resolve()),
  registerUnidentifiedUser: jest.genMockFn().mockReturnValue(Promise.resolve()),
  updateUser: jest.genMockFn().mockReturnValue(Promise.resolve()),
  reset: jest.genMockFn().mockReturnValue(Promise.resolve()),
  logEvent: jest.genMockFn().mockReturnValue(Promise.resolve()),
  handlePushMessage: jest.genMockFn().mockReturnValue(Promise.resolve()),
  displayMessenger: jest.genMockFn().mockReturnValue(Promise.resolve()),
  hideMessenger: jest.genMockFn().mockReturnValue(Promise.resolve()),
  displayMessageComposer: jest.genMockFn().mockReturnValue(Promise.resolve()),
  displayMessageComposerWithInitialMessage: jest.genMockFn().mockReturnValue(Promise.resolve()),
  displayConversationsList: jest.genMockFn().mockReturnValue(Promise.resolve()),
  getUnreadConversationCount: jest.genMockFn().mockReturnValue(Promise.resolve()),
  setLauncherVisibility: jest.genMockFn().mockReturnValue(Promise.resolve()),
  setInAppMessageVisibility: jest.genMockFn().mockReturnValue(Promise.resolve()),
  setupAPN: jest.genMockFn().mockReturnValue(Promise.resolve()),
  registerForPush: jest.genMockFn().mockReturnValue(Promise.resolve()),
  setUserHash: jest.genMockFn().mockReturnValue(Promise.resolve()),
  setBottomPadding: jest.genMockFn().mockReturnValue(Promise.resolve()),
  addEventListener: jest.fn(),
  removeEventListener: jest.fn()
};

export default mockReactNativeIntercom;

// jest/setup.js:
import mockReactNativeIntercom from './mocks/react-native-intercom';
jest.mock('react-native-intercom', () => mockReactNativeIntercom);

Worked for me, but I had to replace genMockFn() with fn()

Thank for the all of instructions above. I still had this issue on iOS after trying everything above. The final steps that fixed the problem, for me, were:

  1. In XCode, in the project navigator right click Libraries ➜ Add Files to [your project’s name]
  2. Go to node_modules ➜ react-native-intercom➜ iOS and add IntercomWrapper.h, IntercomWrapper.m, IntercomEventEmitter.h and IntercomEventEmitter.m.

Build your iOS project and try again.

This worked for me.

Thank for the all of instructions above. I still had this issue on iOS after trying everything above. The final steps that fixed the problem, for me, were:

  1. In XCode, in the project navigator right click Libraries ➜ Add Files to [your project’s name]
  2. Go to node_modules ➜ react-native-intercom➜ iOS and add IntercomWrapper.h, IntercomWrapper.m, IntercomEventEmitter.h and IntercomEventEmitter.m.

Build your iOS project and try again.

This worked for me.

In addition to the 4 files listed above, I also added:

  • IntercomUserAttributesBuilder.m
  • IntercomUserAttributesBuilder.h (I noticed that IntercomUserAttributesBuilder.h is imported in the IntercomWrapper.m file)

Adding the 6 files finally allowed me to import Intercom using import Intercom from 'react-native-intercom' and actually call Intercom Intercom.logEvent('viewed_screen', { extra: 'metadata' }) without getting any red screens.

@ohtangza could you let me know how you linked the library? thanks

thanks @NSLS your post was a great help as I also had same problem and resolved (in same manner)

one thing written into the Intercom iOS installation docs, which i needed to change (my builds were failing) was the bash script path. In my app, I had dragged/dropped the Intercom.framework path directly underneath the projects root. ie per this screenshot

image

because of that, the path to the .sh needed to be as follows: image

this might not be obvious to some so thought I’d add it in here. in reality Intercom should add a footnote to their iOS install docs about this.