How to set browser viewport size

Question

I'm trying to create a cross-browser Python-Selenium test script. So I need all results to be same no matter which webdriver (Chrome or IE) I use. I can set browser window size as follow:

driver.set_window_size(1920, 1080)

But following code will return different values for Chrome and IE:

element = driver.find_element_by_xpath('some_xpath')
element.location

as viewport area (where web-content displayed) sizes are different (Chrome- 1910x998, IE- 1904x965) despite of same window size. To get these values I used

driver.execute_script('return document.documentElement.clientHeight')
driver.execute_script('return document.documentElement.clientWidth')

so I tried

driver.execute_script('document.documentElement.clientHeight = "990px";')
driver.execute_script('document.documentElement.clientWeight = "1900px";')

but with no luck

So the question is how to set browser viewport size in selenium?

have you tried this? http://stackoverflow.com/questions/15397483/how-do-i-set-browser-width-and-height-in-selenium-webdriver it's a java example but there is a python equivalent code — Rafael Almeida, May 12 '16 at 08:38
@RafaelAlmeida, thanks for a suggestion, but it seem to be a different issue — Andersson, May 12 '16 at 09:02

score 23 · Accepted Answer · answered May 12 '16 at 09:49

23

Here is function to set the viewport size:

def set_viewport_size(driver, width, height):
    window_size = driver.execute_script("""
        return [window.outerWidth - window.innerWidth + arguments[0],
          window.outerHeight - window.innerHeight + arguments[1]];
        """, width, height)
    driver.set_window_size(*window_size)

Usage :

from selenium import webdriver

driver = webdriver.Chrome()

# set the viewport size to 800 x 600
set_viewport_size(driver, 800, 600)

# display the viewport size
print driver.execute_script("return [window.innerWidth, window.innerHeight];")

answered May 12 '16 at 09:49

Florent B.

41,537
7
86
101

1

this will also include size of horizontal and vertical page scroll bars (about 17px each), but its ok :) thanks – Andersson May 12 '16 at 13:29
5

To get the viewport size without the scrollbars size, use `document.body.clientWidth` and `document.body.clientHeight` instead of `window.innerWidth` and `window.innerHeight` respectively. – kanaka Feb 18 '18 at 01:03

score 2 · Answer 2 · answered Jun 14 '19 at 09:14

Here's the Java version for @Florent B. answer :

        int width = "500";
        int height = "500";

        //Remove the window from fullscreen (optional), if it s in fullscreen the outerHeight is not accurate
        browser.manage().window().setSize(new Dimension(800,800));

        JavascriptExecutor js= (JavascriptExecutor)browser;

        String windowSize = js.executeScript("return (window.outerWidth - window.innerWidth + "+width+") + ',' + (window.outerHeight - window.innerHeight + "+height+"); ").toString();

        //Get the values
        width = Integer.parseInt(windowSize.split(",")[0]);
        height = Integer.parseInt(windowSize.split(",")[1]);

        //Set the window
        browser.manage().window().setSize(new Dimension(width, height));

score 1 · Answer 3 · answered Apr 12 '21 at 06:10

Here is the C# Version for @Florent B. answer:

   public static void SetViewportSize(RemoteWebDriver driver, int width, int height)
{            
    var jsGetPadding = @"return [ window.outerWidth - window.innerWidth,window.outerHeight - window.innerHeight ];";
    var paddingArray = driver.ExecuteScript(jsGetPadding) as ReadOnlyCollection<object>; 
    driver.Manage().Window.Size = new Size(width + int.Parse(paddingArray[0].ToString()), height + int.Parse(paddingArray[1].ToString()));

}

Usage:

  RemoteWebDriver driver = new EdgeDriver();
  SetViewportSize(driver,800, 800);

score -2 · Answer 4 · answered May 12 '16 at 09:35

-2

I'm using this:

driver.manage().window().setSize(new org.openqa.selenium.Dimension(1900, 990));

Where 1900 is the width, and 990 is the height.

answered May 12 '16 at 09:35

Ranjith's

4,508
5
24
40

1

From the docs: "[...] This will change the outer window dimension, not just the view port [...]" – crusy Jul 24 '17 at 06:35

How to set browser viewport size

4 Answers4

Linked