API Overview
Welcome to the API reference for integrating Applitools Eyes with Playwright. This section provides detailed information on configuring Applitools Eyes within your Playwright tests and utilizing its powerful visual testing capabilities.
Overview
Integrating Applitools Eyes with Playwright involves two main steps:
-
Configuration: Update your
playwright.config.ts
file to include Applitools Eyes settings undereyesConfig
. -
Writing tests: Import
test
from@applitools/eyes-playwright/fixture
and use theeyes
object within your tests to perform visual checkpoints using theeyes.check
method.Note: Additionally, Applitools Eyes supports Playwright's native visual assertion methods. If you import
expect
from@applitools/eyes-playwright/fixture
, your existing tests usingexpect(page).toHaveScreenshot()
will work seamlessly with Applitools Eyes. However, it is recommended to useeyes.check
for more advanced visual testing features.
API sections
The API reference is divided into the following sections:
- Configuration options: A comprehensive list of all available configuration options for Applitools Eyes.
- Using
eyes.check
in tests: Detailed usage of theeyes.check
method, including parameters and examples. - Defining regions with selectors and locators: How to specify different types of regions when calling
eyes.check
.
Basic example
To configure Applitools Eyes in your Playwright project, you need to update your playwright.config.ts
file. The configuration options are set under the eyesConfig
property within the use
section.
// playwright.config.ts
import { defineConfig } from '@playwright/test';
import { EyesFixture } from '@applitools/eyes-playwright/fixture';
export default defineConfig<EyesFixture>({
// Other Playwright configurations...
reporter: '@applitools/eyes-playwright/reporter',
use: {
eyesConfig: {
appName: 'My App',
matchLevel: 'Strict',
// Runner type: 'ufg' for Ultrafast Grid, 'classic' for Classic runner
type: 'ufg',
batch: { name: 'Regression Tests' },
// Additional configuration options...
},
},
});
Note: All configuration options are optional. If an option is not specified, a default value is used. Default behaviors are provided in the option descriptions in the next sections.
Overriding settings in tests
You can override global eyesConfig
settings for individual tests or test suites using test.use()
.
Example:
import { test } from '@applitools/eyes-playwright/fixture';
test.use({
eyesConfig: {
// Override settings for specific tests
matchTimeout: 5000,
ignoreCaret: false,
logConfig: {
level: 'debug',
},
},
});
test('Visual test with overridden settings', async ({ page, eyes }) => {
// Test code...
});