Организация тестирования картинок - сравнение двух похожих

инструменты
, ,
#1

Всем привет!
Я Java разработчик и так уж вышло, что написал небольшую библиотеку для сравнения картинок.

И мне уже не первый раз пишут автоматизаторы, что хотят ее использовать - я ее опубликовал и теперь хочу вынести ее на ваш суд - показать и увидеть, будет ли она еще кому-то полезная, может что-то есть, что можно добавить/изменить.

Есть две картинки - expected и actual и идет их сравнение.
Объект результата будет состоять из этих двух картинок, результата сравнения и енама с состоянием(MATCH, MISMATCH, SIZE_MISMATCH).

Usecase: есть две картинки, которые как-то формируются программно и должны быть одинаковы, за исключением каких-то областей, например:
Первая картинка

972×1967 79.4 KB

Вторая картинка

972×1967 80.6 KB

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

972×1967 77.9 KB

Если есть части, которые не исключены и они различаются - то они будут окрашены в красные прямоугольник, например вот:

985×701 41.8 KB

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

С уважением, Роман.

4 лайка
#2

Новые либы - это замечательно, но чем отличается от https://github.com/pazone/ashot
?

2 лайка
#3

@dimand58, я не знаком с этой библиотекой. Сложно сказать что она может по описанию в README. Она покрывает функционал, который я описал?
Преимущество моей библиотеки в том, что она не зависит ни от чего и выполняет одну функцию, быстро и хорошо.

#4

А сравнение идёт попиксельно? Есть возможность сравнивать картинки с разным разрешением, например?

1 лайк
#5

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

С уважением, Роман

#6

Если вся картинка сдвинется на пиксель в сторону, то она вся подкрасится как изменившаяся?
По-моему 100% схождение до пикселя не очень удачная идея, особенно в тестировании и особенно при проверке верстки на разных браузерах. Но все равно спасибо за то, что поделились библиотекой, возможно кому-то она очень поможет.

2 лайка
#7

@Mihail_Bratuhin
Да, в случае когда может быть сдвиг картинок - это применить нельзя будет. Такие вещи, как обнаружение и понимание - это уже совсем другой уровень задачи.

#8

Я более пристально изучил эту либу и хочу сказать, что там другой функционал и другое назначение. То есть в случае использования которое я описал, искрумент aShot явно излишний и не имеет всех тех данных, которые предоставляются у меня в библиотеке.
Там всё-таки заточен продукт под скриншоты и сравнение идет именно там. В моей библиотеке все это не важно, важно что есть картинки и все.

Надеюсь, что ответил на ваш вопрос.

С уважением, Роман.

1 лайк
#9

из документации:

               //Threshold - it's the max distance between non-equal pixels. By default it's 5.
               imageComparison.setThreshold(10);
               imageComparison.getThreshold();

Можно поподробнее? Что значит max distance between non-equal pixels, в каких единицах и зачем

1 лайк
#10

Хороший вопрос @Drake, спасибо!

Так как сравнение завязано на то, чтоб потом отобразить области различия, в проекте это сущности Rectangle, то нужно как-то эти области определить.
Имеется в виду, что есть предположение, что области различия не должны быть непрерывными, а могут разделяться пикселями, которые одинаковы. И это число отвечает за то, какое расстояние будет учитываться при сравнении.

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

Я ответил на вопрос?

С уважением, Роман.

#11

Интересно, зачем вы хардкодите толерантность в 10%, а не даете пользователю самому настраивать степень толерантности. Н-р для сравнения маленьких картинок погрешность стоит понизить.
И в методе вычисления евклидового расстояния:

        double result = Math.sqrt(Math.pow(red2 - red1, 2) +
                Math.pow(green2 - green1, 2) +
                Math.pow(blue2 - blue1, 2))
                /
                Math.sqrt(Math.pow(255, 2) * 3);

каждый раз вычисляете константу Math.sqrt(Math.pow(255, 2) * 3);. Хотя можно это сделать один раз, при инициировании класса. Не знаю, может джава умеет кэшировать такие выражения внутри себя. Да и вообще избавиться от лишней операции возведения в степень: 255 * Math.sqrt(3)

1 лайк
#12

Хороший вопрос, @Sergei_Chipiga, спасибо!

Так исторически сложилось, что уровень стоит как 10%. Если есть необходимость - этот функционал может легко быть добавлен. Такого запроса еще не поступало.

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

По поводу вычисления, нужно подумать чтоб ответить однозначно. Нужно подумать, посмотреть. Кеширование данных мне точно не нравится, так как это влечет усложнение механизма. Если есть реальные идеи как это реализовать - я открыт к обсуждению.

Я ответил на ваши вопросы?

С уважением, Роман.

#13

@romankh3 ответили :slight_smile: и честно говоря ответы довольно забавные, не особо горя желанием заниматься ненужной дискуссией, просто пару комментов по самому броскому:

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

Тут по сути смотреть даже особо нечего, при условии конечно что это вы писали код. Метод в цикле для стандартной картинки вызывается не меньше 1 000 000 раз, и каждый раз производится вычисление одного и того же значения, что явно не гуд по перформансу.

А так ну прикольно, еще одна тулза для сравнения картинок :slight_smile:

1 лайк
#14

Спасибо @Sergei_Chipiga за дельные комметарии, я учту их в следующем релизе.

С уважением, Роман.

1 лайк
#15

эээм… @Sergei_Chipiga а можете показать еще “тулзу” где в 2-3 строчки можно сравнить 2 картинки с игнор областями?

1 лайк
#16

Не думаю, что это нечто экстраординарное, вот плиз н-р разработка от Яндекса GitHub - gemini-testing/looks-same: Node.js library for comparing images
Здесь можно получить массив регионов различий, разбитых по кластерам, и уже дальше решать - игнорить эти регионы или фейлить тесты. И других плюшек полно. Но не совсем java, a немного javascript :slight_smile:

#17

@Sergei_Chipiga спасибо конечно, но вот как раз автомейшены юзают java часто…и как раз на джаве я не нашел толкового решения кроме либы Романа…

1 лайк
#18

к сожалению вы забыли уточнить когда спрашивали :slight_smile:

эээм… @Sergei_Chipiga а можете показать еще “тулзу” где в 2-3 строчки можно сравнить 2 картинки с игнор областями?

как раз автомейшены юзают java часто

Не стоит так сильно льстить джаве :), питон и джаваскрипт составят достойную конкуренцию. И странно что на “частой” джаве только-только заимплиментили то, что на js уже есть пару лет.

#19

Я не думаю, что мы здесь будем спорить о том, популярная ли Java. Хватает тех, кто ею пользуется.
Тем, кто автоматизирует на Java будет ой как не просто использовать библиотеки других языков. Плюс мы же не можем сказать. что такого нет.

1 лайк
#20

есть довольно популярное решение использующее на windows или lunux ImageMagick – Download -
Developer's Guide
например
GitHub - swtestacademy/VisualAutomationImageMagickSelenium: Visual Test Automation with ImageMagick, Selenium Webdriver and AShot

я себе сделал форк (но не совсем - upstream не собираюсь ничего:

1 лайк