Skip to content

Commit b758d76

Browse files
author
Logan Graham
committed
minor updates, add visual examples link
1 parent beebf45 commit b758d76

File tree

1 file changed

+11
-5
lines changed

1 file changed

+11
-5
lines changed

docs/visual-testing/integrations/playwright.md

+11-5
Original file line numberDiff line numberDiff line change
@@ -104,9 +104,11 @@ import { test, expect } from '@playwright/test'
104104
with
105105

106106
```js
107-
import { test, expect } from './custom-test'
107+
import { test, expect } from '../custom-test'
108108
```
109109

110+
(or the location of the custom test file relative to the current directory)
111+
110112
### Step 4 - Use Sauce Visual in Your Tests
111113

112114
If you've set up a fixture during Step 3, use the 'Fixture' example, otherwise, you can still access Sauce Visual using our exported function with the 'Standard' example.
@@ -119,8 +121,8 @@ import { test, expect } from '../custom-test';
119121
// Add the `sauceVisual` fixture into each test you want to capture a snapshot in
120122
// -------------------------------- here ▼ --------------------------------------
121123
test('has title', async ({ page, sauceVisual }) => {
122-
await page.goto('https://playwright.dev/');
123-
await expect(page).toHaveTitle(/Playwright/);
124+
await page.goto('https://docs.saucelabs.com/visual-testing/');
125+
await expect(page).toHaveTitle(/Sauce Visual/);
124126

125127
// Call `visualCheck` using the fixture and optionally apply any additional
126128
// options as the second argument.
@@ -136,8 +138,8 @@ import { sauceVisualCheck } from '@saucelabs/visual-playwright';
136138

137139
// Expose the `testInfo` argument here ▼ -------
138140
test('has title', async ({ page }, testInfo) => {
139-
await page.goto('https://docs.saucelabs.com/visual-testing/integrations/playwright/');
140-
await expect(page).toHaveTitle(/Playwright/);
141+
await page.goto('https://docs.saucelabs.com/visual-testing/');
142+
await expect(page).toHaveTitle(/Sauce Visual/);
141143

142144
// Pass the current page object and test info into the `sauceVisualCheck` call, and optionally
143145
// customize the options via the fourth argument.
@@ -174,3 +176,7 @@ These options can be defined globally during fixture initialization (see [Step 3
174176
| `delay` | `number` | `0` (no delay) | A number, in ms, that we should delay before taking the snapshot. |
175177
| `ignoreRegions` | `(RegionIn \| string)[]` | `[]` (empty) | An array of manually created ignore regions, or CSS selectors in string form to ignore. |
176178
| `diffingMethod` | `DiffingMethod` | `DiffingMethod.Balanced` | The diffing method from the backend that we should use when performing visual differences. This can be customized by using the `DiffingMethod` enum exported from our `@saucelabs/visual` package. |
179+
180+
## Example
181+
182+
An example project is available in our [visual examples repo](https://github.com/saucelabs/visual-examples/tree/main/playwright-js).

0 commit comments

Comments
 (0)