jeudi 1 avril 2021

Invariant Violation: Native module cannot be null error on React Native with Jest

Good Evening, I am trying to implement Jest into my React Native project, but I am running into many issues and I am not sure what is the issue. I am using Google Firebase for auth, React Native, and React native router flux. Below is the relevant code. I am in the stage of I change one thing, but depending what I change I either get, the error above, cant export, cant import an outside module. I have tried shallow rendering as well.

// Babel
module.exports = {
  presets: ['module:metro-react-native-babel-preset', '@babel/preset-env'],
  plugins: ['@babel/plugin-proposal-class-properties'],
};

// package.json
{
  "name": "Projectname",
  "version": "2.3.31",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "start": "react-native start",
    "test": "jest --verbose",
    "lint": "eslint .",
    "bpmn2workflow": "node scripts/bpmn2workflow.js",
    "copy_audio": "node scripts/copy_audio_files.js",
    "sentences": "node scripts/sentences_test.js",
    "env:dev": "node scripts/set-env.js dev",
    "env:stage": "node scripts/set-env.js stage",
    "env:prod": "node scripts/set-env.js prod",
    "create_local_audio_json": "node scripts/create_local_audio_file.js",
    "create_workflows": "node scripts/bpmn2workflow.js && node scripts/create_local_audio_file.js"
  },
  "dependencies": {
    "@invertase/react-native-apple-authentication": "^1.1.2",
    "@react-native-community/async-storage": "^1.11.0",
    "@react-native-community/audio-toolkit": "^2.0.3",
    "@react-native-community/checkbox": "^0.4.2",
    "@react-native-community/google-signin": "^4.0.3",
    "@react-native-community/masked-view": "^0.1.10",
    "@react-native-community/picker": "^1.6.5",
    "@react-native-community/push-notification-ios": "^1.6.0",
    "@react-native-community/slider": "^3.0.3",
    "@react-native-firebase/analytics": "^11.0.0",
    "@react-native-firebase/app": "^11.0.0",
    "@react-native-firebase/auth": "^11.0.0",
    "@react-native-firebase/crashlytics": "^11.0.0",
    "@react-native-firebase/firestore": "^11.0.0",
    "@react-native-firebase/messaging": "^11.0.0",
    "@react-native-firebase/remote-config": "^11.0.0",
    "@react-navigation/native": "^5.9.3",
    "@react-navigation/stack": "^5.3.9",
    "create-react-class": "^15.6.3",
    "duration": "^0.2.2",
    "firebase": "^7.23.0",
    "firebase-messaging": "^1.0.6",
    "format": "^0.2.2",
    "format-duration": "^1.3.1",
    "fs": "0.0.1-security",
    "lodash": "^4.17.20",
    "moment": "^2.27.0",
    "mp3-duration": "^1.1.0",
    "music-metadata": "^7.0.1",
    "nocache": "^2.1.0",
    "react": "16.13.1",
    "react-lodash": "^0.1.2",
    "react-native": "0.63.4",
    "react-native-background-timer": "^2.2.0",
    "react-native-chart-kit": "^6.4.1",
    "react-native-fs": "^2.16.6",
    "react-native-gesture-handler": "^1.6.1",
    "react-native-iap": "5.1.3",
    "react-native-iaphub": "^6.0.3",
    "react-native-keep-awake": "^4.0.0",
    "react-native-parallax-scroll-view": "^0.21.3",
    "react-native-push-notification": "^6.1.1",
    "react-native-reanimated": "^1.9.0",
    "react-native-router-flux": "^4.2.0",
    "react-native-safe-area-context": "^1.0.2",
    "react-native-screens": "^2.8.0",
    "react-native-simple-radio-button": "^2.7.4",
    "react-native-snap-carousel": "^4.0.0-beta.5",
    "react-native-snap-slider": "^0.3.0",
    "react-native-splash-screen": "^3.2.0",
    "react-native-svg": "^12.1.0",
    "react-native-watch-connectivity": "^0.4.3",
    "react-native-xml2js": "^1.0.3",
    "react-redux": "^7.2.0",
    "redux": "^4.0.5",
    "redux-thunk": "^2.3.0",
    "watchman": "^1.0.0"
  },
  "devDependencies": {
    "@babel/core": "^7.13.8",
    "@babel/preset-env": "^7.13.12",
    "@babel/runtime": "^7.13.9",
    "@react-native-community/eslint-config": "^0.0.5",
    "eslint": "^7.5.0",
    "eslint-config-airbnb": "^18.2.0",
    "eslint-plugin-import": "^2.22.0",
    "eslint-plugin-jsx-a11y": "^6.3.1",
    "eslint-plugin-react": "^7.20.3",
    "eslint-plugin-react-hooks": "^4.0.8",
    "identity-obj-proxy": "^3.0.0",
    "jest": "^24.9.0",
    "metro-react-native-babel-preset": "^0.58.0",
    "react-test-renderer": "16.11.0"
  },
  "jest": {
    "preset": "react-native",
    "setupFiles": [
      "./node_modules/react-native-gesture-handler/jestSetup.js"
    ],
    "transformIgnorePatterns": [
      "/!node_modules\\/lodash-es/"
    ]
}
}

// Simple Component test

import React from 'react';
// Note: test renderer must be required after react-native.
import renderer from 'react-test-renderer';
import DeepLink from '../src/components/DeepLink';






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

Aucun commentaire:

Enregistrer un commentaire