How to set default browser window size in Protractor/WebdriverJS

Question

For some reason when I run my tests at work the browser is maximized, but when I run them at home it only opens a browser window of about 50% width. This causes some discrep

Answer 1

You can also use your config.js to set window size:

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

Answer 2

In Protractor.conf.js file add following configuration

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

Answer 3

In Selenium 4 (Protractor 6), setRect replaces setSize and setPosition

For example,

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

Answer 4

Modify your config.js file as per below.

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

Answer 5

If the preferred method:

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

doesn't work for you (for example running Protractor tests in Xvfb), then you can also maximize window this way (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 version:

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

Answer 6

I simply added the code below in my protractor.conf.js file and it did work fine.

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

What purpose does the setTimeout and executeScript serve in your answer? I struggle to find best practices in the protractor documentation...

To my mind, using directly maximize() is a bad idea and should not be the preferred method, since it would not set the same size on every machine where the tests are executed and could break responsive behaviours.