如何设置浏览器视口大小答案

【问题标题】：How to set browser viewport size如何设置浏览器视口大小
【发布时间】：2016-09-07 23:06:03
【问题描述】：

我正在尝试创建一个跨浏览器 Python-Selenium 测试脚本。所以无论我使用哪个webdriver（Chrome 或IE），我都需要所有结果都相同。我可以设置浏览器窗口大小如下：

driver.set_window_size(1920, 1080)

但以下代码将为Chrome 和IE 返回不同的值：

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

尽管窗口大小相同，但视口区域（显示 Web 内容的地方）大小不同（Chrome- 1910x998、IE- 1904x965）。为了获得这些值，我使用了

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

所以我尝试了

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

但没有运气

那么问题是如何在selenium 中设置浏览器视口大小？

【问题讨论】：

你试过了吗？ stackoverflow.com/questions/15397483/…这是一个java示例，但是有一个python等效代码
@Pete，你是什么意思？？？我已经成功了:)
@RafaelAlmeida，感谢您的建议，但这似乎是一个不同的问题

标签： javascript python selenium browser selenium-webdriver

【解决方案1】：

这里是设置视口大小的函数：

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)

用法：

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];")

【讨论】：

这还将包括水平和垂直页面滚动条的大小（每个大约 17px），但没关系 :) 谢谢
要获得不带滚动条大小的视口大小，请分别使用document.body.clientWidth 和document.body.clientHeight 而不是window.innerWidth 和window.innerHeight。

【解决方案2】：

这是 @Florent B 的 Java 版本。答案：

        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));

【讨论】：

【解决方案3】：

这是@Florent B 的C# 版本。答案：

   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()));

}

用法：

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

【讨论】：

【解决方案4】：

我正在使用这个：

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

其中 1900 是宽度，990 是高度。

【讨论】：

来自文档：“[...] 这将改变外部窗口尺寸，而不仅仅是视口 [...]”