The next article will explain how to adjust your viewport size.
For your convenience, please find the following video guide:
In order to get consistent results in your automated visual tests, it's important to make sure that your browser's size is the same on each test run.
Selenium provides the option to set your window size, which includes the entire browser window, as you can see below:
Applitools eyes provides a method based on Selenium, and adds the ability to resize the window according to the desired viewport size, which consist the actual content frame, as you can see below:
This method considers tool bars, plugins, and other elements that can resize the content frame.
In order to adjust the viewport size, we need to specify it in our test, as mentioned below:
following this line, we need to specify the desired width and height parameters.
How can we get the current viewport size of our browser?
There are 2 different ways to get this information:
1. JavaScript console, by following the next steps:
and writing instant commends:
2. alternatively, we can go into a website that provides the requested information, for example:http://viewportsizes.mattstow.com/mine/
After getting the viewport size information, by either of the methods, we can use it to recompose the "rectangle size" parameter in our test:
After defining the viewport size and running our test, we can see that the new parameters took effect in the new results, instead of the browser's default size parameters.
