Во всем мире пользовательских интерфейсов я наблюдаю тенденцию, когда люди меняют свои тестовые пакеты, чтобы использовать Jest вместо чего-то вроде Karma и Mocha. Обычно главное преимущество, которое рекламируют, - это скорость 🏎💨
О чем обычно не говорят, так это о компромиссе, который вы здесь делаете - вы больше не проводите тестирование в среде, которую фактически используют какие-либо пользователи. Вы больше не можете тестировать в Safari, Chrome, Edge или Firefox. Вы запускаете свои тесты на JSDOM, который является реализацией спецификации DOM. Я не вижу в этом ничего лучше, чем что-то вроде PhantomJS (RIP in peace). Существуют кроссбраузерные ошибки, и DOM - это не просто деталь реализации.
Не поймите меня неправильно, Jest - действительно отличный тестер. В этом есть что любить. Вот почему я кровно заинтересован в том, чтобы заставить его работать в реальном браузере. Но увеличение скорости, которое вы получаете от запуска ваших тестов в JSDOM, не стоит того компромисса, на который вы идете, imo.
Лучшее из обоих миров
Вполне возможно иметь молниеносные быстрые модульные тесты компонентов, которые полностью монтируются в DOM внутри реального браузера. Как быстро? Как насчет 661 теста, который выполняется за 17 секунд? Вот тебе доказательство. После того, как все было скомпилировано и запущен браузер, общее время составляет 51 секунду. Вот источник репо, откуда берутся эти тесты.
Как?
Карма не медленная. Настоящая модель DOM не такая медленная, как вы думаете. Вероятно, это инструменты, которые вы выбрали для написания этих тестов. В приведенном выше примере, который выполняется так быстро, используется пакет под названием Interactor.js. Interactor.js - это составной, неизменяемый, асинхронный способ взаимодействия с компонентами или приложениями, как это сделал бы пользователь. Из введения в документации:
Интеракторы работают везде, где есть DOM, и работают вместе с вашими тестами для получения невероятно быстрых результатов. Они автоматически ждут, пока элементы существуют в DOM, прежде чем взаимодействовать с ними, а также предоставляют простой интерфейс для создания асинхронных утверждений против DOM.
Эти тесты с Interactor.js не только очень быстрые, но и дают много преимуществ без каких-либо компромиссов, как JSDOM (и быстрее). Вы тестируете в реальном браузере s, фактически взаимодействуя с DOM, как пользователь в реальной жизни.
Объедините Interactor.js с чем-то вроде testing-hooks или dom-testing-library, чтобы смонтировать компоненты в DOM, и вы получите очень мощную комбинацию! Представьте себе этот пример, который завершается менее чем за секунду:
Это только поверхностный обзор возможностей, которые открывает Interactor.js. Думаю, стоит взглянуть, прежде чем переносить тесты на Jest (или JSDOM).
