The problem
Hello everyone!I'm trying to build a mobile application with typescript, react-native, expo and jest. When I'm try to run tests:
FAIL src/components/Button/tests/Button.test.tsx● Test suite failed to run Cannot find module '@babel/runtime/helpers/interopRequireDefault' from 'node_modules/react-native/jest/setup.js' at Resolver.resolveModule (node_modules/jest-resolve/build/resolver.js:324:11) at Object.<anonymous> (node_modules/react-native/jest/setup.js:407:30)tsconfig.json
{"extends": "expo/tsconfig.base","include": ["./src/**/*.ts", "./src/**/*.tsx"],"exclude": ["node_modules","**/*.spec.ts","**/*.test.ts","**/*.spec.tsx","**/*.test.tsx","jest.config.ts","babel.config.js","metro.config.js","stryker.conf.json" ],"compilerOptions": {"noEmit": true,"pretty": true,"strict": true,"allowJs": true,"sourceMap": true,"baseUrl": "./src","module": "es2022","target": "ES2021","declaration": true,"skipLibCheck": true,"jsx": "react-native","esModuleInterop": true,"isolatedModules": true,"noImplicitReturns": true,"resolveJsonModule": true,"types": ["jest", "node"],"moduleResolution": "node","allowUnusedLabels": false,"allowUnreachableCode": false,"noFallthroughCasesInSwitch": true,"lib": ["ES2021", "ESNext", "DOM"],"allowSyntheticDefaultImports": true,"forceConsistentCasingInFileNames": true,"typeRoots": ["./types", "./node_modules/@types"] }}jest.config.ts
import { defaults } from 'ts-jest/presets';export default { ...defaults, clearMocks: true, maxWorkers: '50%', collectCoverage: true, coverageProvider: 'v8', preset: 'react-native', testEnvironment: 'node', cacheDirectory: '.jest/cache', coverageDirectory: '.jest/coverage', moduleDirectories: ['<rootDir>/src'], testPathIgnorePatterns: ['<rootDir>/node_modules/'], coveragePathIgnorePatterns: ['<rootDir>/node_modules/'], globals: {'ts-jest': { tsconfig: 'tsconfig.json' } }};babel.config.js
module.exports = function (api) { api.cache(true); return { presets: ['babel-preset-expo', 'module:metro-react-native-babel-preset'], plugins: [ ['module-resolver', { root: ['./src'], extensions: ['.ios.js', '.android.js', '.js', '.ts', '.tsx', '.json'] } ], ['module:react-native-dotenv', { safe: false, path: '.env', verbose: false, moduleName: '@env', envName: 'NODE_ENV', allowUndefined: false } ] ], env: { production: { plugins: ['react-native-paper/babel', 'transform-remove-console'] } } };};package.json
{"name": "radar-solidario","private": true,"version": "1.0.0","main": "node_modules/expo/AppEntry.js","scripts": {"eject": "expo eject","start": "expo start","test": "jest --no-cache","prepare": "husky install","format": "prettier --write .","check-format": "prettier --check .","check-types": "tsc --pretty --noEmit","check-lint": "eslint src --ext ts --ext tsx --ext js --ext jsx","android": "NODE_ENV=development expo start --android","android:prod": "NODE_ENV=production expo start --android","android:build": "NODE_ENV=production expo build:android -t apk","ios": "NODE_ENV=development expo start --ios","ios:prod": "NODE_ENV=production expo start --ios","ios:build": "NODE_ENV=production expo build:ios -t simulator" },"dependencies": {"@expo/vector-icons": "^12.0.5","@hookform/resolvers": "^2.8.5","@react-native-async-storage/async-storage": "^1.15.14","@react-native-community/datetimepicker": "4.0.0","@react-native-community/netinfo": "7.1.3","@react-native-picker/picker": "^2.2.1","@react-navigation/bottom-tabs": "^6.0.9","@react-navigation/native": "^6.0.6","@react-navigation/stack": "^6.0.11","@reduxjs/toolkit": "^1.7.1","axios": "^0.24.0","expo": "^44.0.3","expo-asset": "~8.4.5","expo-cli": "^5.0.3","expo-community-flipper": "^44.0.0","expo-font": "^10.0.4","expo-splash-screen": "~0.14.1","expo-status-bar": "~1.2.0","i18next": "^21.6.5","jwt-decode": "^3.1.2","lottie-react-native": "^5.0.1","metro-react-native-babel-preset": "^0.66.2","moment": "^2.29.1","react": "17.0.2","react-dom": "17.0.2","react-hook-form": "^7.22.5","react-i18next": "^11.15.3","react-native": "https://github.com/expo/react-native/archive/sdk-44.0.0.tar.gz","react-native-countdown-circle-timer": "^2.5.4","react-native-dotenv": "^3.3.1","react-native-flipper": "^0.127.0","react-native-gesture-handler": "^2.1.0","react-native-maps": "0.29.4","react-native-paper": "^4.11.1","react-native-safe-area-context": "3.3.2","react-native-screens": "~3.10.1","react-native-svg": "^12.1.1","react-native-web": "^0.17.5","react-redux": "^7.2.6","react-thunk": "^1.0.0","redux-persist": "^6.0.0","win-node-env": "^0.6.0","yup": "^0.32.11" },"devDependencies": {"@babel/core": "^7.12.9","@babel/runtime": "^7.16.7","@stryker-mutator/core": "^5.5.1","@stryker-mutator/jest-runner": "^5.5.1","@stryker-mutator/typescript-checker": "^5.5.1","@testing-library/jest-dom": "^5.16.1","@testing-library/react": "^12.1.2","@testing-library/user-event": "^13.5.0","@types/jest": "^27.4.0","@types/node": "^17.0.8","@types/react": "~17.0.21","@types/react-native": "~0.66.10","@types/react-native-dotenv": "^0.2.0","@typescript-eslint/eslint-plugin": "^5.7.0","@typescript-eslint/parser": "^5.7.0","babel-plugin-module-resolver": "^4.1.0","babel-preset-expo": "^9.0.2","eslint": "^8.4.1","eslint-plugin-react": "^7.27.1","husky": "^7.0.0","jest": "^27.4.7","msw": "^0.36.3","prettier": "^2.5.1","ts-jest": "^27.1.2","typescript": "~4.5.4" },"resolutions": {"react-native/@jest/create-cache-key-function": "^27.4.2" },"husky": {"hooks": {"pre-commit": "yarn lint","pre-push": "" } }}Things what I tried
- Remove or add
@babel/runtime - Change the
node_modules/jest-haste-map/build/index.jswatchman use - Use the
expo-jest - Use the ES2015 in
tsconfig.json - Use the
babel-jestfortransforminjest.config.ts - Remove the
jest.config.tsfile
I thank everyone who help me :)