Hi I'm trying to test React-Native components in a monorepo.
I have an apps/mobile
folder with a react-native app in it.
I have a packages/ui
with a simple button component that only uses react-native.
I have a unit test in apps/mobile
that imports the button from ui
.
If I run the test I get an error __fbBatchedBridgeConfig is not set, cannot invoke native modules
If I do jest.mock('ui')
the test passes.
However I don't believe I have any native code in my packages/ui component. What am I doing wrong? My Jest config looks like this
module.exports = {
clearMocks: true,
preset: 'jest-expo',
modulePathIgnorePatterns: ['./src/.*/__mocks__/*'],
setupFilesAfterEnv: ['./test-utils/jest-setup-after-env.ts'],
testMatch: ['**/?(*.)test.!(*.){js,jsx,ts,tsx}'],
// https://jestjs.io/docs/en/tutorial-react-native#transformignorepatterns-customization
transformIgnorePatterns: [
'node_modules/(?!((jest-)?react-native|@react-native(-community)?)|expo(nent)?|@expo(nent)?/.*|@expo-google-fonts/.*|react-navigation|@react-navigation/.*|@unimodules/.*|unimodules|sentry-expo|native-base|react-native-svg)',
],
/**
* Jest's require algorithm adds .json to the list of extensions it can import, and it prioritizes .json over .tsx
* We want to do it to avoid to import app.json instead App.tsx, for example, what was happening on the file App.test.tsx when ran jest tests.
*/
moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
}