- 11 Мар 2020
- 13.593
- 272.294
Мастер-класс: тестирование 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 минут) фрагменты теоретических изысканий, объясняющих всё “на пальцах” (а точнее пером по экрану)
- Что именно тестируется во Vue-компонентах?
- Вывод компонента в зависимости от props
- Когда мы передаем такие-то параметры, мы ожидаем что кнопка видна
- Когда мы передаем такие-то параметры, мы ожидаем, что видна аватарка пользователя с такими-то параметрами
- Генерирование побочных эффектов
- Когда пользователь нажимает на вот этот элемент, мы ожидаем что компонент генерирует событие "Submit" с такими-то параметрами
- Когда компонент появляется в DOM-дереве, мы ожидаем что компонент вызывает функцию getUser у такого-то объекта
- Реакция компонента на внешние воздействия
- Когда мы вводим данные в это поле, мы ожидаем что вот эта кнопка будет включена
- Когда компонент dropdown генерирует событие change, мы ожидаем что вот это поле будет обновлено
- Когда вызванная функция возвращает такие-то значения, мы ожидаем что в списке будет ровно три элемента
- Что предлагает нам @vue/test-utils для тестирования?
- Жизненный цикл компонента сквозь призму тестирования
- Холивар: mount vs shallowMount
- Как выбрать?
- Стоит ли всегда выбирать одно?
- Последствия выбора?
- Бонус: А что поменяется во Vue3?
- Бонус: Компонентные тесты и Vue: как и когда?
Семинар представляет собой написание и критику конкретных тестов на Jest реального кода с пояснением что и для чего применяется. Другими словами: соотношение “документации” к практике ее применения составляет около 30 к 70% по оценке автора
- Антипаттерны тестирования Vue-компонентов
- Тестирование computed-свойств
- Использование setData
- Использование setProps
- Использование setMethods
- Тестирование снапшотами
- Какие задачи решают снапшоты
- Когда стоит использовать снапшоты и как
- Слабые места снапшотов
- Структура классического Vue-теста
- Фикстуры
- Какую задачу решают фикстуры?
- Почему важно использовать фикстуры, а не писать самому параметры?
- Аккуратно: мутация фикстур!
- Признаки "здесь надо использовать фикстуры"
- Тестирование компонентов со слотами
- В чём сложность?
- Создание простейшего стаба для рендера слота
- Стабы с динамическими слотами
- Scoped slots с логикой
- Когда можно вместо стаба передать настоящий компонент и чем это грозит?
- Тестирование компонентов с Vuex
- Создание и передача мока сторы
- Как портят жизнь `mapActions, map...`
- Корректно мокаем actions/mutations
- Тестирование самой сторы
- Тестирование компонентов с Apollo GraphQL
- Что для компонента означает использование в нем Apollo?
- apollo-link-mock
- На что обратить внимание
У вас нет прав на просмотр ссылок, пожалуйста: Вход или Регистрация
Скачать:
Для просмотра скрытого контента необходимо Войти или Зарегистрироваться.
Последнее редактирование модератором:
