Full page scrolling screenshot in mobile devices?

I am new in this tool and I am doing an image compare testing in IOS devices with safari, edge, and chrome browsers and my objective is to take a full page screenshot and compare it to previous release version. I know that there is an add on which takes a screenshot, but it only takes what is visible in the screen.

Can someone please provide or suggest a solution if there are any that does not include taking a screenshot and scroll and taking another screenshot?

Appreciate your help. Thank you

Hi @aws.jonnah.orias and welcome to our community :slight_smile: ,

  1. Which addon did you use that didn’t give you what you wanted?

  2. Let me clarify your question, are you trying to take a page screenshot?

  3. A specific addon for page screenshot for iOS you can find here:
    Test Automation Addons Library | TestProject

  4. Can you please elaborate more on your intention on this question? “Can someone please provide or suggest a solution if there are any that does not include taking a screenshot and scroll and taking another screenshot?”

Hi @alex.ivanov thank you very much for replying. Apologies if I was not clear in my query.

  1. Which addon did you use that didn’t give you what you wanted?

    I used the one you suggested, but as I said, the add-on only takes a screenshot only from the viewport. In long web pages, scrollable elements, for example footer are not included.

  2. Let me clarify your question, are you trying to take a page screenshot?

    Yes. And I am trying to take a screenshot of the whole web page, including footer without (hopefully) scrolling.

  3. Can you please elaborate more on your intention on this question? “Can someone please provide or suggest a solution if there are any that does not include taking a screenshot and scroll and taking another screenshot?”

    Since the Screenshot Utils only takes screenshot of what is visible on the screen (excluding footer for long web pages) I was hoping if someone has the same need as mine and can suggest a workaround or even coded script that can do a whole page screenshot including footer without the scrolling

Thank you again for taking the time to accommodate my question.

Hi @aws.jonnah.orias ,

There is 2 solutions to this scenario, and you can achieve it by following these steps:

  1. First, you will need to do a web test on a mobile device, you can follow this guide to achieve this:
    Running a Web Test on a Mobile Device - TestProject Documentation

  2. Run it as a web test in a mobile device resolution using the dev tools.
    Then you will have access to settings and run the command “capture full-size screenshot” using dev tools.

  3. And then all you have to do is to run this web test in mobile job.

  • Another solution that should work just fine, is to take the HTML page XPath and create a locator with it inside the step that uses the “take page screenshot” addon:

If you don’t know how to create locators or change locators you can use this guide:

  1. First, try to edit the element like in the image below,

image

To check your locators use the magnifying glass
(notice the element must be present on the page when checking a locator):

If another locator is more consistent make it your primary locator, push it to the top with the arrows next to the magnifying glass.

  1. Check for a unique attribute and search the button by that locator,

you can make your custom locator like this for example:
using Xpath //*[@attribute="value"]

For instance, my locator for Amazon looks like this:
using Xpath //*[@id="add-to-cart-button"]

However, you can use TestProject built-in locator generator like this:

by pressing double shift on any element you can freeze it and then extract multiple XPath

I hope it helped you, and if you have more questions regarding this scenario, I’d be happy to help.

1 Like

Great. Thank you very much for your help and for the solution. I really appreciate it.
Cheers.

@aws.jonnah.orias Sure, anytime :slight_smile: