Jest
Last updated
Last updated
Жодне тестове рішення не є ідеальним. Тим не менш, jеst є чудовим варіантом модульного тестування, який забезпечує чудову підтримку TypeScript.
Примітка: ми припускаємо, що ви починаєте з простого налаштування вузла package.json. Також усі файли TypeScript мають бути в папці
src
, що завжди рекомендується (навіть без Jest) для чистого налаштування проекту.
Встановіть наступне за допомогою npm:
Пояснення:
Встановити фреймворк jest
(jest
)
Встановіть типи для jest
(@types/jest
)
Встановіть препроцесор TypeScript для jest (ts-jest
), який дозволяє jest транспілювати TypeScript на льоту та має вбудовану підтримку source-map.
Встановіть компілятор TypeScript ('typescript'), який є передумовою для 'ts-jest'.
Збережіть усе це у своїх залежностях розробника (тестування майже завжди в dev-dependency npm)
Додайте наступний файл jest.config.js
до кореня вашого проекту:
(Якщо ваш файл package.json
містить "type": "module"
, через що Node припускає, що модулі мають формат es6, ви можете конвертувати наведене вище у формат es6, замінивши верхній рядок на export default {
.)
Пояснення:
Ми завжди рекомендуємо зберігати всі файли TypeScript у папці src
вашого проекту. Ми вказуємо це за допомогою параметра roots
.
Конфігурація testMatch
— це глобальний відповідник шаблонів для виявлення файлів .test / .spec у форматі ts / tsx / js.
Конфігурація transform
просто повідомляє jest
використовувати ts-jest
для файлів ts / tsx.
Запустіть npx jest
з кореня вашого проекту, і jest виконає будь-які ваші тести.
додайте package.json
:
Це дозволяє запускати тести за допомогою простого npm t
.
І навіть у режимі перегляду з npm t -- --watch
.
npx jest --watch
для foo.ts
:
простий foo.test.ts
:
Примітки:
Jest надає функцію глобального тестування.
Jest поставляється попередньо зібраним із твердженнями у формі глобального expect
.
Jest має вбудовану підтримку async/await.
Enzyme дозволяє тестувати реагують компоненти з підтримкою dom. Існує три етапи налаштування:
Встановіть enzyme, типи для enzyme, a better snapshot serializer for enzyme, enzyme-adapter-react для вашої версії react npm i enzyme @types/enzyme enzyme-to-json enzyme-adapter-react-16 -D
Додайте "snapshotSerializers"
і "setupTestFrameworkScriptFile"
до вашого jest.config.js
:
створіть src/setupEnzyme.ts
файл.
Ось приклад компонента react і тесту:
checkboxWithLabel.tsx
:
checkboxWithLabel.test.tsx
:
Вбудована бібліотека тверджень.
Чудова підтримка TypeScript.
Дуже надійний спостерігач за тестами.
Тестування Snapshot.
Вбудовані звіти про покриття.
Вбудована підтримка async/await.