Разница между "mount" и "shallowMount" в Vue-Test-Utils?
Отказ от ответственности: я довольно плохо знаком с Vue, JavaScript и веб-фреймворками в целом.
Я пытаюсь ознакомиться с некоторыми базовыми тестами модулей и компонентов, используя Jest и vue-test-utils.
Я прочитал документы на vue-test-utils
' mount () и shallowMount (), но я не уверен, когда использовать один поверх другого (они очень похожи).
Согласно документам на shallowMount()
:
Как и mount, он создает оболочку, которая содержит смонтированный и визуализированный компонент Vue, но с заглушенными дочерними компонентами.
Что именно подразумевается под "заглушенными дочерними компонентами"? Можно mount()
а также shallowMount()
быть взаимозаменяемыми?
2 ответа
Документация подразумевает под "заглушенными дочерними компонентами" то, что все компоненты в тестируемом компоненте не будут отображаться. Вместо этого у вас будет компонент-заполнитель.
Это предотвращает паразитирование ваших тестов поведением других компонентов.
На мой взгляд, вы всегда должны монтировать компоненты при выполнении модульных тестов и просто монтировать их при выполнении тестов во всем приложении.
Я не согласен с Томасом Ферро, хотя его объяснение их функции верно, но я не согласен с тем, какой метод использовать. По моему мнению, вы всегда должны использоватьmount
вместоshallowMount
.
Чтобы объяснить это, я сошлюсь на статью Мартина Фаулера: https://martinfowler.com/articles/mocksArentStubs.html.
Существует два разных типа TDD: макетный и классический TDD. Когда вы все имитируете, ваш тест будет знать много о (некоторых) зависимостях. Таким образом, если срабатывает метод из дочернего компонента/зависимости, ваш тест узнает об этом.
В классическом TDD вам следует имитировать только пограничный уровень (веб-вызовы, вызовы файловой системы, вызовы базы данных, вызовы просмотра), и ничего больше. Таким образом, название «модуль» или «Тестируемая система» не подразумевает отдельный объект, а может представлять собой набор объектов.
Это означает, что стиль макета также сломается, когда этот метод изменит свое имя. Вместо этого преимущество классического TDD заключается в том, что вы не знаете имя этого метода (и вас это не волнует).
Думайте об этом (классическом TDD), как о вводе некоторых переменных в качестве входных данных и проверке выходных данных или состояния. Игнорируйте все детали между ними. Преимущество этого является одним из преимуществ TDD, которое теряется в стиле мокаста: вы можете бесстрашно рефакторить и преобразовывать свой код. Если вы измените имя метода зависимости (рефлексирование), ваш тест все равно пройдет, поскольку метод не подвергается издевательству.
Обработать тест, если зависимость не существует (только в конструкции). Опять же, единственными исключениями являются веб-вызовы (http-запросы), вызовы репозитория (базы данных/файловые системы), вызовы просмотра.
Поэтому, если вы выполните рефакторинг дочернего компонента в основной компонент или в другой дочерний компонент, ваш тест все равно пройдет. Потому что классический TDD проверяет ввод и вывод (и состояние), а не зависимости.