Hi Community, I have a script where I set the view port size to 390, 844 (mobile view size) and then take screenshots of some pages, but the screenshot of one of the pages is not being taken like it looks in that size (responsive) even though I see that the objects order are in column while the scr…

Hard to understand. Please share here your script and the images taken.

Hi @kazurayam , Sorry if I wasn’t clear, actually, the issue is difficult to explain. The site is responsive, so when setting serViewPortSize to (390, 844) to display the website in mobile size, the objects order change to be displayed in one column, and I can see them in the browser when the scri…

You showed a source code which contains 2 for blocks. The 2 blocks look very similar. I wonder why you have these 2 for blocks. To me it looks as if you pasted a set lines twice, which looks silly to me. You can remove this duplication by introducing a local Groovy function. The first for block co…

I guess, Device Pixel Ratio may be confusing you. See the following post: [image] TakeFullPage screenshot using incorrect width and height (was working properly before!) Katalon TestOps You specified 1440 pixel as window width, but the screenshot image has a width of 357…

Hi @kazurayam , Thanks for helping on this. I’m using two “for” blocks while I make it work, then I will improve the code. In the first block I’m not setting any view port size because I want it to be displayed with the default with, so it’s intended. In the second block, I’m changing the width to…

Still I don’t understand what is your problem. What do you expect to see, and what do you actually see?

Hi @kazurayam , The website is responsive, so while the width is decreasing, the elements of the page that are aligned in up to 3 columns in desktop view, change their align to 1 column when they hit the mobile view. The screenshot when changing the size to “WebUI.setViewPortSize(390, 844)” (mobile…

Hi Kazurayam, No problem, thanks for your help. I’m attaching two new screenshots from a public website. The first screenshot is for desktop view and the second for mobile view, you can see how the elements of the page are aligned different. The same happens with my website, I can see it while the…

Take full page screenshot not working as expected in mobile view

Miscellaneous

kazurayam August 22, 2023, 6:22pm 5

I guess, Device Pixel Ratio may be confusing you.

See the following post:

Topic		Replies	Views
Set view port size and screenshot for visual testing Web Testing web-testing	5	692	January 16, 2024
viewport size Miscellaneous katalon-studio , bugs-report	0	678	July 20, 2018
TakeFullPage screenshot using incorrect width and height (was working properly before!) Web Testing katalon-testops , web-testing , visual-testing	89	4351	July 6, 2023
Taking entire page screenshots to measure the image-diff using AShot Tips and Tricks katalon-studio , tips-tricks	32	14023	November 24, 2021
[WebUI] Take Screenshot Miscellaneous new-doc-request	26	6948	May 25, 2022

Take full page screenshot not working as expected in mobile view

Related topics