Skip to main content

Methods

The following methods are added to the global WebdriverIO browser-object.

Save Methods

TIP

Only use the Save Methods when you don't want to compare screens, but only want to have an element-/screenshot.

saveElement

Saves an image of an element.

Usage

await browser.saveElement(
// element
await $('#element-selector'),
// tag
'your-reference',
// saveElementOptions
{
// ...
}
);

Support

  • Desktop Browsers
  • Mobile Browsers
  • Mobile Hybrid Apps
  • Mobile Native Apps

Parameters

  • element:
    • Mandatory: Yes
    • Type: WebdriverIO Element
  • tag:
    • Mandatory: Yes
    • Type: string
  • saveElementOptions:
    • Mandatory: No
    • Type: an object of options, see Save Options

Output:

See the Test Output page.

saveScreen

Saves an image of a viewport.

Usage

await browser.saveScreen(
// tag
'your-reference',
// saveScreenOptions
{
// ...
}
);

Support

  • Desktop Browsers
  • Mobile Browsers
  • Mobile Hybrid Apps
  • Mobile Native Apps

Parameters

  • tag:
    • Mandatory: Yes
    • Type: string
  • saveScreenOptions:
    • Mandatory: No
    • Type: an object of options, see Save Options

Output:

See the Test Output page.

saveFullPageScreen

Usage

Saves an image of the complete screen.

await browser.saveFullPageScreen(
// tag
'your-reference',
// saveFullPageScreenOptions
{
// ...
}
);

Support

  • Desktop Browsers
  • Mobile Browsers

Parameters

  • tag:
    • Mandatory: Yes
    • Type: string
  • saveFullPageScreenOptions:
    • Mandatory: No
    • Type: an object of options, see Save Options

Output:

See the Test Output page.

saveTabbablePage

Saves an image of the complete screen with the tabbable lines and dots.

Usage

await browser.saveTabbablePage(
// tag
'your-reference',
// saveTabbableOptions
{
// ...
}
);

Support

  • Desktop Browsers

Parameters

  • tag:
    • Mandatory: Yes
    • Type: string
  • saveTabbableOptions:
    • Mandatory: No
    • Type: an object of options, see Save Options

Output:

See the Test Output page.

Check Methods

TIP

When the check-methods are used for the first time you will see the below warning in the logs. This means you don't need to combine the save- and check-methods if you want to create your baseline.

#####################################################################################
Baseline image not found, save the actual image manually to the baseline.
The image can be found here:
/Users/wswebcreation/project/.tmp/actual/desktop_chrome/examplePage-chrome-latest-1366x768.png
If you want the module to auto save a non existing image to the baseline you
can provide 'autoSaveBaseline: true' to the options.
#####################################################################################

checkElement

Compare an image of an element against a baseline image.

Usage

await browser.checkElement(
// element
'#element-selector',
// tag
'your-reference',
// checkElementOptions
{
// ...
}
);

Support

  • Desktop Browsers
  • Mobile Browsers
  • Mobile Hybrid Apps
  • Mobile Native Apps

Parameters

  • element:
    • Mandatory: Yes
    • Type: WebdriverIO Element
  • tag:
    • Mandatory: Yes
    • Type: string
  • checkElementOptions:

Output:

See the Test Output page.

checkScreen

Compares an image of a viewport against a baseline image.

Usage

await browser.checkScreen(
// tag
'your-reference',
// checkScreenOptions
{
// ...
}
);

Support

  • Desktop Browsers
  • Mobile Browsers
  • Mobile Hybrid Apps
  • Mobile Native Apps

Parameters

  • tag:
    • Mandatory: Yes
    • Type: string
  • checkScreenOptions:

Output:

See the Test Output page.

checkFullPageScreen

Compares an image of the complete screen against a baseline image.

Usage

await browser.checkFullPageScreen(
// tag
'your-reference',
// checkFullPageOptions
{
// ...
}
);

Support

  • Desktop Browsers
  • Mobile Browsers

Parameters

  • tag:
    • Mandatory: Yes
    • Type: string
  • checkFullPageOptions:

Output:

See the Test Output page.

checkTabbablePage

Compares an image of the complete screen with the tabbable lines and dots against a baseline image.

Usage

await browser.checkTabbablePage(
// tag
'your-reference',
// checkTabbableOptions
{
// ...
}
);

Support

  • Desktop Browsers

Parameters

  • tag:
    • Mandatory: Yes
    • Type: string
  • checkTabbableOptions:

Output:

See the Test Output page.

Welcome! How can I help?

WebdriverIO AI Copilot