前言
karma-threshold-reporter 是一个 npm 包，提供了一个 Custom Reporter，可以让 karma 在测试结束后输出测试覆盖率结果。这篇文章会介绍如何使用它来统计测试覆盖率，并且将结果输出到控制台或 html 文件中。
步骤
安装
使用 npm 安装 karma-threshold-reporter：
npm install karma-threshold-reporter --save-dev
配置 karma.conf.js
在 karma 的配置文件 karma.conf.js 中，添加 reporters 配置，将 karma-threshold-reporter 加入到 reporters 数组，还需要指定一个参数，用来判断是否需要输出 html 文件。
-- -------------------- ---- -------
-------------- - -------- -------- -
------------
-- ---
---------- --------------------
------------------ -
----------- ---
--------- ---
---------- ---
------ ---
----- ----- -- ---- ---- --
-
---
--上面的配置中，statements、branches、functions 和 lines 分别表示覆盖率的四个维度，可以根据具体应用场景来修改需要达到的阈值。如果需要生成 html 报告，将 html 参数改为 true 即可。
运行测试
可以在项目根目录下运行以下命令进行测试：
karma start karma.conf.js
当测试完成后，karma-threshold-reporter 可以将测试结果以简洁的方式输出到控制台上，同时也可以生成简单的 html 报告。
示例代码
这里以使用了 karma-threshold-reporter，并将重要部分用注释标出的 karma.conf.js 代码为例：
-- -------------------- ---- -------
-------------- - -------- -------- -
------------
-- ---- ---- ---- ---- -- ---- -- ------- --- -------- ---- ------ --------
--------- ---
-- ---------- -- ---
-- --------- ----------- ----------------------------------------------
----------- --------- --------
-- ---- -- ----- - -------- -- ---- -- --- -------
------ -
-- -------- ---------- -
----------------------------
-------------------
--
-- ---- -- ----- - -------- -- -------
-------- ---
-- ---------- -------- ----- ------ ------- ---- -- --- -------
-- --------- -------------- ---------------------------------------------------
-------------- -
-- ------------ -------------- -
-------------------- ----------- ------------
--
-------- -
-- ------- ------------- ------------------ ---
----- --------------
------- -
------ -
-
----- --------
-------- ---------------
------- ---------------
-------- -
-------- ---------------------
-
-
-
--
-------- -------------------
--
-- -- -------------- ------
-- ------ --------------- - -------------------- ---- --------------
----------------- -
---- -----------
---------- -
------ ----------------
------ -------
--
-------------------- -
--------- ----------- -----
-
--
-- --------------- --
---------- --------------------
-- ---------------------------------
------------------ -
----------- ---
--------- ---
---------- ---
------ ---
----- -----
--
-- --------------------- - --- ------- ------- ----
-- --------- ------- ---------- -----------------------------------------------
--------- -----------
-- ---------------
---------- -----
-- --------
---------- -----
-- ------
------- -
------ -
-- ---------------
-------- -----
-
--
-- ----------- -----
-- --- ---- ------- ------ -- ------- ------------
------------ --------
---
--总结
karma-threshold-reporter 可以很好地帮助我们判断测试覆盖率是否已经达到预期，方便我们快速发现测试不足的地方，因此在进行前端单元测试时非常有用。尝试着在自己的项目中使用它吧，相信它会给你带来惊喜的效果。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/77706