#javascript #reactjs #react-native #jestjs #react-navigation
#javascript #reactjs #react-native #jestjs #react-навигация
Вопрос:
Я работаю с react-native 0.59 и хочу написать свои первые тесты для своего приложения. Итак, читая документы react, мне просто нужно запустить следующую команду yart test
, которая выполняет следующий файл:
import 'react-native';
import React from 'react';
import App from '../App';
// Note: test renderer must be required after react-native.
import renderer from 'react-test-renderer';
it('renders correctly', () => {
renderer.create(<App />);
});
Это файл по умолчанию для тестирования при запуске приложения с помощью react-native. Но когда я запускаю yarn test
command, тест завершается неудачно. Обратная трассировка выглядит следующим образом:
FAIL __tests__/App-test.js
● Test suite failed to run
TypeError: (0 , _reactNavigation.createBottomTabNavigator) is not a function
43 |
> 44 | const MainStack = createBottomTabNavigator({
| ^
45 | Home: { screen: Home },
46 | Pets: { screen: Pets },
47 | Notifications: { screen: UserNotifications },
at Object.<anonymous> (src/app-navigator.js:44:63)
at Object.<anonymous> (src/Reducers/navigation.js:2:44)
Это часть моего app-navigator.js
файла:
const PetStack = createStackNavigator({
UpdatePet: { screen: UpdatePet },
}, {
mode: 'card',
defaultNavigationOptions: {
headerStyle: { backgroundColor: 'transparent' }
}
});
const MainStack = createBottomTabNavigator({
Home: { screen: Home },
Pets: { screen: Pets },
Notifications: { screen: UserNotifications },
UpdateUser: { screen: UpdateUser },
});
Это неудачные строки. Это так странно, потому что, когда я console.log
createStackNavigator
регистрирую издевательскую функцию, но когда я делаю это с createBottomTabNavigator
ее помощью, она регистрируется undefined
.
Это моя конфигурация jest:
"jest": {
"preset": "react-native",
"verbose": true,
"transform": {
"^. \.js$": "<rootDir>/node_modules/react-native/jest/preprocessor.js"
},
"globals": {
"NODE_ENV": "test"
},
"moduleFileExtensions": [
"js"
],
"moduleDirectories": [
"src",
"node_modules"
],
"transformIgnorePatterns": [
"/node_modules/(?!native-base|react-native-localize|react-navigation|react-navigation-redux-helpers)/"
],
"setupFiles": [
"./jest-setup.js"
]
}
Я прочитал некоторые связанные с этим проблемы и только что нашел это. Они рекомендуют установить для ключа inlineRequires
значение false
in node_modules/react-native/jest/preprocessor.js
, но у меня это не работает
Комментарии:
1. У меня такая же проблема, и я не могу понять, как ее исправить. Пожалуйста, обновите свой пост, если найдете решение
2. Я не нашел никаких обновлений, но, прочитав его, кажется, что это невозможно сделать, вам нужно высмеять весь процесс навигации @YanivShnaider
3. @GermanAlzate я сталкиваюсь с такой же проблемой. любое решение?
Ответ №1:
создайте файл jest.config.js
в корне вашего проекта, куда package.json
будет помещен file .
// jest.config.js
const {defaults} = require('jest-config');
module.exports = {
moduleFileExtensions: [...defaults.moduleFileExtensions, 'ts', 'tsx'],
};
Для получения более подробной информации см. Это