将 Jest 覆盖阈值添加到 create-react-app 项目

Posted

技术标签:

【中文标题】将 Jest 覆盖阈值添加到 create-react-app 项目【英文标题】:Add Jest coverage threshold to create-react-app project 【发布时间】:2017-10-09 23:20:04 【问题描述】:

这是最初使用create-react-app 生成的package.json 文件的"scripts" 部分:

"scripts": 
  "start": "concurrently \"react-scripts start\" \"node server.js\"",
  "build": "react-scripts build",
  "eject": "react-scripts eject",
  "test": "react-scripts test --env=jsdom --coverage --watchAll",
  "start:server": "node server"
,

我想将 Jest 配置为具有这样的 coverage threshold:

"jest": 
  "coverageThreshold": 
    "global": 
      "branches": 100,
      "functions": 100,
      "lines": 100,
      "statements": 100
    
  

但是,当我运行 yarn test 时,它看起来不像 "jest" 部分正在执行。我需要添加一些额外的东西吗?这个项目是用create-react-app 构建的?

谢谢!

【问题讨论】:

【参考方案1】:

package.json

    将新的npm script 添加到报道中
"scripts": 
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "coverage": "npm test -- --coverage",
    "eject": "react-scripts eject"

    并添加jest config
"jest": 
    "coverageThreshold": 
      "global": 
        "statements": 100,
        "branches": 50,
        "functions": 100,
        "lines": 100
      
    
  ,
    npm run coverage

【讨论】:

【参考方案2】:

可以覆盖create-react-app#coverage-reporting 指示的某些覆盖率报告指标。请注意,这必须在您的 package.json 中配置,因为这是 create-react-app 查找您覆盖的地方(也就是不在 .jestrcjest.config.js 文件中)。但正如@Andreas 提到的,如果您想要完全控制,请弹出或创建自己的配置。

作为旁注,您可以使用 --config 标志和 test 脚本(来自 jest)从 create-react-app 中提取 jest 配置,然后将其复制到您自己的配置中更新。可能比弄清楚 create-react-app 正在做什么更容易。

【讨论】:

【参考方案3】:

现在,react-app-rewired 可能是一条新的道路。

您可以在此处提到的 jest 部分中在 package.json 中配置 Jest: https://github.com/timarney/react-app-rewired#2-jest-configuration---testing

【讨论】:

【参考方案4】:

问题在于create-react-app 使用自己的设置here。最简单的方法是弹出:npm run eject,以完全控制设置。

另一种方法是将所有设置复制到您自己的设置中并使用附加参数--config=<pathToYourSettings>开始测试

【讨论】:

【参考方案5】:

你可以参考这个最新的链接:Configuring threshold limit

通过将其添加到您的 package.json:

"jest": 
    "coverageThreshold": 
      "global": 
        "branches": 75,
        "functions": 75,
        "lines": 75,
        "statements": 75
      
    
  

【讨论】:

以上是关于将 Jest 覆盖阈值添加到 create-react-app 项目的主要内容,如果未能解决你的问题,请参考以下文章

提交中单个文件更改时的全局与单个文件覆盖阈值

使用 create-react-app 和 node 设置 jest 多项目

在 JEST + ENZYME 中无法达到 100% 的分支覆盖率

如何将自定义消息添加到 Jest 期望?

在 NestJS Jest 测试中覆盖提供程序

多行var声明上的Jest单元测试分支覆盖率