关于单元测试这个概念,我想很多前端的小伙伴都知道,但是却并不一定能描述清楚。由于我开始接触单元测试还是在四个月前,当时也只是做了一些纯函数的单元测试。所以在这里只能说浅谈一下前端单元测试。
什么是单元测试?
我理解的单元测试就是用于测试一个模块能否到达预期效果。通过代码来定义一个可用的衡量标准,并且可以快速检验。
为什么要做单元测试?
随着前端的快速发展,各类框架层出不穷,前端实现的业务逻辑也越来越复杂,这时单元测试的作用就凸显出来了。其实目前为止还是有很多代码是缺少单测的,只是现在单测的重视程度越来越高了而已。单测的好处不言而喻,首先可以提高代码的正确性,在上线前做到心里有底。其次当代码需要重构时,有测试用例做后盾,就可以大胆进行重构。然后从学习曲线来看,单元测试比较容易上手,覆盖的范围比较全面。
测试框架
目前的测试框架很多,今天咱们单拎出来Jest来说一下。
Jest是Facebook出品的通用测试框架
一个好用的JavaScript测试框架,开箱即用,无需配置 。
适用但不局限于使用以下技术的项目:Babel,Typescript,Node,React,Angular,Vue
整个工具放在一个地方,好书写好维护,非常方便
开始使用
安装Jest
yarn add --dev jest 或npn install --save-dev jest
配置package.json
测试用例
运行结果
npm run test 开始运行,得到测试结果
当然这并不是上面例子的测试结果,只是找了张图片来给大家看一下测试结果是什么样子的。
单测的质量很重要,覆盖率一定程度上客观反应了单测的质量。
拓展
这一期我们只是浅谈了一下前端的单元测试和Jeat,而且我们是在node里做测试,如果要在浏览器里做单测应该怎么办,这里就需要去更加深入了解关于Ui Jest的知识了。
作者:前端卷心菜
原文链接:https://blog.csdn.net/m0_63588797/article/details/123373947