Unit-тесты во фронтенде: 6 примеров с кодом, инструменты и подходы | Хекслет

Начнём с откровения: в Хекслете очень сильно топят за написание тестов) Поэтому в этом выпуске мы будем разбираться в Unit-тестировании, а в этом нам поможет Георгий Бузин, Frontend Team Lead в Junehomes:
– узнаем, зачем программистам писать Unit-тесты
– пройдёмся по инструментам тестирования – от простых к более сложным
– посмотрим, какие инструменты помогут в тестировании frontend
– напишем 6 тестов с помощью разных подходов и на практике поймём отличия

Если видео было для вас полезным, ставьте лайк и поделитесь им с друзьями.

🔗 Полезные ссылки:
– Знакомимся с понятием тестов и пишем первые простые тесты:    • Тесты и автоматическое тестирование / Введ...  
– Вебинар Кирилла Мокевнина о написании тестов:    • Начинаем писать тесты (правильно) — Кирилл...  
– Комьюнити Хекслета: https://ttttt.me/hexletcommunity
– Какие бывают этапы и виды тестирования: https://ru.hexlet.io/blog/posts/vidy-...
– Чек-лист для разработчиков по тестированию приложений: https://ru.hexlet.io/link/aQzsVl
– Начинаем писать тесты (правильно): https://ru.hexlet.io/link/R6ekK2
– Другие вебинары для разработчиков:    • Уроки и доклады для программистов  
____



Таймкоды:
00:00:00 интро
00:00:21 зачем программистам писать Unit-тесты
00:01:37 что нужно тестировать
00:02:58 пирамида тестирования
00:04:57 необходимость тестирования
00:05:36 какие кейсы мы сегодня разбираем
00:06:34 как развивалось тестирование кода – эра SPA
00:08:12 Unit в других языках программирования и во фронтенде
00:09:27 Unit в NodeJS + ES5
00:10:07 как пишут Unit-тесты сейчас
00:10:48 кейс: простые тесты NodeJS с помощью describe, it и strictEqual
00:16:06 кейс: тестируем умножение и добавляем forEach
00:18:38 кейс: тестирование функций высшего порядка, mocking + expire
00:24:53 плюс использования Unit-тестов с mock
00:26:33 эмуляция DOM
00:27:38 кейс: native unit test с happy-dom
00:33:05 фреймворки Unit
00:35:35 кейс: пример тестирования компонента vitest + testing library
00:42:42 как используется expect
00:44:15 имеет ли значение сборка
00:46:45 test debug и test addiction, getbyRole, library user-event
00:53:56 тестирование с помощью renderHook
00:57:43 плюсы и минусы использования testing library
00:59:18 Snapshot тестирование
01:01:12 кейс: пример snapshot теста
01:03:02 плюсы и минусы использования Snapshot-тестов
01:04:53 проблемы jsdom и happy-dom
01:06:07 components тесты и headless browsers
01:09:43 пример компонентного теста в Playwright и cypress
01:20:26 плюсы и минусы компонентного тестирования
01:21:15 кейс: Screenshot тесты
01:26:18 плюсы и минусы Screenshot тестирования
01:26:55 для каких целей подходит каждый инструмент тестирования

#программирование #js #unittesting #хекслет

Unit-тесты во фронтенде: 6 примеров с кодом, инструменты и подходы | Хекслет