WebdriverIO - Handling Browser Size

While working on automation tests in WebdriverIO, we may be required to set the size of the window and obtain the size of the window. The window size refers to the window height and width.

browser.setWindowSize(250, 450)

This command is used to set the window size. Here, the window size shall be set to width - 250 and height - 450.

Syntax

The syntax is as follows −

browser.setWindowSize(250, 450)

browser.getWindowSize()

This command is used to get the window dimension.

Syntax

The syntax is as follows −

browser.getWindowSize()

To begin, follow Steps 1 to 5 from the Chapter titled Happy path flow with WebdriverIO which are as follows −

Step 1 − Install NodeJS. The details on how to perform this installation are given in detail in the Chapter titled Getting Started with NodeJS.

Step 2 − Install NPM. The details on how to perform this installation are given in detail in the Chapter titled Installation of NPM.

Step 3 − Install VS Code. The details on how to perform this installation are given in detail in the Chapter titled VS Code Installation.

Step 4 − Create the Configuration file. The details on how to perform this installation are given in detail in the Chapter titled Configuration File generation.

Step 5 − Create a spec file. The details on how to perform this installation are given in the Chapter titled Mocha Installation.

Step 6 − Add the below code within the Mocha spec file created.

// test suite name
describe('Tutorialspoint application', function(){
   //test case
   it('Dimension', function(){    
      // launch url
      browser.url('https://www.tutorialspoint.com/index.htm')
      //set window size
      browser.setWindowSize(500, 450)
      //get window size
      console.log(browser.getWindowSize())
   });
});

Run the Configuration file - wdio.conf.js file with the following command −

npx wdio run wdio.conf.js

The details on how to create a Configuration file are discussed in detail in the Chapter titled Wdio.conf.js file and Chapter titled Configuration File generation.

The following screen will appear on your computer −

Handling Browser Size

After the command has been executed successfully, the dimension of the browser window- {width: 500, height: 450} is printed in the console.

Advertisements