开玩笑测试无法通过反应导航正常运行

Question

我正在使用 react-native 0.59，我想为我的应用程序编写我的第一个测试。 所以阅读反应文档我只需要运行以下命令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命令时，测试失败了。 追溯如下：

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": {
  "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"
  ]
}

我已经阅读了一些相关问题并且刚刚发现了这个。 他们建议在node_modules/react-native/jest/preprocessor.js中将键inlineRequires设置为false但这对我不起作用

Answer 1

在放置package.json文件的项目根目录下创建文件jest.config.js 。

// jest.config.js
const {defaults} = require('jest-config');
module.exports = {
  moduleFileExtensions: [...defaults.moduleFileExtensions, 'ts', 'tsx'],
};

有关详细信息，请参阅此