什么是单元测试
先上个图
这个图我们很熟悉,这个在大学某软件课程里会看到这个,这是一个简易的软件的生命周期。
可以看到我们单元测试对应的是编码。单元测试是对我们软件中的最小可测试单元进行检查和验证,比如一个函数,一个模块。单元测试一般来说是开发人员去执行,剩下的集成测试,系统测试等由专业的测试人员来进行。
单元测试不需要访问数据库
单元测试不需要访问网络
单元测试不需要访问文件系统
为什么要使用单元测试
1. 可以验证代码的正确性,在上线前心里有底
2. 一次编写,多次运行,就不需要我们在代码里console打印
3. 便于重构,有测试用例在,我们方便知道重构后的代码是否正确
怎么使用单元测试 --Jest
1. Jest是什么
Jest是一个JavaScript测试框架,旨在确保任意JavaScript代码的正确性。 它允许你用可访问的、熟悉的和功能丰富的 API 来写测试,让你快速获得结果。
Jest文档齐全,仅需很少的配置,可以扩展到符合你的要求。
Jest使测试变得愉快。
---Jest 核心团队
2. 引入jest
引入方式分为两种,一种是创建项目时引入,一种是创建时没有引入,后期引入。
2.1 初始化时引入
用git bash执行`vue create demo`时发现交互提示符不工作,
搜了一下,发现要通过`winpty vue.cmd create demo`去运行,
然后不想每次都写那么长的命令的话,可以在Git/etc下的bash.bashrc文件的最后一行加入如下代码
这样就能可以用`vue create`
单元测试中选中Jest即可
2.2 后期引入
昨天下午大佬说你现在好像没有什么事情了,我把Jest加入到了项目,你自己看看,看懂了做个分享。
所以没有接触过单元测试的我开始了 走向掉更多头发 走向光明的道路。
我们主要是介绍后期引入这种方法, 愚蠢 机智的我通过上面的方法创建了一个新项目,然后去package.json,看用到了哪些包,然后下载下来,主要用到下面这几个
2.2.1 jest && ts-jest && @types/jest
首先我们在项目的根目录在终端打开,输入
2.2.2 @vue/cli-plugin-babel
2.2.3 @vue/cli-plugin-unit-jest
运行后会发现,package.json会多了如下三行
Vue Test Utils 是 Vue.js 官方的单元测试实用工具库。
可以看到我们scripts多了一个命令`test:unit`,我们可以改写成"test": "jest",不改也没有什么问题
我们安装这个@vue/cli-plugin-unit-jest依赖的时候,会在根目录下生成一个test文件夹,和一个jest配置文件jest.config.js
Jest识别三种测试文件,以.test.j/ts结尾的文件,以.spec.j/ts结尾的文件,和放到__tests__ 文件夹中的文件
结束语
怎么具体使用Jest将在下篇文章中详细介绍
想要了解更多知识,可以关注我的公众号