CODEWITHSUNDEEP
javascriptnightwatch.js
anasarbescu
anasarbescu

Reputation: 158

Resized window with Nightwatch is smaller

Situation: We need to run tests in Nightwatch for different screen sizes (desktop, tablets, smartphone layout etc) so we need to resize the browser window to certain dimensions. Let's say, the tablet breakpoint is 1024x768, so we set the window width and height for destop as globals to 1025x768 but when the test is running it fails because the layout is still in tablet mode (and the screenshots show a size of actual content area of 1006x636).

After some research (question1 , question2, question3), it turns out the resizing is setting the whole window size to 1024x768 without taking into account the browser's borders and scrollbars and other such elements, so then the actual content area remains much smaller. It's really different for each browser and OS, plus on Windows and Linux you can basically define your own window styles which would add different sizes again, so we cannot calculate it.

Question: is there any way we can set the window content area to a specific size using Nightwach/javascript?

Upvotes: 0

Views: 1405

Answers (1)

Jonathan Ross
Jonathan Ross

Reputation: 550

According to the Selenium wire protocol, you can only resize a window. But if you compare the desired size with what you actually get, you can resize it a second time to suit. Example:

var target = { width: 600, height: 400 };
browser
    .resizeWindow(target.width, target.height)
    .getElementSize('body', function(result) {
        console.log("My content is ", result.value.width, " by ", result.value.height);
        browser
            .resizeWindow(target.width + (target.width - result.value.width), 
                          target.height + (target.height - result.value.height))
            .getElementSize('body', function(result) {
                console.log("Now my content is ", result.value.width, " by ", result.value.height);
            })
    })

Running this I get:

My content is  584  by  270
Now my content is  600  by  400

Here is another way to do it that runs a Javascript snippet in the browser to determine the window padding (different framework, should also work with NW.)

Upvotes: 3

Related Questions