Visual Testing in Katalon Studio


#42

@rajani.gangadhara

Which version of the “VisualTestingInKatalonStudio” project are you looking at? I presume you are looking at v1.9.2 or earlier. The most up-to-date version is v.1.10.9.

At the version 1.10.0, I made a significant change to this project. I introduced a Gradle plugin visualtestinginks, which makes it very easy to “enable your own Katalon Studio project to perform Visual Testing — twins mode and chronos mode”. I changed completely the method to make your own project to be capable of Visual Testing. Therefore I DELETED the document “Step by step instruction” as its content is no longer valid as of v1.10.x.


#43

Now @rajani.gangadhara showed his interest to this project. I got much pleased, thank you, but a bit frightened. I must confess, the version 1.10.x has some compatibility problem. The users of 1.9.x may encounter problem upgrading to 1.10.0.

To be honest, I thought nobody (except myself) would be looking at this project, so I did not take care about compatibility at all.


#44

Thanks a lot for the Quick reponse and your help :slight_smile:


#45

@kazurayam Hi can I use this for testing images within larger image? Say I have a full page screenshot, then I take a smaller section of the page and say find image1 inside image 2. I tried to do this a few years ago with but there were too many false positives.

Thanks.


#46

Hi,

For this use case you can try to search for Sikuli library which provides you with a set of APIs to find an image within another image.

Cheers !


#47

Hey Thanh, Sikuli was actually what I used back then and it wouldn’t work with finding say an element button in a full screen image.


#48

Hi.

What was the difficulties ? I tried Sikuli before and I think it works rather nicely.


#49

It wouldn’t find the image I will try again maybe it’s fixed.


#50

My VisualTestingInKatalonStudio project uses the aShot library.

The aShot library supports taking an image of a specific Web Element in a page, as well as taking a full page screenshot.

WebElement view

aShot takes a screenshot in three simple steps:

  • Capture a screenshot of the entire page
  • Find the element’s size and position
  • Crop the original screenshot

As a result, aShot provides an image of the WebElement

If you are interested in a specific Web Element in a page and if you can locate that element using Katalon’s Web Object (using XPath expression or CSS selector), then I suppose that aShot might be useful for you.

The example VisualTestingInKatalonStudio project demonstrates how to compare pairs of entire page screenshots. But you can compare images of specific Web Elements in pages as well. Full page or not — it doesn’t really matter.


#51

Hi Kazurayam,

What If I create the base assertion screenshots to be compared manually, I’m assuming it would still work correct?

Say I manually capture an element save it locally somewhere, then pass it on to find in the full page screenshot?


#52

Unfortunately not.


#53

Hi @ThanhTo

Do you have a code sample for Sikuli?


#54

@kazurayam If I use the framework to capture the screenshots for the elements can the scenario work?

Basically to test the same environment like someone mentioned.

  1. Create baseline element image through framework (never update)
  2. Create 2nd element image to compare through framework.

#55

@kazurayam

Worked like a charm thanks for this amazing library was pulling hair with Sikuli again.

Basically I run the script once to take screenshot of Element into Baseline Folder (Will Change As UI changes, rarely)
Then change the script to take screenshot of Element into the Current Folder
Then run the comparison

Thanks Again!!! Saved me countless of hours


#56

@ealiaj,

I am not sure if you have already solved your problem, or still asking me some question. If you have any question, could you please reword it a bit more clearly?


#57

solved thanks


#58

The following post will show you a simpler way to compare images of a specific web element in a page.