前端单元测试场景
大家好,我是晨光,5 年前端开发,现在携程担任高级前端开发。上篇 https://t.zsxq.com/0fkYvv1S6 ,鱼皮评论说对前端没接触过测试的同学应该很有帮助,所以接上一篇单元测试相关的内容 ,晨光今天分享一些单测具体的写法。
一、如何写单元测试
组里面采用的 jest 写测试用例,配置简单,上手容易。
但一开始,晨光不太熟悉怎么写,就根据已有的 test 进行模仿,感觉摸着门路后,写了几个文件的用例,但是覆盖率却一直上不去。
后来发现,需要每一行都执行到才行,而晨光写的 test 只覆盖到很少的一部分。比如
- 回调函数内部的方法都没有执行到;
- if else 只执行的了 if ;
- try catch 只执行了 try ;
- switch case 只执行了 其中一种 case
后来经过摸索,找到了一些解决办法
1、回调函数
mock 那个需要传入 callback 的函数,内部执行 callback 即可,具体 Demo 如下
这个是对应的测试用例的写法
2、if else
通过不断 mock 传入的值,函数执行多次,把 if else 都走一遍。
这里可结合 1,3 查看,多次执行,根据入参或者 mock 不同,会走到不同的 if else 分支
3、try catch
可以多次执行此方法,mock try 内部的某个方法 Reject error,外部就可以 catch 到
第一个callback 相关的函数中存在 try catch,所以就假设这样,覆盖 catch 的部分,测试用例如下
4、switch case
和 if else 一样,多次 mock ,多次执行即可。
二、写单元测试的好处
好的单元测试是为了检查代码的问题,而不是为了覆盖率而写单元测试,但现在做需求的时候,可能会出现时间紧,来不及写,到后面再补测试用例的人和开发的人不是同一个,所以就有了为了覆盖率而写的情况。
写单元测试的好处:
1、可覆盖多种场景
2、检测代码中存在的问题,保证代码质量
一开始晨光觉得单测就是纯粹的为了提升覆盖率而写,直到写某个 case 时,发现某个分支一直覆盖不到,回过头认真查看了代码后,发现是逻辑写的有问题。反馈给对应开发,调整后,覆盖率上去了,代码看着也没什么问题了。
直到这时候,晨光才发现,写单元测试确实可以检测出代码中存在的问题。「存在即合理」
以上,全文完,具体的写法,大家可以多多尝试,熟能生巧~
