IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> 系统运维 -> 前端Jest自动化测试 -> 正文阅读

[系统运维]前端Jest自动化测试

作为一个优秀的攻城狮必备的条件

随着前端的发展,前端设计的领域已经越来越多,也越来越复杂。这就对我们前端工程化能力,提出了更高的要求。 好的前端工程化一般包括三个大的方面:
  • 前端自动化测试(前提条件)
  • 高质量的代码设计
  • 高质量的代码实现

Jest的优点

  1. 比较新:喜新厌旧是人的天性,新技术出来后你总想动手尝试一下,这个就和家花没有野花香是一个道理。作为一个程序员,你更要有拥抱全新知识的态度。绝不能固步自封,顽固不化。(你们这些小年青永远体会不了老男人去洗浴中心的喜悦和急切心情的)

  2. 基础很好:框架基础好就是性能好、功能多、简单易用,Jest在这三个方面你可以完全放心。绝对是一把好手,干就完事了。

  3. 速度快: 单独模块测试功能,比如说有两个模块A和B,以前都测试过了,这时候你只改动A模块,才次测试,模块B不会再跑一次,而是直接测试A模块。这就好比你去‘大宝剑’,你所有技师都试过了一次,下次你再来,直接就找最好的就行了。不用再测试一遍。(安心、放心)

  4. API简单 :等你基础知识学完后,你就会发现API非常简单,数量也少。

  5. 隔离性好:Jest里会有很多的测试文件等待我们使用,Jest的执行环境都是隔离,这样就避免不同的测试文件执行的时候互相影响而造成出错。

  6. IDE整合:Jest直接可以和很多编辑器(VSCode)进行融合,让测试变的更加简单。

  7. 多项目并行:比如我们写了Node.js的后台项目,用React写了一个前台项目,Jest是支持他们并行运行,让我们的效率更加提高了。

  8. 快出覆盖率:(测试代码覆盖率) 对于一个项目的测试都要出覆盖率的,Jest就可以快速出这样的覆盖率统计结果,非常好用

废话那么多,现在开始搞重点

准备工作

  1. npm init  初始化一个package.json, 一直回车即可
  2. npm install jest@24.8.0 -D  安装jest框架
  3. 现在我们就可以开始一个jest的测试用例了。

开启你的第一个测试用例

hello.js

	function add (name) {
		return `hello ${name}`
	}
	// 这里需要使用 commonjs 的语法导出,和导入。jest 默认只支持这种语法, 需要es6语法的话,需要安装babel
	module.exports = { add }

hello.test.js

	// 这里把刚刚封装的方法导入进来 进行测试
	const { add } = require('./hello.js')  
	
	// test() 第一个参数: 测试用例名称, 第二个参数回调函数,用于执行测试用例
	// expect要执行的方法, toBe 类似 全等 ===  
	test('测试用例1',() => {
		expect(add('树哥')).toBe('hello 树哥')
	})
注解
  1. test方法:Jest封装的测试方法,一般填写两个参数,描述和测试方法
  2. expect方法 :预期方法,就是你调用了什么方法,传递了什么参数,得到的预期是什么(代码中详细讲解)。
这个时候如果要执行测试用例的话,要把package.json中的 scripts 中的 test 属性的值 修改为 jest

修改test:jest
npm test 执行测试用例

测试通过

下面讲一下,jest的命令

  1. jest --watchAll  执行当前目录下所有的测试文件中的测试用例
  2. jest --coverage  把执行过的测试用例绘制成图表

今天到此为止,明天讲一下匹配器的用法还有生成测试用例的图标

  系统运维 最新文章
配置小型公司网络WLAN基本业务(AC通过三层
如何在交付运维过程中建立风险底线意识,提
快速传输大文件,怎么通过网络传大文件给对
从游戏服务端角度分析移动同步(状态同步)
MySQL使用MyCat实现分库分表
如何用DWDM射频光纤技术实现200公里外的站点
国内顺畅下载k8s.gcr.io的镜像
自动化测试appium
ctfshow ssrf
Linux操作系统学习之实用指令(Centos7/8均
上一篇文章      下一篇文章      查看所有文章
加:2021-12-23 16:04:59  更:2021-12-23 16:06:39 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/16 5:32:13-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码