-
Notifications
You must be signed in to change notification settings - Fork 280
如何写单元测试(快速指南)
leejimqiu edited this page Aug 8, 2022
·
2 revisions
首先在 这里 认领任务
在对应组件的 __test__
目录下,一般是创建 index.test.js
文件。
如果使用 VSCode 编辑器的话,可以使用 ttest
快捷指令快速生成模板:
也可以安装 Jest
插件,这样就可以每次保存代码都会执行测试,快速查看结果。
由于已经给所有组件的 DEMO 都添加了 snapshot 测试,因此不需要给组件本身添加 snapshot 测试。
需要关注的是,测试的覆盖率。包括 lines、statements、functions、branches。
要求是,必须每个组件都要至少达到 80% 以上。
资料:
可以参考 checkbox 的写法。
如果写的是 Button
组件的测试用例,可以这样执行 npx jest button
。这样仅会执行 button 的测试用例,可以节省很多时间。
执行完,会默认生成一个可以查看结果的页面: /test/unit/coverage/index.html
。
点击每个具体的文件,可以看到具体哪些语句没有覆盖,比如:
红色部分表示没有覆盖的语句,绿色表示覆盖,绿色的文字表示执行的次数
就可以针对性的写测试用例了。
完成测试用例之后,需要通过徽章的形式,展示目前组件的测试覆盖率。
生成的脚本:
npm run badge button
以上以 Button 组件举例
最后就可以提交代码了。恭喜你,成功完成一份单元测试,往更专业的前端更进一步。
如果遇到问题也可以在 issue 中向我们寻求帮助。