jest 快速入门

141 阅读1分钟

最近寻思写个前端常用的函数工具库,以避免日常多个项目使用时粘贴复制,以提升效率。作为公共函数工具,当然要有单元测试。充分的单元测试能够降低后续使用中出现bug的几率。

所以来简单记录下使用jest的过程,文本主要讲大致用法,具体细节还是看文档

Jest简介

Jest 是 Facebook 开源的一套 JavaScript 测试框架, 它集成了断言、JSDom、覆盖率报告等开发者所需要的所有测试工具。 Jest 自身包含了 驱动、断言库、mock 、代码覆盖率等多种功能,配置使用相当简单,并能 根据项目需求进行扩展。

Jest起步

1. 安装

npm install typescript jest ts-jest @types/jest -D

2. 生成配置

npm ts-jest config:init

生成的代码如下所示,就三行

// jest.config.js
module.exports = {
  preset: "ts-jest",
  testEnvironment: "node",
};

3. 项目结构

1665716517902.jpg

jest.config.js是生成的配置文件。src中是需要测试的 ts 函数。test中存放我们的测试文件。项目根目录的coverage文件夹是测试覆盖率自动生成的文件后续会说到。

4. 开始

首先在src文件夹中创建sum.ts文件

function sum(a: number, b:number) {  
return a + b;  
}  
module.exports = sum;

接下来在test文件夹下创建名为 sum.test.ts 的文件。这个文件包含了实际测试内容:

const sum = require('./sum');

test('adds 1 + 2 to equal 3', () => {
  expect(sum(1, 2)).toBe(3);
});

将如下代码添加到 package.json 中:

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

最后,运行 npm test ,Jest 将输出如下信息:

PASS  ./sum.test.ts
✓ adds 1 + 2 to equal 3 (5ms)

刚才使用 Jest 成功地写出了第一个测试!

在此测试中,使用了 expect 和 toBe 来检测两个值是否完全相同。