jest configuration debugging jest based tests
Дізнайтеся про Jest Config, налагодження та порівняння Jest з іншими структурами тестування JavaScript, зокрема Jest vs Mocha & Jest vs Jasmine:
У цьому Інформативна серія Jest , ми дослідили все про Тестування програм React, знущань та шпигунів за допомогою Jest у нашому останньому уроці.
У цьому підручнику ми дізнаємося більше про файли Jest Config та побачимо, як ви можете насправді налагоджувати тести Jest для усунення неполадок одного чи декількох тестів.
Ми також вивчимо деякі загальновживані параметри у файлі Jest Config, які можна встановити самостійно в проекті, або ті, які можна додати як частину самої конфігурації package.json.
Ми будемо використовувати Visual Studio Code для написання наших тестів Jest і будемо використовувати розширення або плагін у VS Code, щоб увімкнути підтримку налагодження для тестів Jest.
Крім того, ми порівняємо різні основи тестування Javascript, такі як Mocha та Jasmine, та Jest та зрозуміємо плюси та мінуси один одного.
Що ви дізнаєтесь:
Є Config
Конфігурацію Jest можна вказати 3 способами
- Через ключ у файлі package.json.
- Через файл jest.config.js - файл конфігурації, написаний як модуль.
- Через JSON, який можна використовувати з опцією як –config flag.
За допомогою всіх вищезазначених підходів ви можете досягти того самого результату. Давайте подивимось перший крок - тобто додавання конфігурації Jest через ключ у файлі package.json.
У існуючий файл package.json додайте новий ключ із назвою „jest”. Це не що інше, як набір пар ключ-значення у форматі JSON. Усі параметри конфігурації, пов’язані з Jest, можна додатково додати до цього розділу у файлі package.json.
Найчастіше використовувані параметри конфігурації перелічені нижче.
# 1) Пов’язане з покриттям
колекціонер, покриття, поріг, покриття, репортери, покриття, каталог - Це найбільш широко використовувані варіанти. Покриття є важливою метрикою, і воно гарантує тестування коду на заданий поріг.
Детальне пояснення кожного з них таке:
# 1) collectCoverage: Цей параметр використовується, щоб вказати, чи хочемо ми, щоб тест-драйвер Jest збирав інформацію про покриття чи ні. Якщо встановлено значення true, бігун Jest збирає інформацію про покриття. За допомогою цієї опції покриття буде зібрано та відображено на консолі в кінці виконання тесту, як показано нижче.
# 2) Поріг покриття: Цей параметр дозволяє нам вказати порогові значення охоплення у відсотках. Це дуже корисно, коли організація або команда хоче дотримуватися певного мінімального значення охоплення, без якого жоден код не може бути переданий або об'єднаний до основної гілки.
Подивимось, як це можна використовувати.
Покриття можна вказати на глобальному рівні, на рівні файлу або будь-якому іншому регулярному виразі. Якщо вказано на глобальному рівні, усі вказані порогові значення повинні збігатися для об’єднаних усіх файлів у проекті.
'coverageThreshold': { 'global': { 'branches':95, 'functions':100, 'lines':70, 'statements':-2 } }
Також можна вказати охоплення на рівні файлу, змінивши “глобальний” на ім’я файлу або регулярний вираз. Порогові конфігурації можуть змінюватися залежно від вимог.
'coverageThreshold': { './src/calculator.js': { 'branches':100, 'functions':100, 'lines':100, 'statements':-10 } }
# 3) висвітлення Репортери: Ця конфігурація використовується, щоб вказати, якого репортера ви хотіли б використовувати для створення звіту про покриття. Існує багато існуючих репортерів у вигляді пакетів NPM, які можна використовувати для створення звіту про покриття в кінці виконання тесту.
# 4) Покриття Цей параметр дозволяє користувачеві вказати каталог, куди слід створювати або зберігати звіти про покриття після створення.
Нижче наведено комбінований приклад використання всіх налаштувань конфігурації, пов’язаних із покриттям.
'jest':{ 'collectCoverage':true, 'coverageThreshold': { 'global': { 'branches':95, 'functions':100, 'lines':70, 'statements':-2 }, './src/calculator.js': { 'branches':100, 'functions':100, 'lines':100, 'statements':-10 } }, 'coverageReporters': [ 'lcov','text' ], 'coverageDirectory': './output/code-coverage/' }
Тут ми використали 2 репортери покриття, тобто lcov та text. Lcov - це лінійне покриття Linux, яке за замовчуванням присутнє, а репортер 'text' означає, що вихід покриття також буде відображатися на консолі. Звіт про покриття буде сформовано за шляхом, зазначеним у параметрі “покриттяДіректорія”.
# 2) Імітація пов'язана
Під час тестування з Jest широко використовуються знущання. Обидва наведені нижче варіанти конфігурації дозволяють легко налаштовувати та очищати макети.
- autoMocks: Якщо встановлено значення true, це буде знущатися над усіма модулями, які імпортуються в тесті за замовчуванням.
- clearMocks: Якщо встановлено значення true, це очистить всі знущані установки / модулі після кожного тесту, так що кожен тест починається зі свіжого стану. Цього також можна досягти за допомогою testCleanup або методу “after”, але наявність його в конфігурації робить це ще простішим.
# 3) Пов’язані тести
# 1) testTimeout: Ця конфігурація використовується для встановлення жорсткого часу очікування для тестів у мілісекундах. Будь-який тест, що приймає більше цього налаштованого порогу, буде позначений як невдалий через виняток часу очікування.
'jest' { 'testTimeout': 100 }
# 2) Глобальний: Ця конфігурація використовується для встановлення глобальних змінних, які повинні бути доступні в кожному тесті.
'jest' { 'globals': { 'globalVar': 'test global variable!' } }
Давайте спробуємо використати глобальну змінну в тесті і подивимось, чи працює вона належним чином.
describe('Calculator tests', () => { test('add 2 numbers', () => { // arrange & act const val = mathOps.sum(3,4) console.log(globalVar) // assert expect(val).toBe(7) })
Після виконання цього тесту значення globalVar слід реєструвати.
Перевірте тут для вичерпного списку всіх параметрів конфігурації.
Відео-посібник з конфігурації IS
Налагодження за допомогою Jest
У цьому розділі ми спробуємо зрозуміти, як ми можемо налагоджувати тести, написані на основі Jest.
Ми застосуємо та зрозуміємо 2 різні способи, якими ми можемо налагодити тести Jest.
- Власний налагоджувач Node, а потім використовує Chrome Inspector для налагодження тестів.
- Використання конфігурації налагодження Visual Studio Code для налагодження тестів у самому редакторі Visual Studio Code. Це найбільш часто використовуваний спосіб налагодження, оскільки Visual Studio Code є редактором за замовчуванням для більшості розробок Javascript на сьогодні.
Кожен із цих підходів детально пояснюється нижче.
# 1) Використання власного налагоджувача Node
Для того, щоб використовувати власний налагоджувач Node JS, нам потрібно вставити ключове слово «налагоджувач» у тест, де ми хочемо розмістити точку зупинки.
Як тільки виконавець тесту стикається з налагоджувач команда призупиняє виконання, і якщо ми приєднаємо інструменти відладчика chrome, то ми зможемо налагодити тестовий код (а також тестовану функцію) за допомогою інструментів Chrome.
Браузер Chrome - це обов’язкова умова для використання власного налагоджувача Node.
Будь ласка, дотримуйтесь наведених нижче кроків.
# 1) Додайте ключове слово налагоджувача в тесті, тобто в точці, де ви хочете, щоб тест досяг точки зупинку, вставте команду “налагоджувач”
# два) Виконайте тест, використовуючи прапор –inspect-brk.
Використовуйте команду нижче, щоб виконати тест у режимі точки зупинку.
/usr/local/bin/node --inspect-brk ./node_modules/jest/bin/jest.js --runInBand
# 3) Приєднайте налагоджувач вузла в Chrome. Тепер у браузері Chrome перейдіть до chrome: // огляньте та підключіться до цільового прослуховувача, створеного наведеним вище кроком.
# 4) Продовжуйте виконання, і ви побачите, що точка зупинки потрапляє в інспектор налагоджувача chrome, і ви можете налагодити стек викликів та стан об'єкта в самому налагоджувачі chrome.
Цей підхід налагодження тестів Jest є нормальним, але не дуже зручним для користувача, оскільки вам потрібно продовжувати переходити з редактора коду на Chrome і навпаки, що спричиняє велике тертя. У наступному розділі ми побачимо способи налаштування налагоджувача в самому редакторі коду Visual Studio.
# 2) Використання конфігурації налагодження VS Code
# 1) Виберіть розділ «Налагодження / запуск» коду Visual Studio на лівій панелі.
# два) Тепер ми оновимо конфігурацію налагодження для тестів жарту. Для цього додайте нову конфігурацію, вибравши пункт меню.
# 3) Після вибору опції додавання конфігурації на панелі редактора відкриється файл `launch.json` із вмістом за замовчуванням. Видаліть вміст за замовчуванням та скопіюйте вміст нижче для створення конфігурації налагодження для тестів Jest.
{ 'version': '0.2.0', 'configurations': [ { 'name': 'Debug Jest Tests', 'type': 'node', 'request': 'launch', 'runtimeArgs': [ '--inspect-brk', '${workspaceRoot}/node_modules/jest/bin/jest.js', '--runInBand' ], 'console': 'integratedTerminal', 'internalConsoleOptions': 'neverOpen', 'port': 9229 } ] }
# 4) Збережіть нещодавно додану конфігурацію вмісту, яка буде використана для налагодження тестів Jest. Якщо ви уважно прочитаєте конфігурацію, це схоже на те, що ми робили, коли намагалися підключитися до налагоджувача Node в інструментах розробника Chrome за допомогою команди.
--inspect-brk ./node_modules/jest/bin/jest.js --runInBand
Перевага наявності конфігурації тут полягає в тому, що тести запускатимуться / налагоджуватимуться як частина самого редактора (у цьому випадку це VSCode), і нам не потрібно підключатися до будь-якого зовнішнього додатку.
# 5) Після створення конфігурації налагодження тепер ви можете додавати точки тесту до тестів і виконувати за допомогою цієї конфігурації RUN. Це забезпечить зупинку тесту на точках зупинку, і ви зможете налагодити значення та стан об’єкта в точці зупинки у фактичному файлі тесту.
Точки зупинки можна додати, клацнувши біля номерів рядків у файлах коду.
# 6) Після додавання точки зупинки ми можемо вибрати конфігурацію запуску, яку ми додали на кроці 3, щоб виконати / налагодити тест.
# 7) Вибравши / натиснувши кнопку Виконати, ви зможете побачити, що виконання потрапляє в точку зупинки, яка була розміщена, і ви можете отримати більше деталей, таких як значення середовища / змінних, трасування стека тощо у точці зупинки.
Кнопки контрольної точки / точки потоку зупинки / коду можна використовувати для переходу до наступної точки зупинки або переміщення всередині функції для отримання більш детальної інформації.
Відеоурок Він ЄНалагодження
Є Мокка проти жасмину
У нижченаведеному розділі ми порівняємо Jest проти Mocha та Jest проти Jasmine за різними параметрами та порівняннями функцій, такими як тестування Snapshot, простота конфігурації та можливості різних фреймворків.
Параметр | Є | Мокко | Жасмин |
---|---|---|---|
Підтримувані типи тестування | В основному використовується для модульних випробувань. | Блокове тестування | Модульне тестування та тестування E2E. |
Знімок тестування | Повністю підтримується - спеціально використовується для компонентів React, Jest підтримує створення знімків компонента та використання його для порівняння результатів тесту із збереженою структурою компонентів. Знімки - це чудовий спосіб переконатись, що інтерфейс користувача не змінюється несподівано. | Немає підтримки | Немає підтримки |
Твердження та збіги | Використовуйте для збігів бібліотеку awa.js. | Підтримка вбудованого модуля затвердження Node, а також може включати інші бібліотеки тверджень. | У побудованих твердженнях |
Знущання | Повністю побудований на підтримку Mocks and Stubs у Jest. | Немає вбудованої опори для знущань чи ударів. Може використовуватися з іншими бібліотеками, такими як Sinon, для підтримки Mocking. | Вбудована обмежена підтримка за допомогою spyOn. Може інтегруватися з іншими бібліотеками. |
Швидкість виконання | 4x Тести Jest ізольовані у власній пісочниці. Таким чином, тести Jest, по суті, працюють паралельно, завдяки чому вони забезпечують значне поліпшення часу виконання. | х Не підтримує паралельне виконання тестів. | х Не підтримує паралельне виконання тестів. |
Налаштування та налаштування | Дуже просто - потрібна нульова конфігурація. | ||
Режим виконання тесту | Безголовий | Безголовий | Безголовий |
Результат тесту та контекст | Генерує розширений контекст після виконання - Jest надає детальний тестовий контекст, щоб глибоко розібратися в тому, що спричинило збій, забезпечуючи легку налагодження. | Висновок тесту не дуже читабельний і робить налагодження трохи складним. | |
Налагодження | Підтримку власних налагоджувачів Node можна також використовувати для налагодження в таких редакторах, як Visual Studio Code, за допомогою окремої конфігурації запуску. | Підтримує власний налагоджувач Node. | Може використовувати засіб запуску тесту Karma для запуску тестів у Chrome та налагодження. |
Покриття коду | Jest має вбудовану підтримку покриття коду. Конфігурацію покриття можна вказати в конфігурації Jest, а звіти можна створювати при кожному виконанні тесту. | Немає вбудованої підтримки. Забезпечує підтримку зовнішніх бібліотек для створення звітів про охоплення. | Те саме, що і Мокко |
Стиль тестування | BDD Всі три фреймворки підтримують тести, які повинні бути написані як набір специфікацій або специфікацій, які роблять їх більш читабельними. | BDD | BDD |
Висновок
У цьому посібнику ми дізналися про різні способи налагодження тестів Jest у коді Visual Studio або в інспекторі Chrome за допомогою власного налагоджувача Node.
Ми також дослідили загальновживані параметри конфігурації у файлі конфігурації Jest. Конфігурація Jest допомагає досягти багатьох речей, таких як охоплення коду, звіти HTML, налаштування макетної поведінки, налаштування глобальних змінних тощо.
запитання щодо інтерв’ю щодо селену, задані в компаніях
НАЗАД Підручник | ПЕРШИЙ підручник
Рекомендована література
- Підручник з Jest - модульне тестування JavaScript за допомогою Jest Framework
- Як протестувати програми React за допомогою Jest Framework
- Підручник з рамки жасмину, що включає жасминові джакурі з прикладами
- Розподілені збірки: конфігурація Master Slave Jenkins
- Методи налагодження в селені: точки зупинку, режим налагодження та багато іншого
- Підручник з тестування конфігурації з прикладами
- Як налаштувати платформу тестування Node.js: Підручник з Node.js
- 25 найкращих платформ для тестування Java та інструментів для автоматичного тестування (частина 3)