A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

1 简介

1.1 Jest 是什么?
Jest 是 Facebook 发布的一个开源的、基于 Jasmine 框架的 JavaScript 单元测试工具。提供了包括内置的测试环境 DOM API 支持、断言库、Mock 库等,还包含了 Snapshot Testing、 Instant Feedback 等特性。它自动集成了断言、JSDom、覆盖率报告等开发者所需要的所有测试工具,是一款几乎零配置的测试框架。并且它对同样是 Facebook 的开源前端框架 React 的测试十分友好。
1.2 谁在用?

1.3 卖点
  • Jest 是 Facebook 出品的一个测试框架,相对其他测试框架,其一大特点就是就是内置了常用的测试工具,比如自带断言、测试覆盖率工具,实现了开箱即用。
  • 而作为一个面向前端的测试框架, Jest 可以利用其特有的快照测试功能,通过比对 UI 代码生成的快照文件,实现对 React 等常见框架的自动测试。
  • 此外, Jest 的测试用例是并行执行的,而且只执行发生改变的文件所对应的测试,提升了测试速度。目前在 Github 上其 star 数已经破万;而除了 Facebook 外,业内其他公司也开始从其它测试框架转向 Jest ,比如 Airbnb 的尝试 ,相信未来 Jest 的发展趋势仍会比较迅猛。

2 课前准备2.1 测试框架测试框架的作用是提供一些方便的语法来描述测试用例,以及对用例进行分组。测试框架可分为两种: TDD (测试驱动开发)和 BDD (行为驱动开发),我理解两者间的区别主要是一些语法上的不同,其中 BDD 提供了提供了可读性更好的用例语法,至于详细的区别可参见The Difference Between TDD and BDD - Josh Davis 一文。常见的测试框架有 Jasmine, Mocha 以及本文要介绍的 Jest 。
2.2 断言库断言库主要提供语义化方法,用于对参与测试的值做各种各样的判断。这些语义化方法会返回测试的结果,要么成功、要么失败。常见的断言库有 Should.js, Chai.js 等。
测试覆盖率工具用于统计测试用例对代码的测试情况,生成相应的报表,比如 istanbul

3 上手初始化一个项目
mkidr $CODE_PATH && cd $CODE_PATHnpm init -ynpm i -D jest复制代码
⚠️ jest 默认不支持es6 如果需要测试es6 需要额外安装
npm i -D babel-jest babel-core babel-preset-env
并且增加.babelrc 配置如下:
{  "presets": ["env"]}复制代码在package.json添加测试脚本
{  "scripts": {    "test": "jest",    "test:watch": "jest --watchAll"  }}复制代码这样我们的食材就准备好了✌️
3.1 第一个例子

2 个回复

倒序浏览
奈斯
回复 使用道具 举报
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 加入黑马