Как автоматически проверить верстку?

Question

[drtvader]

Привет всем!
Интересует как организовать тестирование проектов.
Очень часто случается так что в процессе правок багов появляется еще десяток багов в других местах.
Это в основном касается средних и крупных проектов и когда есть команда из разного уровня разработчиков, например есть баг, правишь, а на др страницах в блоках с модификаторами ломается потому что забыли/не знали что там надо обнулить свойство.
Как вижу сие действие, человек поправил, сборщик проверил и сообщил что в таком месте сломалось.
Есть что то такое?

Comments

[Михаил]

Что подразумевать под "сломалось"?

[drtvader]

Михаил, это значит например то что появился лишний паддинг в блоке.

Answer 1

[Vyach Gor]

в закладках лежат пару ссылок по этой теме - ждут своего часа ) - link и link2

Comments

[drtvader]

Спасибо, про BackstopJS читал уже, ищу еще варианты.

Answer 2

[Никита Михайлов]

Я использую два инструмента:

1. jest-dom. Это если надо точечно проверить элементы на странице. Удобно, если нет необходимости тестировать прям всё всё всё. Стучишься до нужно элемента и проверяешь его.

2. jest-image-snapshot. Тестирование через скриншоты отлично помогает при тестировании пользовательского поведения. Там всякие скроллы, ховеры, фокусы и так далее. По сути просто делаешь эталонный скриншот страницы, вбиваешь поведение страницы. После этого при тестировании проверяется, не сломалось ли поведение

Answer 3

[Dmitry Roo]

Jest умеет в снапшоты
https://jestjs.io/docs/en/snapshot-testing