ITADN · 发现全球开源项目

🃏 令人愉悦的 JavaScript 测试

👩🏻‍💻 开发者就绪: 一套全面的 JavaScript 测试解决方案。对于大多数 JavaScript 项目开箱即用。

🏃🏽 即时反馈: 快速、交互式监视模式仅运行与已更改文件相关的测试文件。

📸 快照测试: 捕获大型对象的快照，以简化测试并分析其随时间的变化。

上查看更多

快速入门

使用 yarn 安装 Jest：

yarn add --dev jest

或者 npm:

npm install --save-dev jest

注意：Jest 文档使用 yarn 命令，但 npm 也可以工作。你可以在 yarn 文档，此处比较 yarn 和 npm 命令。

让我们从一个为假设的添加两个数字的函数编写测试开始。首先，创建一个 sum.js 文件：

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

然后，创建一个名为 sum.test.js 的文件。这将包含我们的实际测试：

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

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

将以下部分添加到您的 package.json 中：

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

最后，运行 yarn test 或 npm test，Jest 将打印此消息：

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

你刚刚成功使用 Jest 编写了第一个测试！

此测试使用了 expect 和 toBe 来测试两个值是否完全相同。要了解 Jest 可以测试的其他内容，请参阅 Using Matchers。

从命令行运行

你可以直接从 CLI 运行 Jest（如果它在你的 PATH 中全局可用，例如通过 yarn global add jest 或 npm install jest --global），并提供多种有用的选项。

以下是如何在匹配 my-test 的文件上运行 Jest，使用 config.json 作为配置文件，并在运行后显示原生操作系统通知：

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

如果您想进一步了解如何通过命令行运行 jest，请查看 Jest CLI Options 页面。

额外配置

生成基本配置文件

根据您的项目，Jest 会询问您几个问题，并创建一个包含每个选项简短描述的基本配置文件：

yarn create jest

使用 Babel

要使用 Babel，请通过 yarn 安装所需的依赖项：

yarn add --dev babel-jest @babel/core @babel/preset-env

通过在项目根目录中创建一个 babel.config.js 文件，将 Babel 配置为针对当前版本的 Node：

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

Babel 的理想配置将取决于你的项目。请参阅 Babel 的文档以获取更多详细信息。

让你的 Babel 配置感知 Jest

如果未设置为其他值，Jest 会将 process.env.NODE_ENV 设置为 'test'。你可以在配置中使用它来有条件地设置仅为 Jest 所需的编译，例如

// babel.config.js
module.exports = api => {
  const isTest = api.env('test');
  // You can use isTest to determine what presets and plugins to use.

  return {
    // ...
  };
};

注意：安装 Jest 时会自动安装 babel-jest，如果项目中存在 babel 配置，它将自动转换文件。要避免此行为，可以显式重置 transform 配置选项：

// jest.config.js
module.exports = {
  transform: {},
};

使用 webpack

Jest 可用于使用 webpack 来管理资产、样式和编译的项目。与其他工具相比，webpack 确实带来了一些独特的挑战。请参阅 webpack 指南以开始使用。

使用 Vite

Jest 可用于使用 vite 通过原生 ESM 提供源代码以提供一些前端工具的项目，vite 是一个有主见的工具，并提供了一些开箱即用的工作流。由于 vite 的插件系统的工作方式，Jest 并未得到 vite 的完全支持，但使用 vite-jest 有一些用于一等 jest 集成的可用示例，由于这并未得到完全支持，您可能最好阅读 vite-jest 的限制。请参阅 vite 指南以开始使用。

使用 Parcel

Jest 可用于使用 parcel-bundler 来管理资产、样式和编译的项目，类似于 webpack。Parcel 需要零配置。请参阅官方文档以开始使用。

使用 TypeScript

Jest 通过 Babel 支持 TypeScript。首先，请确保您已遵循上文使用 Babel 的说明。接下来，通过 yarn 安装 @babel/preset-typescript：

yarn add --dev @babel/preset-typescript

然后将 @babel/preset-typescript 添加到您的 babel.config.js 中的预设列表中。

// babel.config.js
module.exports = {
  presets: [
    ['@babel/preset-env', {targets: {node: 'current'}}],
+    '@babel/preset-typescript',
  ],
};

然而，使用 TypeScript 配合 Babel 存在一些注意事项。由于 Babel 中的 TypeScript 支持纯粹是转译，Jest 在运行测试时不会进行类型检查。如果你需要该功能，可以使用 ts-jest 代替，或者单独运行 TypeScript 编译器 tsc（或将其作为构建流程的一部分）。

文档

在官方网站上了解更多关于使用 Jest 的信息！

徽章

向全世界展示你正在使用 Jest →

[![tested with jest](https://img.shields.io/badge/tested_with-jest-99424f.svg?logo=jest)](https://github.com/jestjs/jest)
[![jest tested](https://img.shields.io/badge/Jest-tested-eee.svg?logo=jest&labelColor=99424f)](https://github.com/jestjs/jest)
[![jest](https://jestjs.io/img/jest-badge.svg)](https://github.com/jestjs/jest)