The Issue

With the help of automation, we can locate elements on a web page, perform various actions on a particular element of a webpage. There are different kinds of elements on a web page such as images, text, some of them smaller in dimensions while others can be larger and more noticeable. Identifying and automating such elements can pose a significant challenge.

Is there a way to increase or decrease the size of the page to best observe these elements, let’s find out?

The Answer

Selenium offers a very useful feature to Zoom In & Zoom Out of a web page. Each browser has a transform CSS property that helps change the elements to rotate, move, scale, etc. Using this particular CSS property the user can perform zoom in and zoom out operations on the web page.

The Code

The Result

Using the above code does the following

  • Opens “3Qi Labs website”
  • Zooms in the web page by 200%
  • Zooms out the page to normal by 100%

The Takeaway

Performing actions such as Zoom in and Zoom out could be easily done using the CSS Transform property and Selenium. The benefit, in particular, would be to zone in on particular elements of a webpage while running automation scripts can be a huge asset especially as no two webpages will have similar elements in size, images, fonts, etc.,