Jest 是一个简单易用的 JavaScript 测试框架。最初由 Meta 公司团队维护。2022 年 5 月，Meta 公司正式将自己的开源项目Jest 移交给 OpenJS Foundation[1]，这表示 Jest 由公司驱动变为社区驱动，有 OpenJS Foundation 保底，Jest 将不会因公司发展需要而停止维护。
下面我们就来学习吧。
首先创建项目目录：
mkdir jest-demos && cd jest-demosnpm init -y然后，安装 Jest 依赖：
npm install --save-dev jest创建待测试文件 src/sum.js：
function sum(a, b) { return a + b;}module.exports = sum;创建测试文件 __tests__/sum.test.js：
const sum = require('../src/sum');test('adds 1 + 2 to equal 3', () => { expect(sum(1, 2)).toBe(3);});注：按照约定，测试文件以 .test.js 或 .spec.js 结尾，并且放在 __tests__ 目录中。
package.json 文件中增加脚本：
{ "scripts": { "test": "jest" }}终端上执行命令 npm test，查看结果。
图片
这样我们就完成了第一个测试文件的编写和集成。
不过目前存在 2 个问题：
如何解决呢？有 2 个方案：
不过为了得到完整的类型检查支持，我们选择 ts-jest。下面就来学习。
ts-jest 本质上就是 Jest transformer，支持你在 TypeScript 项目里使用 Jest。
这部分配置我们参照官方教程[2]。
首先安装必要依赖：
npm install --save-dev ts-jest jest typescript @types/jest然后，生成 Jest 配置文件——这里借助 ts-jest 指令来生成：
npx ts-jest config:init这一步会在项目根目录下创建 jest.config.js 文件：
/** @type {import('ts-jest').JestConfigWithTsJest} */module.exports = { preset: 'ts-jest', testEnvironment: 'node',};将 src/sum.js 和 __tests__/sum.test.js 的文件后缀改成 .ts，并将代码改成 ES Module 方式组织。
// src/sum.tsfunction sum(a, b) { return a + b;}export default sum;// __tests__/sum.test.tsimport sum from "../src/sum";test("adds 1 + 2 to equal 3", () => { expect(sum(1, 2)).toBe(3);});终端上执行命令 npm test，查看结果。
图片
也成功了。不过有一条告警，建议我们将 tsconfig.json 中的 esModuleinterop 字段设置成 true。
为了设置 esModuleinterop 字段，我们将 tsconfig.json 文件释放出来。
$ npx tsx --initCreated a new tsconfig.json with: TS target: es2016 module: commonjs strict: true esModuleInterop: true skipLibCheck: true forceConsistentCasingInFileNames: true释出的配置中包含 esModuleInterop: true 选择，因此我们也无需修改。不过因为开启了严格模式（strict： true），因此还要对源代码做类型注解。
// src/sum.tsfunction sum(a: number, b: number) { return a + b;}export default sum;再次运行测试——成功！
图片
以上，我们就学完了 Jest 基础使用和配置的部分的内容。下一步大家可以在 Jest 官网上按照下面的顺序自行学习。
[1]OpenJS Foundation:https://jestjs.io/blog
[2]官方教程:https://kulshekhar.github.io/ts-jest/docs/getting-started/installation
[3]匹配器（Matcher）的使用:https://jestjs.io/docs/using-matchers
[4]https://jestjs.io/docs/expect:https://jestjs.io/docs/expect
[5]测试异步代码:https://jestjs.io/docs/asynchronous
[6]使用跟启动、清理相关的一些调用周期函数:https://jestjs.io/docs/setup-teardown
[7]学习 Mock 函数的使用:https://jestjs.io/docs/mock-functions
[8]如何配置浏览器环境的测试:https://jestjs.io/docs/tutorial-jquery
本文链接：http://www.28at.com/showinfo-26-17784-0.htmlJest：目前最广泛使用的前端 JavaScript 测试框架
声明：本网页内容旨在传播知识，若有侵权等问题请及时与本网联系，我们将在第一时间删除处理。邮件：2376512515@qq.com
Copyright © 2016-2023 天津谷骐科技有限公司 版权所有 sitemap.xml
违法及侵权请联系：2376512515@qq.com 津ICP备18001702号
津公网安备 12010102000574号