Как работают тесты на визуальную регрессию

Как это работает

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

Как добавлять тесты

В файле visual-regression.test.ts нужно добавить в массив scenarios объект с информацией о странице (имя, роут и действия для playwright).

Если тест упал

Если тест упал в CI диффы попадут в артефакты (внизу раздела Summary). Затем нужно или сделать фикс, или обновить скриншот

Как обновлять скриншоты

Если тест упал, от запланированного изменения нужно обновить скриншот. Для этого в PR нужно отправить комментарий содержащий /regression. После того как придет коммит с обновлением нужно сделать git pull; git commit --amend --no-edit; git push -f;, чтобы перезапустить CI. Так получается потому что гитхаб не дает триггерить экшены другими экшенами. Хочется это починить.