Configuring browsers for the Ultrafast Grid (UFG)
When it comes to multiple browsers and mobile devices, the Ultrafast grid shines. You can run one functional test, and in the background have multiple screenshots rendered for different browsers, viewport sizes, and mobile devices.
The API methods are:
configuration.addBrowser(browser)
to add a single browser configuration.configuration.addBrowsers(browser1, browser2, ...)
to add single or multiple browser configurations.
Here are examples for how to execute visual tests on different browsers and platforms:
Desktop browsers
const {BrowserType} = require('@applitools/eyes-puppeteer')
// ...
const configuration = eyes.getConfiguration()
configuration.addBrowsers(
{name: BrowserType.EDGE_CHROMIUM, width: 768, height: 1024},
{name: BrowserType.EDGE_LEGACY, width: 768, height: 1024},
{name: BrowserType.FIREFOX, width: 768, height: 1024},
{name: BrowserType.CHROME, width: 768, height: 1024},
{name: BrowserType.IE_11, width: 768, height: 1024},
{name: BrowserType.IE_10, width: 768, height: 1024},
{name: BrowserType.SAFARI, width: 768, height: 1024},
{name: BrowserType.CHROME_ONE_VERSION_BACK, width: 768, height: 1024},
{name: BrowserType.CHROME_TWO_VERSIONS_BACK, width: 768, height: 1024},
// ...
)
eyes.setConfiguration(configuration)
Chrome device emulation
Predefined device:
const {ScreenOrientation, DeviceName} = require('@applitools/eyes-puppeteer')
// ...
const configuration = eyes.getConfiguration()
configuration.addBrowsers(
{
chromeEmulationInfo: {
deviceName: DeviceName.iPhone_6_7_8,
},
},
{
chromeEmulationInfo: {
deviceName: DeviceName.Galaxy_S9_Plus,
screenOrientation: ScreenOrientation.LANDSCAPE,
},
},
)
eyes.setConfiguration(configuration)
Custom device:
const configuration = eyes.getConfiguration()
configuration.addBrowser({
chromeEmulationInfo: {
width: 800,
height: 600,
deviceScaleFactor: 3,
},
})
eyes.setConfiguration(configuration)
iOS device
const {IosDeviceName, ScreenOrientation, IosVersion} = require('@applitools/eyes-puppeteer')
// ...
const configuration = eyes.getConfiguration()
configuration.addBrowser({
iosDeviceInfo: {
deviceName: IosDeviceName.iPhone_11,
screenOrientation: ScreenOrientation.LANDSCAPE, // optional, default: ScreenOrientation.PORTRAIT
iosVersion: IosVersion.LATEST // optional, default: undefined (i.e. the default is determined by the Ultrafast grid)
},
})
eyes.setConfiguration(configuration)
For a list of supported devices, see Devices.
Possible values for iosVersion
are:
IosVersion.LATEST
- the latest iOS version that's supported by the UFGIosVersion.LATEST_ONE_VERSION_BACK'
- one version prior to the latest versionundefined
- the UFG's default