Resize Window

There are two ways of resizing a browser window.

Note: these actions require a ICCCM/EWMH-compliant window manager on Linux.

Setting the Window Size

t.resizeWindow( width, height )
Parameter Type Description
width Number The new width, in pixels.
height Number The new height, in pixels.

The following example demonstrates how to use the t.resizeWindow action.

import { Selector } from 'testcafe';

const menu = Selector('#side-menu');

fixture `My fixture`
    .page `http://www.example.com/`;

test('Side menu disappears on small screens', async t => {
    await t
        .resizeWindow(200, 100)
        .expect(menu.getStyleProperty('display')).eql('none');
});

Fitting the Window into a Particular Device

t.resizeWindowToFitDevice( deviceName [, options] )

Resizes the window so that it fits on the screen of the specified mobile device.

Parameter Type Description
deviceName String The name of the device as listed at http://viewportsizes.com/.
options (optional) Object Provide additional information about the device.

The options object can contain the following properties.

Property Type Description
portraitOrientation Boolean true for portrait screen orientation; false for landscape.

The example below shows how to use the t.resizeWindowToFitDevice action.

import { Selector } from 'testcafe';

const header = Selector('#header');

fixture `My fixture`
    .page `http://www.example.com/`;

test('Header is displayed on Xperia Z in portrait', async t => {
    await t
        .resizeWindowToFitDevice('Sony Xperia Z', {
            portraitOrientation: true
        })
        .expect(header.getStyleProperty('display')).notEql('none');
});

Maximizing the Window

t.maximizeWindow( )

Maximizes the browser window.

The following example shows how to use this action.

import { Selector } from 'testcafe';

const menu = Selector('#side-menu');

fixture `My fixture`
    .page `http://www.example.com/`;

test('Side menu is displayed in full screen', async t => {
    await t
        .maximizeWindow()
        .expect(menu.visible).ok();
});