React-native-notifee: Provide jest mock as part of notifee distribution

[joshuacano]

Hello, I was wondering if there were any plans to be able to use this in strictly JS mode, rather than having a full end environment properly linked? Using notifee as it stands now, would require us to ensure that we had proper linking done in an IOS and Android Docker container, causing a pretty big headache for our current Automated test system. As it stands we currently get:

 Notifee native module not found.

      2 | import React from 'react';
      3 | import App from '../App.tsx';
    > 4 | import notifee from '@notifee/react-native';
        | ^

[mikehardy]

I'm looking for a code reference for you as I feel like I did this recently for notifee but I can't find one yet, but it is possible to mock it out so that check passes and I have done similar recently with react-native-firebase

Here is the check:

https://github.com/notifee/react-native-notifee/blob/eebc5c386d742a92ea1139509d7325733c3fe192/src/NotifeeNativeModule.ts#L54-L65

So you need to reach in to the react-native NativeModules prior to loading Notifee, and putting a jest.fn() in there, I forget what the native module name actually is but you can console.log that just prior to load in order to pin it down.

Here is an example from react-native-firebase jest setup that does similar (but also shows addListener mocks for RNFB's emitter, notifee will likely need something similar)

mike@isabela:~/work/Invertase/react-native-firebase (master) % more jest.setup.ts 
import * as ReactNative from 'react-native';

jest.doMock('react-native', () => {
  return Object.setPrototypeOf(
    {
      Platform: {
        OS: 'android',
        select: () => {},
      },
      NativeModules: {
        ...ReactNative.NativeModules,
        RNFBAdMobModule: {},
        RNFBAdMobInterstitialModule: {},
        RNFBAdMobRewardedModule: {},
        RNFBAdsConsentModule: {},
        RNFBAppModule: {
          NATIVE_FIREBASE_APPS: [
            {
              appConfig: {
                name: '[DEFAULT]',
              },
              options: {},
            },

            {
              appConfig: {
                name: 'secondaryFromNative',
              },
              options: {},
            },
          ],
          addListener: jest.fn(),
          eventsAddListener: jest.fn(),
          eventsNotifyReady: jest.fn(),
        },
        RNFBAuthModule: {
          APP_LANGUAGE: {
            '[DEFAULT]': 'en-US',
          },
          APP_USER: {
            '[DEFAULT]': 'jestUser',
          },
          addAuthStateListener: jest.fn(),
          addIdTokenListener: jest.fn(),
          useEmulator: jest.fn(),
        },
        RNFBCrashlyticsModule: {},
        RNFBPerfModule: {},
      },
    },
    ReactNative,
  );
});

Is this (a pre-made jest mock) something that we could provide in the package, like many other packages do? It certainly is and we do jest testing for the core module so it would help us internally during development as well. Right now in our internal testing we're sort of deep-including specific chunks of code which is effectively a workaround.

So I think I've given you enough to stub out these parts so you can jest with Notifee included, but I will keep this open with a slightly edited title for future work. Does that seem fair?

[joshuacano]

Ahh I see, let me give that a shot. But yes, very much would be nice to see this in the docs as a helper method as you instructed.

[mikehardy]

I would love to see the finished product you come up with and then yes - we can include that at least in the docs plus in the distributed module as well

[joshuacano]

Here is what I have that works:

import * as ReactNative from 'react-native';

jest.doMock('react-native', () => {
  return Object.setPrototypeOf(
    {
      Platform: {
        OS: 'android',
        select: () => {},
      },
      NativeModules: {
        ...ReactNative.NativeModules,
        NotifeeApiModule: {
          addListener: jest.fn(),
          eventsAddListener: jest.fn(),
          eventsNotifyReady: jest.fn()
        }
      },
    },
    ReactNative,
  );
});

[mikehardy]

Excellent! That is about exactly what I was expecting but nothing beats the real code you actually saw working. Thanks for posting this, I'll see what I can do about getting it in the docs and in a mock in the distribution

[joshuacano]

Awesome, thanks for the pointer and extremely glad to help here.

Joshua Cano

On Dec 21, 2020, at 14:08, Mike Hardy [e-mail] wrote:


Excellent! That is about exactly what I was expecting but nothing beats the real code you actually saw working. Thanks for posting this, I'll see what I can do about getting it in the docs and in a mock in the distribution

—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub, or unsubscribe.