如何使用react测试库在react中获得代码覆盖率

Question

我使用react测试库(@jest library/react&@jest library/dom)和jest-dom(@jest library/jest-dom)编写了单元测试。我能够成功运行我的测试。

我没有使用jest/jest-cli完全包。我正在使用react测试库和jest-dom(@jest 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