使用Jest测试JavaScript

最新推荐文章于 2024-01-30 16:21:33 发布

清风_1998

最新推荐文章于 2024-01-30 16:21:33 发布

阅读量956

点赞数

文章标签： jest 前端测试工具

本文链接：https://blog.csdn.net/qq_40511157/article/details/102616861

版权

1 什么是 Jest?

Jest是 Facebook 的一套开源的 JavaScript 测试框架，它自动集成了断言、JSDom、覆盖率报告等开发者所需要的所有测试工具，是一款几乎零配置的测试框架。并且它对同样是 Facebook 的开源前端框架 React 的测试十分友好。

在命令行中输入以下命令，初始化前端项目并生成package.json：

npm init -y

在命令行中输入以下命令，安装测试所需要的依赖：

npm install -D jest babel-jest babel-core babel-preset-env regenerator-runtime

babel-jest、 babel-core、 regenerator-runtime、babel-preset-env这几个依赖是为了让我们可以使用ES6的语法特性进行单元测试，ES6提供的 import 来导入模块的方式，Jest本身是不支持的。

在项目的根目录下添加.babelrc文件，并在文件复制如下内容:

{
  "presets": ["env"]
}

打开package.json文件，将script下的test的值修改为jest：

"scripts": {
  "test": "jest"
}

创建src和test目录及相关文件
在项目根目录下创建src目录，并在src目录下添加functions.js文件在项目根目录下创建test目录，并在test目录下创建functions.test.js 文件

Jest会自动找到项目中所有使用.spec.js或.test.js文件命名的测试文件并执行，通常我们在编写测试文件时遵循的命名规范：测试文件的文件名 = 被测试模块名 + .test.js，例如被测试模块为functions.js，那么对应的测试文件命名为functions.test.js。

在src/functions.js中创建被测试的模块

export default {
  sum(a, b) {
    return a + b;
  }
}

在test/functions.test.js文件中创建测试用例

import functions  from '../src/functions';

test('sum(2 + 2) 等于 4', () => {
  expect(functions.sum(2, 2)).toBe(4);
})

运行npm run test, Jest会在shell中打印出以下消息：

关注