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

🔥Бесплатный курс «Основы JS»: 🔥 Подготовительный курс для начинающих фронтендеров: ✅ Полезные вебинары по программированию каждую неделю: Начнём с откровения: в Хекслете очень сильно топят за написание тестов) Поэтому в этом выпуске мы будем разбираться в Unit-тестировании, а в этом нам поможет Георгий Бузин, Frontend Team Lead в Junehomes: – узнаем, зачем программистам писать Unit-тесты – пройдёмся по инструментам тестирования – от простых к более сложным – посмотрим, какие инструменты помогут в тестировании frontend – напишем 6 тестов с помощью разных подходов и на практике поймём отличия Если видео было для вас полезным, ставьте лайк и поделитесь им с друзьями. Подписывайтесь на наш telegram-канал: ____ 🔗 Полезные ссылки: – Знакомимся с понятием тестов и пишем первые простые тесты: – Вебинар Кирилла Мочевина о написании тестов: – Комьюнити Хекслета: – Какие бывают этапы и виды тестирования: – Чек-лист для разработчиков по тестированию приложений: – Начинаем писать тесты (правильно): – Другие вебинары для разработчиков: ____ 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 для каких целей подходит каждый инструмент тестирования