JestJS - 在覆盖率报告中显示所有未覆盖的行答案

【问题标题】：JestJS - show all uncovered lines in coverage reportJestJS - 在覆盖率报告中显示所有未覆盖的行
【发布时间】：2021-03-05 06:02:48
【问题描述】：

当我运行 Jest 覆盖率报告时，它会按文件打印出每种类型的覆盖率和百分比。当有超过 ~4-5 行时，显示未覆盖行的最后一列将被截断。有没有办法打印所有未覆盖的行？

-------------------------------|----------|----------|----------|----------|----------------|
File                           |  % Stmts | % Branch |  % Funcs |  % Lines |Uncovered Lines |
-------------------------------|----------|----------|----------|----------|----------------|
All files                      |    75.57 |    69.18 |    74.21 |    75.83 |                |
 js/components/catalyst        |    80.74 |    72.97 |    80.16 |    81.85 |                |
  JobGroup.jsx                 |    57.14 |       50 |    44.44 |       60 |... 33,34,38,73 |
...etc

这表明 JobGroup.jsx 有第 33、34、38 和 73 行，但还有更多，我想一次看到它们。

【问题讨论】：

看起来像是伊斯坦布尔的硬编码设置。我发现的唯一解决方法是从文件<coveragedir>/lcov-report/index.html 在浏览器中查看报告
@stilllife，我找不到您建议的文件，但这确实促使我检查了我们拥有的cobertura-coverage.xml 报告，并且确实有我需要的东西（经过一些挖掘）！谢谢！如果将来有其他人正在阅读此文件并且拥有cobertura-coverage.xml 文件，则具有hits="0" 的行是未覆盖的行。
我敢打赌有更好的方法。例如，Lab.js 输出一个不错的 html 覆盖率报告，其中每行 iirc 的命中数

标签： unit-testing jestjs code-coverage

【解决方案1】：

有没有办法打印所有未覆盖的行？

我正在使用 React + TypeScript + Jest。在我的项目中，我运行npm test -- --coverage，剩余未覆盖行的文件位于coverage 目录下：

<project name>\<directory>\<directory>\coverage\lcov-report\index.html

（您的文件路径可能与coverage 部分有所不同。:-)）

然后我导航到感兴趣的文件：

所有以粉红色突出显示的行都未被覆盖：

【讨论】：

这很好用！我要补充的唯一nit是，目前，只要您使用的是最新版本的 Yarn（1.0 及更高版本），就不需要额外的 -- in CLI 命令。它可以简单地是npm test --coverage

【解决方案2】：

这是另一种解决方案，可能对某些人有所帮助。

就我个人而言，我使用 VSCode，并且有一个名为“代码覆盖率”的插件可用，它的功能类似于 Super Jade 的另一个答案，只是它会在您运行覆盖率测试后突出显示代码，就像这样.

【讨论】：