Compare logos on pages

[ppfeifer]

We have 40 institutions  websites that must display 1 of the 3 approved logos. Additionally, they have  2 pages on their website to  place the logo.   So what that means is we have to check both known locations for the 1 of the 3 different possible logos and mark them in-compliant only if a logo doesn't display on  one of the 2 pages.   

To begin with, not sure how to compare the images.   We have the 3 logo images on our website. Can 3 separate checkpoints be used to compare and still only log 1 error message if none exist on either page?

Can 3 different IF Objects be utilized in a loop to check for the 3 logos?

Not sure of the best way to proceed.   

Is there a way to compare images from 1 website to another or can the images from our website be stored in the keyword test and then compared to the institution websites for 1 o exist?  

I am still an intermediate level TestComplete user and I have not been successful in setting up this keyword test.

Any help will be appreciated! 

[ppfeifer]

Aliases.browser.pageFloridashinesCollegesCareers.imageF41f8c66430783359e49B68bdb3

[Marsha_R]

I'm looking for a screenshot more like this, preferably with the whole Advanced view.

[ppfeifer]

Okay!

[ppfeifer]

Was the screenshot helpful?

I am providing additional information that might help with providing a solution:

All of our 40 institutions are required by law to place a logo on 2 of their web pages – distance learning and advising -  that we provide to them.   We give them  the image (logo)  and they place it on their pages.   

There are 3 acceptable logos/banners on our website:  https://www.floridashines.org/fs-catalog-banners

Here is an institution website that is in compliance: https://www.hccfl.edu/academics/hcc-online (If you notice none of the attributes/elements/properties are the same).

Using this documentation: Finding an Image on a Web Page

Searching for an HTML element displaying the desired image

• We tried various ways do find the image on the pages  but because the image name is not the same for each website or the size is different, the location varies, the id is different,  etc. ,   find an image using "Searching for an HTML element displaying the desired image" doesn’t seem to be the way to go.  

We used the sample code using python provided in the documentation for Searching for the desired image using picture comparison

• We then did picture in a picture to compare the image of the logo but still come up with image not found.  We may have something not coded correctly I am thinking this must be the way to go since all of the webpages will be different  but the image will be the same except size and coloring may be  different.  The only thing constant is the text on the image.

I am thinking of another option -  OCR recognition to just find the text on the image. Can that been done if we can’t get picture in a picture to work?    Could the web page be the object and then do the OCR Checkpoint for just the text on the image? Or will the image object have to be identified on the page?

[Marsha_R]

I don't know much about the image comparison but I was thinking how I might approach this test, so maybe this is an option for you that's easier to implement.

I would get the image names and locations from each site and put them in a file or spreadsheet.  Include a flag in the spreadsheet for In Compliance and set that now as well, in case some pages aren't good when you start.

Have your test run through the file and if the flag is false, log an error.  If the same image is found in the same place as before, no error and flag is set to true.  If the image is not found, log an error and set the flag to false.  Chances are the ones in compliance won't change very often so the list shouldn't take much maintenance and you need a list of the out of compliance ones anyway.

[ppfeifer]

Thank you Marsha.   Unfortunately, there is only 1 in 40 that are in compliance.   That solution would make the script maintenance intense and static.   Need to be able to dynamically check each page (80 pages).  As it is, the URLs to the pages changes too often and we have a check for valid URL as well.   I appreciate all of your help!

[jr348 · Accepted solution]

I had a similar problem a few years ago looking for certain icons in a map that could not be spied..

We stored the icons as images in the images store.

Took a bitmap snap shot of the page object/map.

Did an image find within the snaps shot.

If it was found then record certain info about it like top-left, bottom-right coordinates etc.  This allowed us to click it and do stuff.

It was slow though..

Cant remember the exact coding but that was the general idea.

[sonya_m]

Thanks, everyone!

Thank you for sharing your experience with us @jr348 !  @ppfeifer Do you think you could try doing something of the kind in your scenario?