Web Screen Shots with Power Automate

[John_MCC]

I'm trying to take a screen shot of a UI element that is on a web page to paste into a word document, so just part of a web page. I have changed the zoom of the web browser to 70 to ensure the DIV item is within the screen. I can see the page zoom out to 70 but every time the Power Desktop Automation runs the snapshot command it resets to 100% and I just get a black box pasted I'm guessing because the item I want to take the screenshot of is no longer on scree. How do I stop it returning to 100% zoom?

[Anonymous]

Hello @John_MCC 

Sorry, I don't know how to set the zoom level when taking screenshot of web page or web UI element.

I suppose it is related to browser extension "Microsoft Power Automate" maybe...

I myself could take screenshot of UI element, even if it is completely out of browser screen, such like icon at the most bottom of the web page content (it looks like PAD is scrolling down to the location of that UI element).

Did you try to use action "Wait for web page content" and specify the UI element which you want to take screenshot? I think it's possible that it's too early to take a screenshot.

Thank you.

[VJR]

Hi @John_MCC 

I tried out the Take screenshot action and intentionally added the UI element that is at the very deep bottom of the webpage.

Even if the element was not visible it accurately took the screenshot.

That is the point of the UI element via selectors. Just like the way if we add an UI element of a text box, PAD correctly goes and add a values to that textbox no matter where it is on the screen.

The same way if we select the correct selectors of the UI element it goes to that element and captures its screenshot.

So make sure your selectors are correctly pointing to that element. You would not need to set the zoom level.

[John_MCC]

I have tried a couple of ways to define the item, I've tried just recording and I've tried via the UI Element. As you can see in the UI Element it highlights the DIV that I want.

I'm using this command to capture the element:

If it doesn't appear in the screen either because it's off the top like this which is a copy of the capture where the DIV6 I want is higher on the page.

However if it is off the page I just get this:

[VJR]

Hi @John_MCC 

The highlighting doesn't give an accurate picture.

Almost all of the times it shows the correct highlighting but when it comes to accessing the element via the PAD code, then it doesn't access it.

I would suggest you to do one thing.

- Capture the UI element that says "Food Safety/Incidents". Then via PAD read the value and check whether it correctly shows the wordings "Food Safety/Incidents" in a Display Message box.

When the above test is successful

- Capture a screenshot of the same above UI element that says "Food Safety/Incidents" and check whether you get an Image file with the wordings written as "Food Safety/Incidents"

Once these test are working fine you will get to know that there is no need to scroll to the bottom of the webpage. 

[John_MCC]

I don't seem to be able to capture that element unless it is in view on the screen , exactly the same way as the screen shot. I have tried finding the Div with a focus area as well as the text but nothing. Have also tried to code scrolling the page to get it on screen but no such luck.

[VJR]

Hi @John_MCC 

At first I would still suggest you to go by the UI element approach.

But if that's not working for you then....

For changing the zoom of your browser window, Control minus is the key combination.

You can do that manually on the browser window and check.

So, do the same using Sendkeys 

That is {Control}({Subtract}).

If the zoom percent starts from 100%, then you need to do it three times to bring to around 70%.

For me on Chrome browser doing it 3 times got the window to 75%.

At first manually check how many times it has to be done to get the desired screen. It could be slightly different percentage if you are using Edge.

Make sure to focus on the browser window before the SendKeys

For that, capture the outside border of the browser window as an UI element and pass it to the Focus window.

Make sure to add appropriate Wait actions wherever things are happening fast.

Tip: Pressing Control zero resets the browser zoom to 100%.

So its a good idea to always reset it and then press control minus so that you will always get the correct percentage.

{Control}({NumPad0})
{Control}({Subtract})
{Control}({Subtract})
{Control}({Subtract})

Running the above flow changed the zoom level as follows.

[John_MCC]

So I've been trying to work on this a bit more. I zoom out the web page to bring the UI element into the screen that I want to take the screen shot into and that's fine. However anytime PAD takes a screenshot it reverts to 100% and so cuts off the image.

I have tried using the focus UI and text field options and it highlights the item I want to screenshot but doesn't move it into the center of the screen

I have tried to move the UI element into the screen area by scrolling the page using both a left mouse click to slide the slider on the right hand side - no luck and using Java script as suggested on the help pages but the screen doesn't move. Does it matter that only a section of the screen scrolls??

Keen for ideas as this one has me 100% baffled and frustrated!

[VJR]

Hi @John_MCC 

Are you looking to scroll the web page?

Using the same code in my post just above, I was able to scroll three times downwards by using the below combination inside the SendKeys

{Down}
{Down}
{Down}

Similarly I was also able to do a Page Down by using the below.
{Next}

Check out the different keys available.

Make sure to Focus on the window just like the way I have used one post above.

[sodamAtOsse]

hi @John_MCC @VJR 

is there any solution for this problem yet? 

in 2024, it's still wrong.

i did all way in these question and answers.

But PAD still get back top of the view, and make zoom 100%.  (the screenshot still has black area.)