Тесты в Jest мощные, но отладка тестов Jest может оказаться сложной.
Для меня отладка тестов с использованием Jest обычно состояла из нескольких console.log
statements. Может быть действительно сложно выяснить проблему в тесте без возможности пошагового выполнения кода. К счастью, Chrome Node DevTools позволяет нам использовать debugger
или точки останова, так что мы можем шагать по нашему коду и изучать объекты. Это может позволить нам разрешить некоторые из тех сложных ситуаций, когда console.log
просто не предоставляет достаточно информации, всего за несколько шагов.
- Вставьте
debugger
в свой тест
- На новой вкладке Chrome введите
chrome://inspect
- Нажмите «Открыть выделенный DevTools для узла».
- В вашем терминале введите
node —-inspect node_modules/.bin/jest --runInBand <path_to_test>
Примечание * <path_to_test>
- это фактический путь к вашему тесту
Используя параметр Jest —-runInBand
, мы можем заставить Jest запускать каждый тест последовательно (в том порядке, в котором они появляются в вашем файле). Это позволяет консоли останавливаться на операторе debugger
, а не продолжать выполнение других тестов в других процессах. Ознакомьтесь с документацией здесь. В дополнение к вышеупомянутой опции одиночного запуска у вас также есть возможность объединить ее с режимом Jest --watch
, который будет повторно запускать тест после каждого сохраненного изменения.
Ваш тест должен быть приостановлен в Chrome DevTools, где теперь вы можете использовать все инструменты, которые обычно используются в инспекторе Chrome.
Упростите процесс отладки, превратив эту команду в сценарий NPM. Добавьте приведенный ниже код в свои package.json
сценарии и запустите его из командной строки.
npm run test:debug <path_to_test>
{ "scripts": { "test:debug": "node --inspect node_modules/.bin/jest --runInBand", } }
Дополнительным бонусом для моих коллег-пользователей VSCode является плагин Debugger for Chrome, и вы можете воспроизвести тот же процесс прямо в своем редакторе!
Удачной отладки!