使用 jest 编写流式测试

Question

我正在尝试测试我使用 jest 构建的 React Native 模块。我目前有一个在执行jest 时运行的测试文件，它看起来像这样：

import 'react-native';
import React from 'react';
import App from '../App';
import {MySDK} from 'react-native-mysdk’


it(‘test1’, () => {
  MySDK.API();
});

当我运行jest 时，我得到了

      API(): Promise<string> {
                        ^

    SyntaxError: Unexpected token :

我的 babel.config.js 看起来像：

module.exports = {
  presets: ["module:metro-react-native-babel-preset"]
}

我的 package.json 看起来像：

  "dependencies": {
    "@babel/runtime": "^7.0.0",
    "babel-cli": "^6.26.0",
    "babel-eslint": "^8.2.2",
    "babel-plugin-module-resolver": "^3.1.3",
    "babel-preset-flow": "^6.23.0",
    "babel-preset-react-native": "2.1.0",
    "flow-typed": "^2.3.0",
    "flow-bin": "^0.92.0",
    "react": "16.6.3",
    "react-native": "0.58.3”,
   “react-native-mysdk”: “0.0.1”
  },
  "devDependencies": {
    "babel-jest": "16.0.0",
    "babel-preset-react-native": "1.9.0",
    "jest": "16.0.2",
    "jest-react-native": "16.0.0",
    "react-test-renderer": "15.3.2"
  },
  "jest": {
    "preset": "react-native"
  }

我尝试使用以下命令更新我的 babel 文件：

module.exports = {
  presets: ["module:metro-react-native-babel-preset", "@babel/preset-flow"],
  plugins: ["@babel/plugin-transform-flow-strip-types"]
}

但我得到了同样的错误。

如何将 jest 与使用 jest 的 javascript 文件一起使用？

Answer 1

运行测试时，您需要使用@babel/plugin-transform-flow-strip-types 插件来删除流类型。安装它并将其作为插件数组项添加到您的 babel 配置文件中。或者，您可以使用已包含所需插件的@babel/preset-flow。

见：https://babeljs.io/docs/en/babel-preset-flow

示例设置

您需要安装以下软件包：

npm i --save jest module:metro-react-native-babel-preset babel-jest @babel/preset-env @babel/core @babel/preset-flow

jest 的 package.json 配置应该是：

"jest": {
  "transform": {
    "^.+\\.jsx?$": "babel-jest"
  }
}

您的babel.config.js 应该是：

module.exports = {
  "presets": [
    [
      "@babel/preset-env",
      {
        targets: {
          node: 'current',
        }
      },
    ],
    "module:metro-react-native-babel-preset",
    "@babel/preset-flow"
  ],
}