如何在React测试库中获得代码覆盖率

Question

我已经使用react测试库（@ testing-library / react和@ testing-library / dom）和jest-dom（@ testing-library / jest-dom）编写了单元测试。我能够成功运行测试。

我没有使用jest / jest-cli完整文件。我正在使用反应测试库以及该jest-dom（@ testing-library / jest-dom），它可能是一些子功能，或者我不确定该如何准确地称呼它。

如何使用React测试库获得代码覆盖率？

Answer 1

好吧， create-react-app 为您提供了很多便利，但同时也施加了一些限制...

您不能仅将标志--coverage添加到npm run test，因为该脚本已经在监视模式下运行您的测试（以及仅运行失败的测试之类的事情，以及您可以在互动模式仍然会影响您的覆盖率报告。

首先，请在单运行模式下运行测试。

CI=true react-scripts test --env=jsdom

并且由于您的package.json中已经包含测试任务，因此可以简化任务：

CI=true npm test -- --env=jsdom

好的，我们越来越近了... 因此，现在，在此之上添加--coverage标志，一切就绪：

CI=true npm test -- --env=jsdom --coverage

总结您的npm任务可能是这样的：

"test:coverage": "CI=true npm test -- --env=jsdom --coverage"

然后您将在终端中看到您的报告，并且将生成coverage文件夹，并且您可以在其中看到很多有用的信息！

Answer 2

由于react-scripts已合并jest配置，因此您只需输入 npm run test --coverage或yarn test --coverage，以生成覆盖率报告。

Answer 3

此问题的实际答案是：npm test -- --coverage never exits

RTL不提供测试覆盖率统计信息，但是如果您运行，Jest可以提供：

npm run test:coverage

Answer 4

您在说命令吗？运行npm run coverage