Selenium WebDriver 放大/缩小页面内容

Posted 2023-02-21

技术标签:

【中文标题】Selenium WebDriver 放大/缩小页面内容【英文标题】：Selenium WebDriver zoom in/out page content 【发布时间】：2013-02-08 02:31:03 【问题描述】：

如何在 Selenium WebDriver 中更改页面缩放级别？我试过了：

driver.Keyboard().pressKey(Keys.Control);
driver.Keyboard().pressKey(Keys.Add);

但它不起作用。

【问题讨论】：

只是出于好奇：你在这里测试什么？拦截这些控件的 javascript 应用程序？ 【参考方案1】：

请注意，Selenium 假定缩放级别为 100%！例如，当缩放级别不同时，IE 将拒绝启动（抛出异常），因为定位的元素取决于此，如果您更改缩放级别，它会在错误的位置点击错误的元素。

Java

您可以使用Keys.chord() 方法：

WebElement html = driver.findElement(By.tagName("html"));
html.sendKeys(Keys.chord(Keys.CONTROL, Keys.ADD));

谨慎使用，完成后将缩放重置为 100%：

html.sendKeys(Keys.chord(Keys.CONTROL, "0"));

C#

（因为我意识到 C# 绑定没有Keys.chord() 方法）

或者，您可以像这样使用Advanced User Interactions API（同样，Java 代码，但它在 C# 中的工作方式应该相同）：

WebElement html = driver.findElement(By.tagName("html"));

new Actions(driver)
    .sendKeys(html, Keys.CONTROL, Keys.ADD, Keys.NULL)
    .perform();

再次提醒，事后不要忘记重置缩放：

new Actions(driver)
    .sendKeys(html, Keys.CONTROL, "0", Keys.NULL)
    .perform();

请注意，天真的方法

html.sendKeys(Keys.CONTROL, Keys.ADD);

不起作用，因为在此sendKeys() 方法中释放了 Ctrl 键。 WebElement's sendKeys() 与 the one in Actions 不同。因此，我的解决方案中使用的Keys.NULL 是必需的。

【讨论】：

我收到您的 C# 解决方案的错误，即 SendKeys 没有使用 IElement 和三个字符串的方法。 @Sunnyday 是的，这个答案已经 6 岁了，也许事情已经改变了。尝试使用 <body> 元素？老实说，我不知道这种方法是否会起作用。它当时有效。感谢您的回复。这应该在驱动程序选项中，但我找不到。我还是不明白为什么缩放级别会影响 webdriver 查找元素的方式。 @Sunnyday 至少在 2013 年，这是因为缩放是特定于浏览器的，没有任何公共 API 可以控制它。最重要的是，IE 通常根本没有好的 API，所以一切都基于 JS 动作。当 JS 告诉你一个元素在位置 XY 处，但由于应用了缩放，实际位置不同，那就是你遇到麻烦的时候了。不过，我不知道 Selenium 3 或 4 是否解决了这个问题。也不是现代浏览器是否正确报告缩放元素的位置。【参考方案2】：

使用 Java 可以通过以下两种方式更改缩放级别（一种适用于 Chrome，另一种适用于 Firefox）：

铬

当使用 Selenium Java 客户端驱动程序的 v̲e̲r̲s̲i̲o̲n̲ ̲3̲.̲3̲.̲1 和 C̲h̲r̲o̲m̲e̲D̲r̲i̲v̲e̲r̲ ̲2̲.̲2̲8 时，以下工作（其中单引号中的数字表示要使用的缩放级别；1 = 100%、1.5 = 150% 等）：

JavascriptExecutor executor = (JavascriptExecutor)driver;
executor.executeScript("document.body.style.zoom = '1.5'");

火狐

可以通过以下方式修改缩放级别： 1.前述Java客户端驱动 2.G̲e̲c̲k̲o̲D̲r̲i̲v̲e̲r̲ ̲v̲0̲.̲1̲5̲.̲0 3. 这些类：java.awt.Robotjava.awt.event.KeyEvent

首先，实例化Robot类：

Robot robot = new Robot();

此代码导致缩放级别降低：

robot.keyPress(KeyEvent.VK_CONTROL);
robot.keyPress(KeyEvent.VK_MINUS);
robot.keyRelease(KeyEvent.VK_CONTROL);
robot.keyRelease(KeyEvent.VK_MINUS);

此代码导致缩放级别增加：

robot.keyPress(KeyEvent.VK_CONTROL);
robot.keyPress(KeyEvent.VK_EQUALS);
robot.keyRelease(KeyEvent.VK_CONTROL);
robot.keyRelease(KeyEvent.VK_EQUALS);

【讨论】：

这对我有用 Selenium v3.3.1 和 ChromeDriver【参考方案3】：

Python 方法适用于我，但您必须指定缩放级别：

driver.execute_script("document.body.style.zoom='zoom %'")

拥有 'zoom%' = 你想要的任何缩放级别。（例如“67%”）。这适用于 Chromedriver，它似乎不接受 send_keys 命令。

【讨论】：

看起来这个 javascript sn-p 也适用于 Safari，我假设 PhantomJS 和任何基于 Webkit 的浏览器。它似乎不适用于 Firefox（在 v47 上测试）。根据this 这使它放大CSS，而不是Chrome本身。我在Firefox中尝试过，但没有工作寻找一种使用 Python 缩小 Firefox 窗口的方法。有什么帮助吗？你有this question中使用的方法吗？ Selenium 的 action chains 在 Firefox 中为我工作，但在 Chrome 中没有。我大约一年前测试过这个，所以它可能已经改变了。嗨@Ben，很抱歉回复了一条非常旧的消息。我尝试使用 javascript 方法缩小，但缩小后元素不可交互。我无法单击元素。我在 javascript 步骤之后和运行任何其他操作之前尝试了延迟。有什么我想念的吗？【参考方案4】：

放大 | 缩小Windows上的功能

放大

WebElement html = driver.findElement(By.tagName("html"));
html.sendKeys(Keys.chord(Keys.CONTROL, Keys.ADD));

缩小

html.sendKeys(Keys.chord(Keys.CONTROL, Keys.SUBTRACT));

放大 | 缩小MAC上的功能

放大

WebElement html = driver.findElement(By.tagName("html"));
html.sendKeys(Keys.chord(Keys.COMMAND, Keys.ADD));

缩小

html.sendKeys(Keys.chord(Keys.COMMAND, Keys.SUBTRACT));

【讨论】：

为此要导入什么库？我在 Eclipse 中没有看到任何有用的建议。我已经导入了 org.openqa.selenium.By;和 org.openqa.selenium.WebElement；但我需要适当的“钥匙”库从 selenium.webdriver.common.keys 导入密钥【参考方案5】：

最稳健的方法

在开始使用 Internet Explorer 和 Selenium Webdriver 之前，请考虑这两个重要规则。

缩放级别：应设置为默认值 (100%) 和安全区域设置：所有设置都应该相同。应根据您的组织权限设置安全设置。

如何设置？

只需转到 Internet Explorer，手动完成这两项工作。而已。没有秘密。

通过您的代码来实现。

方法一：

//Move the following line into code format
DesiredCapabilities capabilities = DesiredCapabilities.internetExplorer();

capabilities.setCapability(InternetExplorerDriver.IGNORE_ZOOM_SETTING, true);

System.setProperty("webdriver.ie.driver","D:\\IEDriverServer_Win32_2.33.0\\IEDriverServer.exe");

WebDriver driver= new InternetExplorerDriver(capabilities);

driver.get(baseURl);

//Identify your elements and go ahead testing...

这绝对不会显示任何错误，浏览器将打开并导航到 URL。

但是这不会识别任何元素，因此您无法继续。

为什么？因为我们只是简单地抑制了错误并要求 IE 打开并获取该 URL。然而，只有当浏览器缩放为 100% 时，Selenium 才会识别元素。默认。所以最终的代码是

方法二稳健且全面的证明方式：

DesiredCapabilities capabilities = DesiredCapabilities.internetExplorer();

capabilities.setCapability(InternetExplorerDriver.IGNORE_ZOOM_SETTING, true);

System.setProperty("webdriver.ie.driver","D:\\IEDriverServer_Win32_2.33.0\\IEDriverServer.exe");

WebDriver driver= new InternetExplorerDriver(capabilities);

driver.get(baseURl);

driver.findElement(By.tagName("html")).sendKeys(Keys.chord(Keys.CONTROL,"0"));
//This is to set the zoom to default value
//Identify your elements and go ahead testing...

希望这会有所帮助。如果需要更多信息，请告诉我。

【讨论】：

【参考方案6】：

对于放大到 30%（或您希望的任何其他值，但在我的情况下为 30%）使用

JavascriptExecutor jse = (JavascriptExecutor)driver;
jse.executeScript("document.body.style.zoom = '30%';");

【讨论】：

【参考方案7】：

我正在使用 Python 3.5。我遇到了和你一样的问题。我认为您必须使用 Chrome 作为浏览器。

我用 PhantomJs 终于解决了这个问题：

from selenium.webdriver.common.keys import Keys
from selenium import webdriver
browser = webdriver.PhantomJS()
browser.get('http://www.*.com')
print(browser.title)
c=browser.find_element_by_tag_name("body")
c.send_keys(Keys.LEFT_CONTROL+Keys.Add)`

【讨论】：

【参考方案8】：

似乎为 C# 提出的方法不再适用了。

在 WebDriver 2.5 版中适用于我的 C# 方法是：

        public void ZoomIn()
        
             new Actions(Driver)
                .SendKeys(Keys.Control).SendKeys(Keys.Add)
                .Perform();
        

        public void ZoomOut()
        
            new Actions(Driver)
               .SendKeys(Keys.Control).SendKeys(Keys.Subtract)
               .Perform();

【讨论】：

我知道是对的。但猜猜怎么了。我想到了。 .SendKeys(Keys.Control + Keys.Subtract).Perform();【参考方案9】：

我知道这已经晚了，但如果你不想使用动作类（或者像我一样遇到任何错误），你可以使用纯 JavaScript 来这样做。

这里是代码

((IJavaScriptExecutor) Browser.Driver).ExecuteScript("document.body.style.zoom = '70%';");

【讨论】：

【参考方案10】：

使用机器人类对我有用：

for(int i=0; i<3; i++)
        Robot robot = new Robot();
        robot.keyPress(KeyEvent.VK_CONTROL);
        robot.keyPress(KeyEvent.VK_MINUS);
        robot.keyRelease(KeyEvent.VK_CONTROL);
        robot.keyRelease(KeyEvent.VK_MINUS);

这将缩小 3 倍。

【讨论】：

【参考方案11】：

2017 年 11 月 17 日更新

var html = page.FindElement(By.XPath("/html"));
html.SendKeys(Keys.Control + "0" + Keys.Control);

【讨论】：

【参考方案12】：

您可以使用“Keys.chord”方法进行缩小和放大

缩小

       WebElement zoomPage = driver.findElement(By.tagName("html"));
       zoomPage.sendKeys(Keys.chord(Keys.CONTROL, Keys.ADD))

当您完成工作并想要将浏览器重置为 100% 时，请使用以下代码如果你想点击任何元素，那么在点击事件之前你可以在点击它之后将你的浏览器窗口重置为 100%。

 zoomPage.sendKeys(Keys.chord(Keys.CONTROL, "0"));

您也可以使用 Java 脚本代码进行 Zoom OUT

 JavascriptExecutor executor = (JavascriptExecutor)driver;
 executor.executeScript("document.body.style.zoom = '110%'");

【讨论】：

为此要导入什么库？我在 Eclipse 中没有看到任何有用的建议。我已经导入了 org.openqa.selenium.By；和 org.openqa.selenium.WebElement；但我需要适当的“钥匙”库【参考方案13】：

您可以找到here Selenium with Firefox 的解决方案。 100% 有效。

【讨论】：

【参考方案14】：

您可以使用 Selenium 的驱动程序来执行为您放大或缩小的脚本。

火狐

await driver.executeScript('document.body.style.MozTransform = "scale(3)"');
await driver.executeScript(
  'document.body.style.MozTransformOrigin = "top"'
);

这将导致放大 300% 并滚动到顶部。

铬

await driver.executeScript('document.body.style.zoom = "300%"');

【讨论】：

以上是关于Selenium WebDriver 放大/缩小页面内容的主要内容，如果未能解决你的问题，请参考以下文章

如何使用Selenium WebDriver打开新标签页并启动链接？

使用selenium webdriver+beautifulsoup+跳转frame，实现模拟点击网页下一页按钮，抓取网页数据

Js实现放大缩小html页面整体

Python+Selenium.webdriver实现WEB端UI自动化测试

Js实现放大缩小html页面整体