快速开始

使用你最喜欢的包管理器安装Jest:

  • npm
  • Yarn
  1. npm install --save-dev jest
  1. yarn add --dev jest

举个例子,我们先写一个两数相加的函数。 首先,创建 sum.js 文件︰

  1. function sum(a, b) {
  2. return a + b;
  3. }
  4. module.exports = sum;

然后,创建名为 sum.test.js 的文件。 此文件中将包含我们的实际测试︰

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

随后,将下列配置内容添加到您的 package.json

  1. {
  2. "scripts": {
  3. "test": "jest"
  4. }
  5. }

最后,运行 yarn testnpm run test ,Jest将打印下面这个消息:

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

您刚刚完成了您的首个 Jest 测试!

此测试使用 expecttoBe 来测试两值是否一致。 要了解 Jest 能进行的更多测试,请参阅使用匹配器章节。

在命令行中运行

你可以通过命令行直接运行Jest(前提是jest已经处于你的环境变量 PATH中,例如通过 yarn global add jestnpm install jest --global安装的Jest) ,并为其指定各种有用的配置项。

这里演示了如何对能匹配到 my-test 的文件运行 Jest、使用config.json 作为一个配置文件、并在运行完成后显示一个原生的操作系统通知。

  1. jest my-test --notify --config=config.json

如果你愿意了解更多关于通过命令行运行 jest 的内容,请继续阅读 Jest CLI 选项 页面。

更多配置

生成基础配置文件

基于您的项目,Jest将向您提出几个问题,并将创建一个基本的配置文件,每个选项都有一个简短的说明:

  1. jest --init

使用 Babel

如果需要使用 Babel,安装所需的依赖。

  • npm
  • Yarn
  1. npm install --save-dev babel-jest @babel/core @babel/preset-env
  1. yarn add --dev babel-jest @babel/core @babel/preset-env

可以在工程的根目录下创建一个babel.config.js文件用于配置与你当前Node版本兼容的Babel:

babel.config.js

  1. module.exports = {
  2. presets: [['@babel/preset-env', {targets: {node: 'current'}}]],
  3. };

Babel的配置取决于具体的项目使用场景 ,可以查阅 Babel官方文档来获取更多详细的信息。

**Jest与Babel的协同**

process.env.NODE_ENV 未设置,Jest将把它设置为 'test' 。你可以用 if语句设置Jest执行的编译配置。例如:

babel.config.js

  1. module.exports = api => {
  2. const isTest = api.env('test');
  3. // You can use isTest to determine what presets and plugins to use.
  4. return {
  5. // ...
  6. };
  7. };

注意:当你安装 Jest 时,babel-jest 是会被自动安装的,并且如果你的项目下存在一个 Babel 配置文件时,它将会自动对相关文件进行转义。 如果要避免这个行为,你可以显式的重置 transform 配置项:

jest.config.js

  1. module.exports = {
  2. transform: {},
  3. };

使用 webpack

Jest 可以用于使用 webpack 来管理资源、 样式和编译的项目中。 webpack 与其他工具相比多了一些独特的挑战。 参考 webpack 指南 来开始起步。

使用 Parcel

Parcel是一个类似于Webpack的零配置管理资源及样式的构建工具。Jest可以在Parcel构建的项目中使用。可以去Parcel官网 尝试一下。 请查看Parcel的 官方文档 进行操作。

使用 TypeScript

配置 babel

Jest可以通过Babel支持TypeScript。 首先,在项目中正确的使用Babel。 接着,安装 @babel/preset-typescript

  • npm
  • Yarn
  1. npm install --save-dev @babel/preset-typescript
  1. yarn add --dev @babel/preset-typescript

你需要添加@babel/preset-typescript的预设到babel.config.js.

babel.config.js

  1. module.exports = {
  2. presets: [
  3. ['@babel/preset-env', {targets: {node: 'current'}}],
  4. '@babel/preset-typescript',
  5. ],
  6. };

不过,在配合使用TypeScript与Babel时,仍然有一些 注意事项 。 因为Babel对Typescrip的支持是纯编译形式(无类型校验),因此Jest在运行测试时不会对它们进行类型检查。 如果需要类型校验,可以改用ts-jest,也可以单独运行TypeScript编译器 tsc (或作为构建过程的一部分)。

配置 ts-jest

ts-jest 是一个支持 sourcemap 的 TypeScript 预处理器,让你使用 TypeScript 编写 Jest 测试项目

  • npm
  • Yarn
  1. npm install --save-dev ts-jest
  1. yarn add --dev ts-jest

类型定义

There are two ways to have Jest global APIs typed for test files written in TypeScript.

You can use type definitions which ships with Jest and will update each time you update Jest. Simply import the APIs from @jest/globals package:

sum.test.ts

  1. import {describe, expect, test} from '@jest/globals';
  2. import {sum} from './sum';
  3. describe('sum module', () => {
  4. test('adds 1 + 2 to equal 3', () => {
  5. expect(sum(1, 2)).toBe(3);
  6. });
  7. });

快速开始 - 图1tip

See the additional usage documentation of describe.each/test.each and mock functions.

Or you may choose to install the @types/jest package. It provides types for Jest globals without a need to import them.

  • npm
  • Yarn
  1. npm install --save-dev @types/jest
  1. yarn add --dev @types/jest

Note that @types/jest is a third party library maintained at DefinitelyTyped, hence the latest Jest features or versions may not be covered yet. Try to match versions of Jest and @types/jest as closely as possible. For example, if you are using Jest 27.4.0 then installing 27.4.x of @types/jest is ideal.