Temat: Automatyczne porównywanie wyników renderingu przeglądarek internetowych
(we współpracy z Samsung Electronics)

Przemysław Rokita, Julian Myrcha, Jacek Piotrowski

Celem projektu było stworzenie narzędzi do automatycznego testowania przeglądarek internetowych. Głównym zadaniem w ramach podjętych prac była walidacja rezultatów działania silnika renderingu HTML, przez porównanie obrazów generowanych dla użytkownika. Opracowano metrykę, która określa percepcyjną odległość pomiędzy obrazami wejściowymi. Pozwala to na porównanie i weryfikację wyników renderingu. Opracowane rozwiązanie może zostać zastosowane do statystycznego testowania przeglądarek. W ramach projektu opracowano system, który nie tylko mierzy odległość, ale również generuje raporty wyjaśniające różnice między obrazami, dostarcza listę defektów oraz ocenia ich wpływ na rendering.

Mając przykładowy adres strony internetowej możemy wyświetlić jej zawartość w różnych przeglądarkach:

Przyk?adowa strona Przyk?adowa strona

Przykładowa strona w przeglądarce chrome (obraz po lewej stronie) i firefox (obraz po prawej stronie).

Chociaż w obu przeglądarkach wyświetlane jest to samo źródło, obrazy mogą się różnić zarówno geometrią jak też chwilową zawartością - często pojawiają się np. reklamy, zaburzające układ całości.

Przyk?adowa strona Przyk?adowa strona

Układ stron z poprzedniego przykładu po automatycznym rozpoznaniu budowy.

Dla finalnego odbiorcy, chociaż na pierwszy rzut oka dostrzeże różnicę, strony nadal mogą wydawać się praktycznie identyczne. Podobny problem występuje w przypadku tekstu - oprócz ogólnego podobieństwa użytych fontów bardziej liczy się tekst, a nie dokładne odwzorowanie pikseli.

Opracowany algorytm w sposób adaptacyjny analizuje różne fragmenty porównywanego obrazu strony (grafika, zdjęcia, tekst) i na podstawie charakteru porównywanego fragmentu w odpowiedni sposób uwzględnia różnice.

Opracowany system umożliwia automatyczną weryfikację graficznego obrazu szeregu stron internetowych i wskazanie tych, które w nowej wersji przeglądarki produkują odmienne wizualnie wyniki. Zadana miara odmienności uwzględnia różne aspekty wizualne i geometryczne porównywanych stron.