[Илья Климов] Тестирование Vue-приложений (2021)

[Admin]

Автор: Илья Климов
Название: Тестирование Vue-приложений (2021)

Описание:

Кратко:

• Серия видео по ключевым аспектам теории
• 2 real-time семинара (суммарно около 4-5 часов) с разборами реальных примеров тестирования Vue-компонентов с использованием Jest (запись будет снабжена таймкодами для удобной навигации)
• репозиторий с примерами с семинаров
• Закрытый чат по тестированию (хочу знать каждую вашу боль!)
• Доступ к видео: 1 февраля 10:00 по Украине, семинары: 6 и 13 февраля 11:00 (пара часов + общение)

Зачем мне это?
Как показал мой опыт работы в GitLab - тестирование Vue-компонентов не самая сильная сторона даже тех, кто съел собаку на тестировании к примеру backend-кода. Здесь “аукается” то, что во Vue очень много сложных возможностей, которые нетривиально тестировать. Добавьте к этому некие удивительные особенности @vue/test-utils (у автора порядка 10 принятых pull-requests в репозиторий) - и получите прекрасный коктейль сложного тестирования.


Теоретическая часть

Видео представляют собой небольшие (~15-30 минут) фрагменты теоретических изысканий, объясняющих всё “на пальцах” (а точнее пером по экрану)

• Когда пользователь нажимает на вот этот элемент, мы ожидаем что компонент генерирует событие "Submit" с такими-то параметрами
• Когда компонент появляется в DOM-дереве, мы ожидаем что компонент вызывает функцию getUser у такого-то объекта

[*]Реакция компонента на внешние воздействия

• Когда мы вводим данные в это поле, мы ожидаем что вот эта кнопка будет включена
• Когда компонент dropdown генерирует событие change, мы ожидаем что вот это поле будет обновлено
• Когда вызванная функция возвращает такие-то значения, мы ожидаем что в списке будет ровно три элемента

[*]Что предлагает нам @vue/test-utils для тестирования?
[*]Жизненный цикл компонента сквозь призму тестирования
[*]Холивар: mount vs shallowMount

• Как выбрать?
• Стоит ли всегда выбирать одно?
• Последствия выбора?

[*]Бонус: А что поменяется во Vue3?
[*]Бонус: Компонентные тесты и Vue: как и когда?

Практическая часть

Семинар представляет собой написание и критику конкретных тестов на Jest реального кода с пояснением что и для чего применяется. Другими словами: соотношение “документации” к практике ее применения составляет около 30 к 70% по оценке автора

• Тестирование computed-свойств
• Использование setData
• Использование setProps
• Использование setMethods

[*]Тестирование снапшотами

• Какие задачи решают снапшоты
• Когда стоит использовать снапшоты и как
• Слабые места снапшотов

[*]Структура классического Vue-теста
[*]Фикстуры

• Какую задачу решают фикстуры?
• Почему важно использовать фикстуры, а не писать самому параметры?
• Аккуратно: мутация фикстур!
• Признаки "здесь надо использовать фикстуры"

[*]Тестирование компонентов со слотами

• В чём сложность?
• Создание простейшего стаба для рендера слота
• Стабы с динамическими слотами
• Scoped slots с логикой
• Когда можно вместо стаба передать настоящий компонент и чем это грозит?

[*]Тестирование компонентов с Vuex

• Создание и передача мока сторы
• Как портят жизнь `mapActions, map...`
• Корректно мокаем actions/mutations
• Тестирование самой сторы

[*]Тестирование компонентов с Apollo GraphQL

• Что для компонента означает использование в нем Apollo?
• apollo-link-mock
• На что обратить внимание

Подробнее:

Для просмотра скрытого содержимого необходимо Войти или Зарегистрироваться.

Скачать:

Для просмотра скрытого содержимого необходимо Войти или Зарегистрироваться.