Как использовать Jest с React Native

Раздел тестирования документов для React Native предполагает, что Jest является официальным способом проведения модульных тестов. Однако они не объясняют, как настроить его. Запуск Jest без какой-либо установки дает синтаксические ошибки (без номеров строк:(), потому что он не применяет преобразования (например, функции ES6, JSX и поток), которые, как правило, используют React Native. Там находится папка jestSupport в React Исходный источник пытается содержать env.js и scriptPrerocess.js, последний имеет код для применения преобразований. Поэтому я скопировал их в свой проект и добавил следующий раздел в свой пакет package.json:

  "jest": {
    "scriptPreprocessor": "jestSupport/scriptPreprocess.js",
    "setupEnvScriptFile": "jestSupport/env.js"
  },

Это исправляет первую ошибку, но я все равно получаю следующую ошибку:

Using Jest CLI v0.4.0
 FAIL  js/sync/__tests__/SynchronisedStorage-tests.js
SyntaxError: /Users/tom/my-project/js/sync/__tests__/SynchronisedStorage-tests.js: /Users/tom/my-project/js/sync/SynchronisedStorage.js: /Users/tom/my-project/node_modules/react-native/Libraries/react-native/react-native.js: /Users/tom/my-project/node_modules/react-native/node_modules/react-tools/src/browser/ui/React.js: /Users/tom/my-project/node_modules/react-native/node_modules/react-tools/src/utils/ReactChildren.js: /Users/tom/my-project/node_modules/react-native/node_modules/react-tools/src/addons/ReactFragment.js: /Users/tom/my-project/node_modules/react-native/node_modules/react-tools/src/classic/element/ReactElement.js: /Users/tom/my-project/node_modules/react-native/node_modules/react-tools/src/core/ReactContext.js: /Users/tom/my-project/node_modules/react-native/node_modules/react-tools/src/vendor/core/warning.js: Unexpected token .
1 test failed, 0 tests passed (1 total)
Run time: 0.456s

Есть ли еще что мне нужно сделать, чтобы Jest понял React Native? Есть ли примеры установки Jest для тестирования React Native?

EDIT:

В scriptPreprocess произошла проверка, которая помешала ему запустить какой-либо файл в node_modules, который, конечно же, включал всю React Native. Удаление, которое исправляет ошибку выше. Однако теперь я получаю больше ошибок от источника React Native, он определенно кажется, что он не предназначен для запуска в Jest.

EDIT2:

Явная настройка макета для модуля react-native работает:

jest.setMock('react-native', {});

Похоже, что это будет очень ручным и не очень полезно для тестирования кода, который много взаимодействует с React Native API. Я определенно все еще чувствую, что мне что-то не хватает!

Ответ 1

У меня есть Jest для работы с моим React Native, и он без проблем запускает тесты на файлы с преобразованиями ES6 и ES7.

Чтобы заставить Jest работать, я выполнил следующие шаги:

Скопирована папка jestSupport из репозитория React Native master в мою папку react-native в node_modules.
Отредактировал строку "jest" в моей packages.json, чтобы указать на файлы в папке jestSupport

Теперь строка "jest" в моем packages.json выглядит следующим образом:

"jest": {
  "scriptPreprocessor": "<rootDir>/node_modules/react-native/jestSupport/scriptPreprocess.js",
  "setupEnvScriptFile": "<rootDir>/node_modules/react-native/jestSupport/env.js",
  "testFileExtensions": [
    "js"
  ],
  "unmockedModulePathPatterns": [
    "source-map"
  ]
},

Ответ 2

Как и в случае с React Native v0.37.0, Jest является частью нового шаблона приложения.

В новом приложении вы можете сразу запустить тесты:

$ react-native init MyAwesomeApp
$ cd MyAwesomeApp
$ npm test
...
Tests:       2 passed

Ответ 3

Для более новых версий jest настройка его для react-native очень проста.

Установите jest с помощью

npm install --save-dev jest-cli babel-jest

В package.json добавьте это

"scripts": {
  "start": "babel-node ./server/server.js",
  "import-data": "babel-node ./scripts/import-data-from-parse.js",
  "update-schema": "babel-node ./server/schema/updateSchema.js",
  "test": "jest",
  "lint": "eslint ."
},
"jest": {
  "haste": {
    "defaultPlatform": "ios",
    "platforms": [
      "ios",
      "android"
    ],
    "providesModuleNodeModules": [
      "react-native"
    ]
  }
},

Вам может потребоваться добавить строки, связанные со шуткой

Теперь вы можете использовать

npm test

для запуска шутки.

Обратитесь к f8app github repo, чтобы найти больше об этом.