How do I mock the whole @react-native-firebase/messaging properly in jest

[roni-castro]

I am currently mocking this module using this code below, but it does not mock the FirebaseMessagingTypes and neither the messaging (messaging.AuthorizationStatus.PROVISIONAL), how do I mock it? Is there any example on how to mock this lib?

jest.mock('@react-native-firebase/messaging', () => (() => ({
  hasPermission: () => jest.fn(),
  requestPermission: () => jest.fn(),
  getToken: () => jest.fn(),
  getAPNSToken: () => jest.fn(),
  onMessage: () => jest.fn(),
  onTokenRefresh: () => jest.fn(),
  onNotificationOpenedApp: () => jest.fn(),
}))
)

[mikehardy]

Inspiration perhaps is how the module mocks itself for testing? https://github.com/invertase/react-native-firebase/blob/master/jest.setup.ts

I do something like

/* eslint-disable no-undef */
jest.mock('@react-native-firebase/app', () => ({
  messaging: jest.fn(() => ({
    hasPermission: jest.fn(() => Promise.resolve(true)),
    subscribeToTopic: jest.fn(),
    unsubscribeFromTopic: jest.fn(),
    requestPermission: jest.fn(() => Promise.resolve(true)),
    getToken: jest.fn(() => Promise.resolve('myMockToken')),
  })),
  notifications: jest.fn(() => ({
    onNotification: jest.fn(),
    onNotificationDisplayed: jest.fn(),
  })),
  analytics: jest.fn(() => ({
    logEvent: jest.fn(),
    setUserProperties: jest.fn(),
    setUserId: jest.fn(),
    setCurrentScreen: jest.fn(),
  })),
}));

// web mock
jest.mock('firebase/app', () => ({
  analytics: jest.fn(() => ({
    logEvent: jest.fn(),
  })),
}));

[roni-castro]

I have tried an approch similar to this one, but it generates a type error when the function messaging().onMessage is called, probably because of this static type below, I don't know how to mock messaging() and messaging at the same time.

declare module '@react-native-firebase/messaging' {
  // tslint:disable-next-line:no-duplicate-imports required otherwise doesn't work
  import { ReactNativeFirebase } from '@react-native-firebase/app';
  import ReactNativeFirebaseModule = ReactNativeFirebase.Module;
  import FirebaseModuleWithStatics = ReactNativeFirebase.FirebaseModuleWithStatics;

  const firebaseNamedExport: {} & ReactNativeFirebaseModule;
  export const firebase = firebaseNamedExport;

  const defaultExport: FirebaseModuleWithStatics<
    FirebaseMessagingTypes.Module,
    FirebaseMessagingTypes.Statics // I dont know how to mock this and the module above at the same time
  >;
  export default defaultExport;
}

---

This @react-native-firebase/messaging mock below generates the error TypeError: messaging_1.default is not a function

jest.mock('@react-native-firebase/messaging', () => ({
  messaging: jest.fn(() => ({
    hasPermission: () => jest.fn(),
    requestPermission: () => jest.fn(),
    getToken: () => jest.fn(),
    getAPNSToken: () => jest.fn(),
    onMessage: () => jest.fn(),
    onTokenRefresh: () => jest.fn(),
    onNotificationOpenedApp: () => jest.fn(),
  }))
}))

The @react-native-firebase/app mock below does not mock the messaging lib, as it is in a different package:

jest.mock('@react-native-firebase/app', () => ({
  messaging: jest.fn(() => ({
    hasPermission: () => jest.fn(),
    requestPermission: () => jest.fn(),
    getToken: () => jest.fn(),
    getAPNSToken: () => jest.fn(),
    onMessage: () => jest.fn(),
    onTokenRefresh: () => jest.fn(),
    onNotificationOpenedApp: () => jest.fn(),
  }))
}))

I will try to undertand how this mock works and check if I can do the same in this lib