如何在Protractor/WebdriverJS中设置默认浏览器窗口大小

Question

在工作时，我的测试用例会最大化浏览器窗口，但在家里运行测试时，浏览器窗口只有大约50%的宽度。这导致一些滚动等方面存在差异，因此我希望在每台运行测试的机器上都可以打开相同大小的浏览器窗口。有什么最好的方法可以做到这一点？

（我找到了其他语言的一些答案，但我无法将它们适应JavaScript）

添加

browser.executeScript('window.moveTo(0,0);' +
    'window.resizeTo(screen.width, screen.height);');

什么也不做（显然，Google Chrome浏览器不支持window.moveTo和window.resizeTo）。

- jraede

---

我暂时无法回答你的问题，但我可以告诉你 window.moveTo 和 window.scrollTo 在 Chrome 中肯定是被支持的。 - Colin Brock

scrollTo可以工作。但是其他的好像不行，至少我看起来是这样的。试着在控制台中输入它...什么也没发生。 - jraede

好的，似乎可以在使用JS打开的新窗口中工作。但是对于当前窗口不起作用，这正是我所需要的。 - jraede

我也没有答案，但我肯定会质疑你的测试是否依赖于屏幕大小或浏览器是否最大化 - 也许重构你的测试，不要有这种依赖关系是有意义的？ - PaulL

我的测试是为了检查不同响应式配置下的工作和可见性，因此我需要能够控制每个测试的窗口大小。 - jraede

Answer 1

您可以通过运行以下命令来设置默认浏览器大小：

var width = 800;
var height = 600;
browser.driver.manage().window().setSize(width, height);

要最大化浏览器窗口，请运行：

browser.driver.manage().window().maximize();

要设置位置，请运行：

var x = 150;
var y = 100;
browser.driver.manage().window().setPosition(x, y);

如果你收到以下错误信息：

WebDriverError: 未知错误：远程调试不支持该操作

当使用远程调试时不支持某些WebDriver命令（例如调整浏览器窗口大小），这些命令需要将一个Chrome扩展程序加载到浏览器中。ChromeDriver通常会在启动新的Chrome会话时加载此“自动化扩展程序”。

但是，可以通过在Capabilities（又称为ChromeOptions）对象中使用'debuggerAddress'来指示ChromeDriver连接到现有的Chrome会话而不是启动新的Chrome会话。由于自动化扩展程序仅在启动时加载，因此在通过远程调试使用现有会话时，ChromeDriver不支持某些命令。

如果您看到“使用远程调试时不支持该操作”的错误，请尝试重写测试以启动新的Chrome会话。可以通过从Capabilities对象中删除'debuggerAddress'来实现此目的。

来源：当使用远程调试时不支持该操作

- Răzvan Flavius Panda

---

可以使用browser.driver.manage().window().maximize();将浏览器最大化至全屏尺寸。 - Ben Smith

如果你希望所有测试都采用相同的分辨率，你可以在protractor.conf.js文件的onPrepare函数中调用上述代码。 - nwinkler

@BenSmith 不确定为什么，但 browser.driver.manage().window().maximize(); 并没有真正将窗口最大化。我只是得到一个稍微大一点的窗口。最后，我只是用 setSize() 方法指定宽度和高度。 - jetcom

@AlexandrosSpyropoulos：它应该可以工作，但你必须确保你没有在某个愚蠢的分辨率下运行xvfb。例如，默认情况下是640x480。 - Tadas Sasnauskas

@LeeGee 更新了答案。 - Răzvan Flavius Panda

Answer 2

您还可以使用config.js来设置窗口大小：

// config.js
specs: [
    ...
],
capabilities: {
    browserName: 'chrome',
    chromeOptions: {
        args: ['--window-size=800,600'] // THIS!
    }
}
// ....

- e-shfiyut

---

参数：['window-size=800,600']，请删除双破折号“- -”。 - ezain

对我来说，使用答案中显示的双破折号效果符合预期。 - Kyle Pittman

这还可以设置浏览器大小，当使用“-headless”参数运行e2e脚本时。如果菜单被移动到移动视图中，这非常方便。 - tony2tones

Answer 3

如果有首选方法：

browser.driver.manage().window().maximize();

如果某些情况下（例如在Xvfb中运行Protractor测试），窗口最大化的方法不起作用，那么你也可以通过以下方式进行最大化（protractor.conf.js）：

onPrepare: function() {
    setTimeout(function() {
        browser.driver.executeScript(function() {
            return {
                width: window.screen.availWidth,
                height: window.screen.availHeight
            };
        }).then(function(result) {
            browser.driver.manage().window().setSize(result.width, result.height);
        });
    });
},

TypeScript 版本：

import {Config, browser} from "protractor";

export let config: Config = {
    ...
    onPrepare: () => {
        setTimeout(() => {
            browser.driver.executeScript<[number, number]>(() => {
                return [
                    window.screen.availWidth,
                    window.screen.availHeight
                ];
            }).then((result: [number, number]) => {
                browser.driver.manage().window().setSize(result[0], result[1]);
            });
        });
    }
};

- Martin Sznapka

---

最佳的想法是使用自动获取最大分辨率，但你忘记了设置setPosition(0, 0)，所以它会完全覆盖屏幕。 - Andrew

嗯，我的浏览器已经从位置0-0开始了。但如果有人需要的话，这是个好建议。 - Martin Sznapka

我的从...50,50或其他什么位置开始，只是随便说一下 :) - Andrew

可能会依赖于操作系统，这里是在 Hyper-V 中运行的 Windows 8.1。 - Andrew

Answer 4

我只是在我的protractor.conf.js文件中添加了下面的代码，它运行得很好。

onPrepare: function() {
    var width = 1600;
    var height = 1200;
    browser.driver.manage().window().setSize(width, height);
},

setTimeout和executeScript在你的答案中有什么作用？我在protractor文档中难以找到最佳实践...

在我看来，直接使用maximize()是一个坏主意，不应该成为首选方法，因为它不能在执行测试的每台机器上设置相同的大小，并且可能会破坏响应行为。

- Eric Burel

Answer 5

在Selenium 4 (Protractor 6)中，setRect替代了setSize和setPosition。

例如：

browser.driver.manage().window().setRect({height: 600, width: 800});

- Andrew Schlei

Answer 6

在Protractor.conf.js文件中添加以下配置。

capabilities: {
    'browserName': 'chrome',
    chromeOptions: {
      args: [
               'start-maximized'
            ]
    }
}

- Pritam Maske

Answer 7

如果你想使用 async/await

你可以像下面这样全局最大化窗口（一旦浏览器启动）

// protractor.conf.js

exports.config = {

    async onPrepare() {
        // start browser in specified window size
        await browser.driver
            .manage()
            .window()
            .setSize(1920, 1080);
    },
}

- Sergey Pleshakov

Answer 8

根据以下内容修改您的config.js文件。

onPrepare: function () {
    browser.driver.manage().window().setSize(1280, 1024); // Width, height
},
capabilities: {
    browserName: 'chrome',
    chromeOptions: {
        args: [ "--start-maximized" ] // To start the browser as maximixed
    }
},

- Sameera De Silva

Answer 9

添加以下代码。这将最大化浏览器窗口。

browser.driver.manage().window().maximize();

- Brijesh Yadav

---

欢迎来到stackoverflow。已经有回答提供了更详细的信息，请确保您的回答为问题增添新的内容。 - Simon.S.A.