Taking entire page screenshot using AShot in Katalon Studio


I have made a demo project here:


Problem to solve

I wanted to take an screenshot of a Web page. The target page was supposed to have the height over 10,000px.

I tried WebUI.takescreenshot() and found it can only take visual portion; it can not take the image of entire page.


By searching I found a Java Library called AShot.

WebDriver Screenshot utility

  1. Takes a screenshot of a WebElement on different platforms (i.e. desktop browsers, iOS Simulator Mobile Safari, Android Emulator Browser)
  2. Decorates screenshots
  3. Provides flexible screenshot comparison

I was impressed with the simplicity of the sample code of capturing the entire page by AShot. So I tried AShot in Katalon Studio.

I have found AShot works like a charm.

Here I attached the screenshot taken by AShot:

How to modify report’s File Name, How to take entire page screenshot, Mouse Over is not working
[WebUI] Take Screenshot

cool +1


This is great. I tested it on a PC browser and it seems to work 90% of the time (the seams between the pictures were sometimes a bit off but its great.
I tried it on a phone browser and all it seems able to do is take a zoomed in screenshot. I only see the top left hand corner of the browser. Any idea what is happening?



I have no idea.
I think aShot has nothing to do with browser zooming.


I think AShot takes screenshot of a single web element. I use it to screenshot only the pop-up error messages from my app, but if you set it up for taking a screenshot of the element, it will get the whole page.



aShot supports 2 distinct method signatures:

  1. public Screenshot takeScreenshot(WebDriver driver, WebElement element) — taking a screenshot of a specific HTML element
  2. public Screenshot takeScreenshot(WebDriver driver) — taking entire page screenshot

Which method are you calling?


Thanks for your reply.

It doesn’t actually zoom the browser in, the browser on the phone stays the same, it just takes a picture of the top left corner of the browser, so that’s all you see in the picture. It just makes it look like it has been zoomed.
I’ll keep search


Hi, can i view the screenshot in the report generated by TestSuites? how?


I can’t understand your question.


Hi Kazurayam,

Do you know why my screenshot of this web page are not responsible. attached my code and screenshot

WebUI.setViewPortSize(375, 667)
WebDriver driver = DriverFactory.getWebDriver()
// take screenshot of entire web page
void takeEntirePage(WebDriver webDriver, File file, Integer timeout = 300) {
Screenshot screenshot = new AShot().
coordsProvider(new WebDriverCoordsProvider()).
ImageIO.write(screenshot.getImage(), “PNG”, file)
String fileName = (GlobalVariable.i)+’.png’
Path pngFile = Paths.get(GlobalVariable.screenPath).resolve(fileName)
takeEntirePage(driver, pngFile.toFile(), 500)


I like it too.



You showed the URL of your AUT, thank you, I can try myself.

This is my code is here.

import static com.kms.katalon.core.testobject.ObjectRepository.findTestObject

import java.nio.file.Files
import java.nio.file.Paths

import com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUI


WebUI.setViewPortSize(375, 667)


//WebUI.click(findTestObject('Object Repository/Page_Find Health Insurance for 2019/div_Cut your Health Insurance'))





I got the following screenshot.

I think, your AUT is responsible enough.

What’s wrong with your code? I do not see. You cut off some lines of your script, for example yo omitted import statements. So I can not reproduce your problem myself. Unless you showed your entire code and let me reproduce your problem on my machine, I can say nothing firmly


Recently I moved from Windows 7 PC to Windows 10 PC, and I got surprised that the screenshots taken by aShot look different. On Windows 7 PC, I could get entire-page image. But on Windows 10 PC, the image looks — how can I describe it — different; zoomed, cropped.


Do you have any insight on this issue?


Just now I learned a bit about Windows 10’s View display settings.

Windows 10’s View display setting introduced “Scale and layout”. My current setting is as follows (I use a 4K display device).


I know very little about auto scaling of view display done by Windows 10, but I guess this feature may affect screenshots taken by application. What do I mean? The PNG file made by aShot on Windows 10 looks scaled out for 200% of the previous one taken on Windows 7.

I tried a case where I will specify 100% 1920x1080pix for Windows 10 View display setting and will take screenshots. I expect the images taken will be the same as the ones on Windows 7.

I tried on Windwos 10, View Display settings=scaling 200%, 3840x2160 and got the following screenshot image, which is bad, different from what I expected

Also I tried Scaling 100%, 1920x1080, I got the following image, which is OK, as I expected.

This experiment revealed a fact that the auto scaling 200% in the view display settings on Windows 10 affects to the screenshot files taken by aShot. Also this experiment showed that changing scaling factor from 200% to 100% (effectively apply no scaling) enable me to workaround the problem.

Visual Testing in Katalon Studio

Thanks, @kazurayam, I’ve spent whole day to struggling with strange aShot screen shots on my Win10 - then I checked your solution and it works! (cuz I was on “125%” in the “Scale and layout” settings)


I tried with your code to take entire image in web page but I got an issue as in belows screenshot:

Could you please take a look into this and give me a solution
Many thanks,


Do you mind a sticky header intruding the full page screenshot ?

The following page suggests some methods to make “sticky header” less annoying.

Once I have ever tried to avoid the sticky header. It was a difficult task; not easy at all. In the end, I gave up the try. I found it is far easier to ignore (not to mind) the intruding headers in the screenshot for the sake of UI testing, than trying to avoid them completely without side-effects in the hope of producing a beautiful image.


hi kazurayam thank for share. i want ask some question

1.i try your demo test in your git repository and i found some problem, i try running some test case from your demo project called TC3_whole_page_screenshot,i try running that test case with mozilla firefox->test case successfully running but when i check the reports folder its still empty.can you help me about this one? thank you


It is a well-known pitfall recently made.

See the release note of v6.1.5.



Can we able to add this entirepage screenshot to our Katalon HTML report? if so, how