Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Jest unit tests fail when upgrading to react native 0.66.0

See original GitHub issue

Description

Upgrading project from react-native 0.63.2 to 0.66.0 caused jest tests to fail Note: The project setup was working fine with react-native 0.63.x.

 ● Test suite failed to run

    Unknown option: .browserslistConfigFile. Check out https://babeljs.io/docs/en/babel-core/#options for more information about options.

      at throwUnknownError (node_modules/@babel/core/lib/config/validation/options.js:124:27)
      at node_modules/@babel/core/lib/config/validation/options.js:109:5
          at Array.forEach (<anonymous>)
      at validateNested (node_modules/@babel/core/lib/config/validation/options.js:85:21)
      at validate (node_modules/@babel/core/lib/config/validation/options.js:76:10)
      at loadPrivatePartialConfig (node_modules/@babel/core/lib/config/partial.js:78:50)
          at loadPrivatePartialConfig.next (<anonymous>)
      at loadFullConfig (node_modules/@babel/core/lib/config/full.js:57:46)
          at loadFullConfig.next (<anonymous>)
      at Function.<anonymous> (node_modules/@babel/core/lib/config/index.js:33:43)

React Native version:

System:
    OS: macOS 11.6
    CPU: (16) x64 Intel(R) Core(TM) i9-9980HK CPU @ 2.40GHz
    Memory: 7.24 GB / 32.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 14.17.1 - /usr/local/bin/node
    Yarn: 1.22.10 - /usr/local/bin/yarn
    npm: 6.14.15 - ~/Desktop/work/wix/react-native-navigation/node_modules/.bin/npm
    Watchman: 2021.09.27.00 - /usr/local/bin/watchman
  Managers:
    CocoaPods: 1.10.1 - /usr/local/bin/pod
  SDKs:
    iOS SDK:
      Platforms: iOS 13.4, DriverKit 19.0, macOS 10.15, tvOS 13.4, watchOS 6.2
    Android SDK: Not Found
  IDEs:
    Android Studio: 2020.3 AI-203.7717.56.2031.7678000
    Xcode: 11.4.1/11E503a - /usr/bin/xcodebuild
  Languages:
    Java: 11.0.11 - /usr/bin/javac
  npmPackages:
    @react-native-community/cli: Not Found
    react: 17.0.2 => 17.0.2 
    react-native: 0.66.0 => 0.66.0 
    react-native-macos: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

Steps To Reproduce

Follow React Native Upgrade Helper to upgrade, tests are failing.

Expected Results

Unit tests running normally.

Snack, code example, screenshot, or link to a repository:

Dependencies:

  "devDependencies": {
    "@babel/core": "~7.12.9",
    "@babel/runtime": "~7.12.5",
    "@babel/plugin-proposal-export-default-from": "7.10.1",
    "@babel/plugin-proposal-export-namespace-from": "7.10.1",
    "@babel/types": "7.6.x",
    "@react-native-community/blur": "^3.6.0",
    "@react-native-community/datetimepicker": "^3.4.7",
    "@react-native-community/eslint-config": "^2.0.0",
    "@react-native-community/netinfo": "^5.9.4",
    "@testing-library/jest-native": "^4.0.1",
    "@testing-library/react-native": "^7.2.0",
    "@types/detox": "16.4.1",
    "@types/hoist-non-react-statics": "^3.0.1",
    "@types/jasmine": "3.5.10",
    "@types/jest": "26.0.3",
    "@types/lodash": "^4.14.149",
    "@types/react": "16.9.41",
    "@types/react-native": "0.63.1",
    "@types/react-test-renderer": "16.9.2",
    "@typescript-eslint/eslint-plugin": "3.3.0",
    "@typescript-eslint/parser": "3.3.0",
    "babel-jest": "^26.6.3",
    "clang-format": "^1.4.0",
    "detox": "18.19.0",
    "eslint": "7.3.0",
    "eslint-config-prettier": "6.11.0",
    "eslint-plugin-prettier": "3.1.4",
    "github-release-notes": "https://github.com/yogevbd/github-release-notes/tarball/e601b3dba72dcd6cba323c1286ea6dd0c0110b58",
    "husky": "4.2.5",
    "identity-obj-proxy": "3.0.0",
    "jest": "^26.6.3",
    "jest-circus": "^26.6.3",
    "lint-staged": "10.2.11",
    "metro-react-native-babel-preset": "^0.66.2",
    "prettier": "2.1.2",
    "react": "17.0.2",
    "react-native": "0.66.0",
    "react-native-fast-image": "^8.3.4",
    "react-native-gesture-handler": "^1.6.1",
    "react-native-reanimated": "^1.9.0",
    "react-native-ui-lib": "5.11.0",
    "react-redux": "5.x.x",
    "react-test-renderer": "17.0.2",
    "redux": "3.x.x",
    "semver": "5.x.x",
    "shell-utils": "1.x.x",
    "ts-mockito": "^2.3.1",
    "typedoc": "0.x.x",
    "typescript": "3.9.5",
    "detox-testing-library-rnn-adapter": "2.x.x",
    "remx": "3.x.x"
  },
  "jest": {
    "preset": "react-native",
    "transform": {
      "^.+\\.js$": "<rootDir>/node_modules/react-native/jest/preprocessor.js"
    },
    "roots": [
      "<rootDir>/lib/src/",
      "<rootDir>/playground/src/",
      "<rootDir>/integration/",
      "<rootDir>/scripts/",
      "<rootDir>/e2e/"
    ],
    "setupFilesAfterEnv": [
      "./jest-setup.js"
    ],
    "moduleNameMapper": {
      "react-native-navigation/Mock": "<rootDir>/lib/src/Mock",
      "react-native-navigation": "<rootDir>/lib/src",
      "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/playground/img/layouts@2x.png"
    },
    "collectCoverageFrom": [
      "lib/src/**/*.ts",
      "lib/src/**/*.tsx",
      "integration/**/*.js",
      "!lib/dist/index.js",
      "!lib/dist/Navigation.js",
      "!lib/dist/adapters/**/*",
      "!lib/dist/interfaces/**/*",
      "!lib/dist/**/*.test.*",
      "!integration/**/*.test.*",
      "!integration/*.test.*",
      "!e2e/**/*test.js"
    ],
    "resetMocks": true,
    "resetModules": true,
    "coverageReporters": [
      "json",
      "lcov",
      "text",
      "html"
    ]
  },

Babel.config:

module.exports = function (api) {
  api && api.cache(false);
  return {
    presets: ['module:metro-react-native-babel-preset'],
    plugins: [
      '@babel/plugin-proposal-export-namespace-from',
      '@babel/plugin-proposal-export-default-from',
    ],
  };
};