# 166: Научитесь интегрировать визуальное тестирование с Перси - CSS-хитрости

Anonim

Знаете ли вы, что вы можете настроить систему обзора, чтобы каждый запрос на вытягивание показывал вам, что именно визуально изменилось на вашем сайте?

Именно это и делает Перси. Он предполагает, что то, что у вас есть на главном сервере, является правильным (настраиваемым), и, когда вы выполняете запрос на перенос, он буквально делает скриншоты и сравнивает их со снимками того, что находится на главном сервере. Если что-то изменилось, он сообщает вам об этом, как и модульные или интеграционные тесты. Утвердить их и заметить, что что-то не так? Исправьте это и еще раз просмотрите изменения.

Невероятно, что такое тестирование доступно. Так вы действительно можете вселить в свою команду уверенность в том, что она делает именно то, что вы думаете, когда люди вносят изменения в дизайн или контент.

В этом видео я объединился с Майком Фотинакисом (соучредителем Percy), чтобы продемонстрировать все это, а затем буквально все это настроил и разместил на сайте. Мы будем работать над локальным сайтом, используя Eleventy, размещать его вживую на Netlify, интегрировать CircleCI в репозиторий GitHub для сайта и настраивать его для запуска Percy.

Это довольно волшебно, и я действительно рекомендую вам проверить это, чтобы вы знали, какой уровень визуального тестирования возможен в наши дни.