前端自动化测试框架Jest介绍和使用
在实际项目的自动化测试过程中,如果只有这两个方法,很显然,是远远不够的,这时候,就需要我们对之前的方法进行扩充,同时还有很多自动化的机制需要集成进去。这时候 Jest 闪亮登场!
Jest 框架介绍
一个优秀的自动化测试框架,在以下三个方面应该比较突出:
- 性能好
- 功能齐全
- 易用性很好
Jest 在这三个方面做的非常好(当然了,像Jasmine、mocha这些主流前端测试框架做的也不错)。
这些主流前端测试框架使用的方法、原理上都差不多,实际上,我们学会了一个,另外几个也就很容易的继续学习了,所以这篇文章只讲解 Jest。
那么 Jest 具体好用在哪些方面呢?
答案是这些:
速度快(可以自动监测修改过的代码,不会重复测试)
API 简单、数量少
易配置
隔离性好
监控模式
IDE 整合(比如vs code)
Snapshot(快照测试)
多项目并行
覆盖率
Mock 丰富
对新技术支持度好
使用Jest修改自动化测试样例
在上面的部分,我们自己写了一些测试代码对 Math 库进行了测试,现在我们要使用 Jest 对 Math 进行重新测试。
首先打开编辑器,进入到控制台(为了避免不必要的麻烦,建议大家跟我一样使用vs code)。
第1步:初始化npm环境
npm init
在执行命令的时候会遇到一些选项或者问题,无脑按回车即可,如果看到目录下出现了一个 package.json 文件,那么这就是一个标准的 npm 包了。
第2步:安装依赖
npm install jest -D
注:-D 是 --save -dev 的缩写。
如果看到 Jest 出现在了 package.json 文件中,并且目录中出现了 node_modules 文件夹,就说明安装成功了。
第3步:修改之前的代码
首先删除之前写的 test 方法 和 expect 方法 的实现过程,因为 Jest 自带了这两个方法,我们不需要手动实现。然后采用模块化的标准,将 math.js 中的方法导出:
// math.jsfunction add(a, b) {return a + b;
}function minus(a, b) {return a - b;
}function multi(a, b) {return a * b;
}module.exports = { add, minus, multi };
然后在 math.test.js 文件中引入这几个方法:
// math.test.jsconst { add, minus, multi } = require("./math");test("测试加法 3 + 3", () => {expect(add(3, 3)).toBe(6);
});test("测试减法 3 - 3", () => {expect(minus(3, 3)).toBe(0);
});test("测试乘法 3 * 3", () => {expect(multi(3, 3)).toBe(9);
});
第4步:配置 package.json 文件
将如下代码添加到 package.json 中:
"scripts": {"test": "jest"
},
第5步:执行测试代码
完成配置之后,运行 yarn test 或者 npm run test ,控制台将输出如下信息:
假设这个时候,我们把第三个测试用例的结果改成错误值:
// math.test.jsconst { add, minus, multi } = require("./math");test("测试加法 3 + 3", () => {expect(add(3, 3)).toBe(6);
});test("测试减法 3 - 3", () => {expect(minus(3, 3)).toBe(0);
});test("测试乘法 3 * 3", () => {expect(multi(3, 3)).toBe(10); // 错误的结果
});
重新运行 yarn test 或者 npm run test,可以看到如下结果:
可以看到,控制台报出了错误:乘法测试没有通过,期待值(Expected)是10,但是返回值是(Received)9。
然后我们再把测试结果改成正确的值,重新执行命令行,就能得到正确的测试结果了。
这个时候,说明Jest 这个框架已经被我们正确的使用了。
前端自动化测试框架Jest介绍和使用相关推荐
- 前端自动化测试框架 Jest 极简教程
前端自动化测试框架 Jest 极简教程 Delightful JavaScript Testing. https://jestjs.io Jest是由Facebook发布的开源的.基于Jasmine的 ...
- 前端自动化测试框架Jest中的Mock
众所周知,在前面的代码中,我们在编写一个测试用例的时候用到了 test.expect.toBe 三个方法,在之前我们也介绍了 Jest 的基础使用.Jest 的简单配置. Jest 中的匹配器(mat ...
- 7种前端自动化测试框架,到底谁是No.1
7种前端自动化测试框架,到底谁是No.1 互联网时代,我们对web前端进行测试,不应该只关注其功能是否实现,还有其它更多的测试内容,如样式是否符合预期.交互是否流畅.应用是否安全等各个方面. 前端自动 ...
- 前端测试框架Jest系列教程 -- Expect(验证)
写在前面 在编写测试时,我们通常需要检查值是否满足某些条件,Jest中提供的expect允许你访问很多"Matchers",这些"匹配器"允许您验证不同的东西. ...
- 前端测试框架—jest基本使用
前端测试框架-jest基本使用 前言 jest 常见匹配器 基本类型 boolean Number String Array,Set 异常 取反 命令行工具使用 异步代码测试方法 钩子函数 分组(钩子 ...
- 企业级前端项目组框架vue-fpg介绍
企业级前端项目组框架vue-fpg介绍 VUE-FPG是什么? VUE-FPG怎么用 常用框架命令: 常用框架指令 常用项目指令 VUE-FPG是什么? VUE-FPG是一套基于VUE框架和Webpa ...
- 前端自动化测试框架cypress(一)
前端自动化测试框架cypress 自动化测试 为了保障软件质量,并减少重复性的测试工作,自动化测试已经被广泛运用. 自动化测试是一种测试方法,是指使用特定的软件,去控制测试流程,并比较实际结果与预期结 ...
- 前端自动化测试框架cypress
前端自动化测试框架cypress 自动化测试 为了保障软件质量,并减少重复性的测试工作,自动化测试已经被广泛运用. 自动化测试是一种测试方法,是指使用特定的软件,去控制测试流程,并比较实际结果与预期结 ...
- webim 前端自动化测试框架
webim 前端自动化测试框架 文档 https://github.com/wytheme/wytheme.github.io/blob/master/raw/react-autotest.md 对应 ...
最新文章
- debian linux 硬盘,[Debian] 硬盘安装Debian,
- 精致3D图片切换效果,最适合企业产品展示
- Pytorch中矩阵用sum()函数求和降维是怎么回事
- linux常见故障处理,[转载]Linux常见操作和故障处理汇总
- 并发–执行程序和Spring集成
- 分享SharpZipLip使用代码
- poj 1836 Alignment
- Java 查找链表中的元素
- C语言-Ubuntu下GDB与GCC的安装与使用
- C++对象绑定到Lua
- HTML颜色表及html代码
- rxbus 源码_RxBus 这个 RxBus 稳如老狗 @codeKK Android开源站
- 服务器信号满格但网速很慢,信号满格网速太慢是什么原因,网速慢是什么原因-...
- Smartbi报表工具实现并查询(不去重)
- 遇到问题--mongodb--Prematurely reached end of stream
- 如何理解相关性系数(pearson、spearman、kendall)
- 纸质签名转变为电子签名
- Win8安装程序出现2502、2503错误解决方法
- Teradata关键字
- C/C++描述 LeetCode 周赛 5472. 重新排列字符串