Как настроить Jest для работы с Expo SDK 32 - PullRequest
Новая
       135

Как настроить Jest для работы с Expo SDK 32

0 голосов
/ 04 февраля 2019

У меня есть приложение Expo, и я использовал SDK 28. Моя команда решила, что мы должны обновить до последней версии, что означало обновление React Native (поскольку последний SDK использует RN 0,57) и Babel.

Когда мыобновив наши зависимости и исправив наши конфигурационные файлы, Jest начал выдавать нам эту ошибку: 

TypeError: Cannot read property 'fetch' of undefined

      at node_modules/react-native/Libraries/vendor/core/whatwg-fetch.js:6:12
      at Object.<anonymous> (node_modules/react-native/Libraries/vendor/core/whatwg-fetch.js:486:3)
      at Object.<anonymous> (node_modules/jest-expo/src/setup.js:125:16)

После нескольких дней отладки я обнаружил, что это связано с неправильной работой препроцессора babel-jest, хотя я следовал за их установкой docs .

Я покопался еще немного и обнаружил, что есть обходной путь в этом выпуске GitHub .

Внедрение обходного пути, плюс добавление babel-hoist к моему babel.config.js, сделанное так, чтобы тесты начали выполняться.

Однако поведение Jest все шаткое и данные покрытия неверны (некоторые строки считаются непокрытыми, хотя у нас есть тесты для них.

Я хочу знать, как правильно настроить Jest для совместимости с Expo SDK 32.

Этосоответствующие файлы конфигурации (которые настроены на использование упомянутого ранее обходного решения).

package.json *

"dependencies": {
    "@babel/preset-env": "^7.3.1",
    "@expo/vector-icons": "6.3.1",
    "expo": "^32.0.0",
    "prop-types": "15.6.2",
    "react": "16.5.0",
    "react-native": "https://github.com/expo/react-native/archive/sdk-32.0.0.tar.gz",
    "sentry-expo": "~1.9.0"
    ...
  },
  "devDependencies": {
    "@babel/core": "^7.2.2",
    "babel-eslint": "9.0.0",
    "babel-plugin-jest-hoist": "^24.0.0",
    "babel-preset-expo": "^5.0.0",
    "enzyme": "3.8.0",
    "enzyme-adapter-react-16": "^1.8.0",
    "jest-expo": "^32.0.0",
    "metro-react-native-babel-preset": "^0.51.1",
    "react-dom": "^16.5.1",
    ...
  },
"jest": {
    "preset": "jest-expo",
    "transform": {
      "^.+\\.js$": "<rootDir>/jest.preprocessor.js"
    },
    "setupFiles": [
      "<rootDir>/src/jest.setup.js"
    ],
  ...
}

* Некоторые зависимости были опущены.

babel.config.js 

module.exports = {
  presets: [
    'babel-preset-expo',
    'module:metro-react-native-babel-preset',
    'module:react-native-dotenv',
    [
      '@babel/preset-env',
      {
        targets: {
          node: 'current',
        },
      },
    ],
  ],
  sourceMaps: true,
  plugins: [
    'jest-hoist',
    '@babel/transform-react-jsx-source',
  ],
};

Ответы [ 2 ]

0 голосов
/ 13 февраля 2019

Вот что для меня решило проблему:

  • Во-первых, установите yarn.Следуйте по этой ссылке для получения инструкций.
  • Во-вторых, убедитесь, что ваш package.json выглядит примерно так: 
"dependencies": {
    "@expo/vector-icons": "9.0.0",
    "expo": "^32.0.0",
    "prop-types": "15.6.2",
    "react": "16.5.0",
    "react-native": "https://github.com/expo/react-native/archive/sdk-32.0.0.tar.gz",
    ...
  },

"devDependencies": {
    "babel-preset-expo": "^5.0.0",
    "jest-expo": "^32.0.0",
    ...
  }
"scripts": {
    "test": "jest",
    ...
  },
"jest": {
    "preset": "jest-expo",
    "transform": {
      "^.+\\.js$": "babel-jest"
  },
}
  • В-третьих, убедитесь, что babel.config.js настроен правильно.Вот мой проект, в котором запущен Expo SDK 32: 
module.exports = function (api) {
  api.cache(true);
  return {
    presets: [
      'babel-preset-expo',
      'module:react-native-dotenv',
    ],
    sourceMaps: true,
    plugins: [
      '@babel/transform-react-jsx-source',
    ],
  };
};
  • Наконец, используйте yarn для установки ваших пакетов (yarn install) и запуска ваших тестов yarn test.
0 голосов
/ 05 февраля 2019

Экспо автоматически делает настройку шутки.Я думаю, что вы должны сделать 'Expo init newProject', затем прочитать .babelrc и package.json

Ниже приведен результат expo init.Хорошо работает. 

// package.json
{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "eject": "expo eject",
    "test": "node ./node_modules/jest/bin/jest.js --watchAll"
  },
  "jest": {
    "preset": "jest-expo"
  },
  "dependencies": {
    "@expo/samples": "2.1.1",
    "expo": "^32.0.0",
    "react": "16.5.0",
    "react-native": "https://github.com/expo/react-native/archive/sdk-32.0.0.tar.gz",
    "react-navigation": "^3.0.9"
  },
  "devDependencies": {
    "babel-preset-expo": "^5.0.0",
    "jest-expo": "^32.0.0"
  },
  "private": true
}

// babel.config.js
module.exports = function(api) {
  api.cache(true);
  return {
    presets: ['babel-preset-expo'],
  };
};
...