react-jest

目录

简介

Jest 是一个令人愉快的 JavaScript 测试框架,专注于 简洁明快。这些项目都在使用 Jest:BabelTypeScriptNodeReactAngularVue 等等.

安装及配置

安装

npm install --save-dev jest

初始化配置jest

npx jest --init  //会生成一个jest.config.js

使用

在package.json文件中配置命令:

"script":{
    "test":"jest",
    "test:coverage":"jest --coverage",
    "test:watch":"jest --watchAll",
}

注意:但是在jest中默认是不支持es6语法的,默认使用的commonJS的语法规格,因此引入模块使用的是require()语句,而不是import语句,为了使得jest兼容es6语法,我们就需要安装babel转换器,这里默认需要两个babel的依赖包:

@babel/core
@babel/preset-env

配置了babel之后,babel又是怎么知道如何转换的呢?

这就需要添加babel的配置文件 .babelrc 文件。

babel的具体使用规则,详细看babel的章节。

运行原理:

在执行npm run jest命令时,先看有没有安装babel,安装了之后,再查找.babelrc配置文件,然后先转译,再跑测试代码。

查看测试覆盖率

npx jest --coverage //会生成一个测试覆盖率的报告文件

异步测试

异步测试中需要用到axios组件

  • done 代表异步方法调用结束后才开始测试异步代码块。
  • 使用 return
  • 使用 async 和 await

jest钩子函数

  • beforeAll(() => {})
  • afterAll(() => {})
  • beforeEach(() => {})
  • afterEach(() => {})

钩子函数的作用域:

  • 钩子函数在父级分组可以作用子集,类似与继承。
  • 钩子函数同级分组作用域互不干扰,各起作用。
  • 先执行外部的钩子函数,再执行内部的钩子函数。

jest分组测试

有可能一个测试文件中会出现很多测试方法,那么有些是为了测试同一个功能和组件的方法可以分到同一个组中。

那么jest如何分组呢?

descripe('description for current group', () => {
    testMethod1();
    testMethod2();
    ....
})

匹配验证

expect().toBe();
toBeNull();
toBeUndefiend();
toBeDefiend();
toBeTruthy();
toBeFalsy();
toBeGreaterThan();//大于
toBeLessThan();//小于
toBeGreaterThanOrEqual();//大于等于
toBeLessThanOrEqual();
toBeCloseTo();//用于浮点数据的计算,接近于某个值
toMatch();//匹配正则表达式
toContain();//用于校验字符串或者数组,包含
toThrow();//用于校验抛出异常的情况

//如果想要验证上述情况的反面信息可以使用not
expect().not.toBe();
上一篇:OpenFaaS部署前端


下一篇:应用函数修饰符@来改变AI Studio的输出信息