Початок роботи
Встановіть Jest за допомогою вашого улюбленого менеджера пакетів:
- npm
- Yarn
- pnpm
npm install --save-dev jest
yarn add --dev jest
pnpm add --save-dev jest
Давайте почнемо з написання тесту для гіпотетичної функції, яка додає два числа. Спочатку створіть файл 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
and toBe
для перевірки, що два значення абсолютно ідентичні. Щоб дізнатися про інші речі, які Jest може тестувати, перегляньте Використання Matchers.
Запуск з командного рядка
Ви можете запустити Jest безпосередньо з командного рядка (якщо він доступний глобально у вашому PATH
, наприклад yarn global add jest
або npm install jest --global
) з широким набором корисних параметрів.
Ось як можна запустити Jest для файлів, назва яких відповідає шаблону my-test
, використовуючи config.json
як файл конфігурації та з відображенням нативних сповіщень ОС після запуску:
jest my-test --notify --config=config.json
Щоб дізнатися більше про запуск jest
з командного рядка, відвідайте сторінку параметри командного рядка Jest.
Додаткові налаштування
Згенеруйте основний файл конфігурації
В залежності від вашого проекту, Jest поставить вам кілька питань і створить початковий файл конфігурації з коротким описом кожного налаштування:
- npm
- Yarn
- pnpm
npm init jest@latest
yarn create jest@latest
pnpm create jest@latest
Використання Babel
Щоб використовувати Babel, встановіть необхідні залежності:
- npm
- Yarn
- pnpm
npm install --save-dev babel-jest @babel/core @babel/preset-env
yarn add --dev babel-jest @babel/core @babel/preset-env
pnpm add --save-dev babel-jest @babel/core @babel/preset-env
Налаштуйте Babel відповідно до вашої версії Node, створивши файл babel.config.js
в кореневому каталозі проекту:
module.exports = {
presets: [['@babel/preset-env', {targets: {node: 'current'}}]],
};
Ідеальна конфігурація для Babel буде залежати від вашого проекту. Перегляньте документацію Babel для отримання додаткової інформації.
Налаштування вашої конфігурації Babel для роботи з Jest
Jest встановлює значення 'test'
в process.env.NODE_ENV
, якщо не вказано інше. Ви можете використовувати це у вашій конфігурації для налаштування тільки тих параметрів компіляції, які потрібні для Jest, наприклад:
module.exports = api => {
const isTest = api.env('test');
// You can use isTest to determine what presets and plugins to use.
return {
// ...
};
};
babel-jest
автоматично встановлюється під час встановлення Jest і буде автоматично транслювати файли, якщо конфігурація Babel існує у вашому проєкті. Щоб відключити цю поведінку, ви можете явно очистити конфігураційни параметр transform
:
module.exports = {
transform: {},
};
Використання webpack
Jest може застосовуватися в проектах, які використовують webpack для керування ресурсами, стилями та компіляції коду. webpack кидає певні унікальні виклики для використання інших інструментів. Перегляньте посібник по роботі з webpack щоб почати його використовувати.
Використання Vite
Jest може використовуватись в проєктах, які використовують vite для обслуговування вихідного коду через вбудовані ESM, щоб надати деякі інструменти фронтенду, vite є чудовим інструментом і пропонує деякі вбудовані робочі процеси. Vite не підтримує Jest повністю через особливості роботи своєї системи плагінів, але існують робочі приклади інтеграції jest за допомогою vite-jest
. За відсутності повноцінної підтримки, також варто ознайомитись з обмеженнями vite-jest
. Для початку роботи, зверніться до посібнику vite.
Використання Parcel
Jest може використовуватись в проектах, що використовують parсel-bundler для керування ресурсами, стилями та компіляції, подібної до webpack. Parcel вимагає нульову конфігурацію. Зверніться до офіційної документації, щоб розпочати роботу.
Використання TypeScript
За допомогою Babel
Jest підтримує TypeScript, за допомогою Babel. По-перше, переконайтеся, що ви дотримувались інструкцій використовуючи Babel вище. Після цього встановіть @babel/preset-typescript
:
- npm
- Yarn
- pnpm
npm install --save-dev @babel/preset-typescript
yarn add --dev @babel/preset-typescript
pnpm add --save-dev @babel/preset-typescript
Тоді додайте @babel/preset-typescript
до списку пресетів у вашому babel.config.js
.
module.exports = {
presets: [
['@babel/preset-env', {targets: {node: 'current'}}],
'@babel/preset-typescript',
],
};
Проте, є деякі застереження щодо використання TypeScript з Babel. Оскільки TypeScript в Babel є суто транспіляцією, Jest не буде перевіряти ваші тести, коли вони будуть запущені. Якщо вам це потрібно, ви можете використовувати ts-jest , або просто запустіть компілятор TypeScript tsc окремо (або до вашої частини процесу збі рки).
За допомогою ts-jest
ts-jest це препроцесор TypeScript з пітримкою source map для Jest, який дозволяє використовувати Jest для тестування проектів, написаних на TypeScript.
- npm
- Yarn
- pnpm
npm install --save-dev ts-jest
yarn add --dev ts-jest
pnpm add --save-dev ts-jest
Для того, щоб Jest переклав TypeScript за допомогою 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. Встановіть @jest/globals
:
- npm
- Yarn
- pnpm
npm install --save-dev @jest/globals
yarn add --dev @jest/globals
pnpm add --save-dev @jest/globals
Та імпортуйте з нього API:
import {describe, expect, test} from '@jest/globals';
import {sum} from './sum';
describe('sum module', () => {
test('adds 1 + 2 to equal 3', () => {
expect(sum(1, 2)).toBe(3);
});
});
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
- pnpm
npm install --save-dev @types/jest
yarn add --dev @types/jest
pnpm add --save-dev @types/jest
@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.
Using ESLint
Jest can be used with ESLint without any further configuration as long as you import the Jest global helpers (describe
, it
, etc.) from @jest/globals
before using them in your test file. This is necessary to avoid no-undef
errors from ESLint, which doesn't know about the Jest globals.
If you'd like to avoid these imports, you can configure your ESLint environment to support these globals by adding the jest
environment:
{
"overrides": [
{
"files": ["tests/**/*"],
"env": {
"jest": true
}
}
]
}
Or use eslint-plugin-jest
, which has a similar effect:
{
"overrides": [
{
"files": ["tests/**/*"],
"plugins": ["jest"],
"env": {
"jest/globals": true
}
}
]
}