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

Question

[bernex]

Какие фреймворки существуют для удобного тестирования, что все ровно выглядит и красиво?

Selenium + mocha? Сравнивание по вычислению height+width? Или есть больше магии?

Answer 1

[Дмитрий]

есть вот такая штука
galenframework.com
но я ее не осилил: для моих задач слишком навороченное. если будут по ней вопросы, мне лучше не задавать.

вот тут про них обзорная статья, если документацию читать долго
https://www.smashingmagazine.com/2015/04/visual-te...

Answer 2

[kresh]

Вот инструмент от Yandex - Gemini

Answer 3

[Игорь Яцевич]

2gis.github.io/makeup

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

Answer 4

[xmoonlight]

для удобного тестирования, что все ровно выглядит и красиво

Наложение изображения макета на изображение свёрстанной страницы.
Процент неточностей: 100*D/(X*Y)
D - кол-во различающихся пикселей.
X*Y - произведение ширины на высоту исходного макета.

Если интересуют зазоры между элементами и типография - это уже сегментация изображения и нахождение координат сегментов.

Для "красиво": есть алгоритм-детектор симметрии и подобия/повтора зон симметрии, определение цветовых сочетаний и процентного содержания каждого цвета в этих зонах.

Comments

[65536]

Наложение изображения макета на изображение свёрстанной страницы.

https://addons.mozilla.org/rU/firefox/addon/pixel-...

[xmoonlight]

65536: Спасибо! но тут, двоякое чувство: с одной стороны - встроенное дополнение позволяет быстро проанализировать чисто визуально.
С другой - накладывать картинки в Stand-Alone приложении с большим функционалом - более правильно и это быстрее.
Я бы выбрал бы Stand-Alone с модулем "слепого" рендеринга: URL2IMG
Но, это лично моё мнение.
Спасибо, еще раз!

Answer 5

[Алекс]

Попиксельное отображение? в том числе шрифтов?ну да, ну да))) А мобильную верстку как будете тестировать?