2021-08-06 14:02:41 -07:00
|
|
|
---
|
|
|
|
id: test-assertions
|
|
|
|
title: "Assertions"
|
|
|
|
---
|
|
|
|
|
|
|
|
Playwright Test uses [expect](https://jestjs.io/docs/expect) library for test assertions. This library provides
|
|
|
|
a lot of matchers like `toEqual`, `toContain`, `toMatch`, `toMatchSnapshot` and many more:
|
|
|
|
|
|
|
|
```js
|
|
|
|
expect(success).toBeTruthy();
|
|
|
|
```
|
|
|
|
|
|
|
|
Playwright also extends it with convenience async matchers that will wait until
|
2021-10-28 08:35:35 -07:00
|
|
|
the expected condition is met. In general, we can expect the opposite to be true by adding a `.not` to the front
|
|
|
|
of the matchers:
|
|
|
|
|
|
|
|
```js
|
|
|
|
expect(value).not.toEqual(0);
|
|
|
|
await expect(locator).not.toContainText("some text");
|
|
|
|
```
|
2021-08-06 14:02:41 -07:00
|
|
|
|
|
|
|
<!-- TOC -->
|
|
|
|
|
|
|
|
## Matching
|
|
|
|
|
|
|
|
Consider the following example:
|
|
|
|
|
|
|
|
```js
|
|
|
|
await expect(page.locator('.status')).toHaveText('Submitted');
|
|
|
|
```
|
|
|
|
|
|
|
|
Playwright Test will be re-testing the node with the selector `.status` until fetched Node has the `"Submitted"`
|
|
|
|
text. It will be re-fetching the node and checking it over and over, until the condition is met or until the timeout is
|
2021-10-29 15:25:52 -07:00
|
|
|
reached. You can either pass this timeout or configure it once via the [`property: TestConfig.expect`] value
|
2021-08-06 14:02:41 -07:00
|
|
|
in test config.
|
|
|
|
|
2021-10-20 12:06:02 -07:00
|
|
|
By default, the timeout for assertions is set to 5 seconds.
|
2021-08-06 14:02:41 -07:00
|
|
|
|
2021-10-29 15:25:52 -07:00
|
|
|
## expect(locator).toBeChecked([options])
|
2021-08-06 14:02:41 -07:00
|
|
|
- `options`
|
2021-10-29 15:25:52 -07:00
|
|
|
- `timeout` <[number]> Time to retry assertion for, defaults to `timeout` in [`property: TestConfig.expect`].
|
2021-08-06 14:02:41 -07:00
|
|
|
|
|
|
|
Ensures [Locator] points to the checked input.
|
|
|
|
|
|
|
|
```js
|
2021-08-13 18:59:38 +03:00
|
|
|
const locator = page.locator('.subscribe');
|
2021-08-06 14:02:41 -07:00
|
|
|
await expect(locator).toBeChecked();
|
|
|
|
```
|
|
|
|
|
2021-10-29 15:25:52 -07:00
|
|
|
## expect(locator).toBeDisabled([options])
|
2021-08-06 14:02:41 -07:00
|
|
|
- `options`
|
2021-10-29 15:25:52 -07:00
|
|
|
- `timeout` <[number]> Time to retry assertion for, defaults to `timeout` in [`property: TestConfig.expect`].
|
2021-08-06 14:02:41 -07:00
|
|
|
|
|
|
|
Ensures [Locator] points to a disabled element.
|
|
|
|
|
|
|
|
```js
|
2021-08-13 18:59:38 +03:00
|
|
|
const locator = page.locator('button.submit');
|
2021-08-06 14:02:41 -07:00
|
|
|
await expect(locator).toBeDisabled();
|
|
|
|
```
|
|
|
|
|
2021-10-29 15:25:52 -07:00
|
|
|
## expect(locator).toBeEditable([options])
|
2021-08-06 14:02:41 -07:00
|
|
|
- `options`
|
2021-10-29 15:25:52 -07:00
|
|
|
- `timeout` <[number]> Time to retry assertion for, defaults to `timeout` in [`property: TestConfig.expect`].
|
2021-08-06 14:02:41 -07:00
|
|
|
|
|
|
|
Ensures [Locator] points to an editable element.
|
|
|
|
|
|
|
|
```js
|
2021-08-13 18:59:38 +03:00
|
|
|
const locator = page.locator('input');
|
2021-08-06 14:02:41 -07:00
|
|
|
await expect(locator).toBeEditable();
|
|
|
|
```
|
|
|
|
|
2021-10-29 15:25:52 -07:00
|
|
|
## expect(locator).toBeEmpty([options])
|
2021-08-06 14:02:41 -07:00
|
|
|
- `options`
|
2021-10-29 15:25:52 -07:00
|
|
|
- `timeout` <[number]> Time to retry assertion for, defaults to `timeout` in [`property: TestConfig.expect`].
|
2021-08-06 14:02:41 -07:00
|
|
|
|
|
|
|
Ensures [Locator] points to an empty editable element or to a DOM node that has no text.
|
|
|
|
|
|
|
|
```js
|
2021-08-13 18:59:38 +03:00
|
|
|
const locator = page.locator('div.warning');
|
2021-08-06 14:02:41 -07:00
|
|
|
await expect(locator).toBeEmpty();
|
|
|
|
```
|
|
|
|
|
2021-10-29 15:25:52 -07:00
|
|
|
## expect(locator).toBeEnabled([options])
|
2021-08-06 14:02:41 -07:00
|
|
|
- `options`
|
2021-10-29 15:25:52 -07:00
|
|
|
- `timeout` <[number]> Time to retry assertion for, defaults to `timeout` in [`property: TestConfig.expect`].
|
2021-08-06 14:02:41 -07:00
|
|
|
|
|
|
|
Ensures [Locator] points to an enabled element.
|
|
|
|
|
|
|
|
```js
|
2021-08-13 18:59:38 +03:00
|
|
|
const locator = page.locator('button.submit');
|
2021-08-06 14:02:41 -07:00
|
|
|
await expect(locator).toBeEnabled();
|
|
|
|
```
|
|
|
|
|
2021-10-29 15:25:52 -07:00
|
|
|
## expect(locator).toBeFocused([options])
|
2021-08-06 14:02:41 -07:00
|
|
|
- `options`
|
2021-10-29 15:25:52 -07:00
|
|
|
- `timeout` <[number]> Time to retry assertion for, defaults to `timeout` in [`property: TestConfig.expect`].
|
2021-08-06 14:02:41 -07:00
|
|
|
|
|
|
|
Ensures [Locator] points to a focused DOM node.
|
|
|
|
|
|
|
|
```js
|
2021-08-13 18:59:38 +03:00
|
|
|
const locator = page.locator('input');
|
2021-08-06 14:02:41 -07:00
|
|
|
await expect(locator).toBeFocused();
|
|
|
|
```
|
|
|
|
|
2021-10-29 15:25:52 -07:00
|
|
|
## expect(locator).toBeHidden([options])
|
2021-08-06 14:02:41 -07:00
|
|
|
- `options`
|
2021-10-29 15:25:52 -07:00
|
|
|
- `timeout` <[number]> Time to retry assertion for, defaults to `timeout` in [`property: TestConfig.expect`].
|
2021-08-06 14:02:41 -07:00
|
|
|
|
|
|
|
Ensures [Locator] points to a hidden DOM node, which is the opposite of [visible](./actionability.md#visible).
|
|
|
|
|
|
|
|
```js
|
2021-08-13 18:59:38 +03:00
|
|
|
const locator = page.locator('.my-element');
|
2021-08-06 14:02:41 -07:00
|
|
|
await expect(locator).toBeHidden();
|
|
|
|
```
|
|
|
|
|
2021-10-29 15:25:52 -07:00
|
|
|
## expect(locator).toBeVisible([options])
|
2021-08-06 14:02:41 -07:00
|
|
|
- `options`
|
2021-10-29 15:25:52 -07:00
|
|
|
- `timeout` <[number]> Time to retry assertion for, defaults to `timeout` in [`property: TestConfig.expect`].
|
2021-08-06 14:02:41 -07:00
|
|
|
|
|
|
|
Ensures [Locator] points to a [visible](./actionability.md#visible) DOM node.
|
|
|
|
|
|
|
|
```js
|
2021-08-13 18:59:38 +03:00
|
|
|
const locator = page.locator('.my-element');
|
2021-08-06 14:02:41 -07:00
|
|
|
await expect(locator).toBeVisible();
|
|
|
|
```
|
|
|
|
|
2021-10-29 15:25:52 -07:00
|
|
|
## expect(locator).toContainText(expected[, options])
|
2021-10-19 13:54:26 -07:00
|
|
|
- `expected` <[string] | [RegExp] | [Array]<[string]|[RegExp]>>
|
2021-08-06 14:02:41 -07:00
|
|
|
- `options`
|
2021-10-29 15:25:52 -07:00
|
|
|
- `timeout` <[number]> Time to retry assertion for, defaults to `timeout` in [`property: TestConfig.expect`].
|
2021-10-19 13:54:26 -07:00
|
|
|
- `useInnerText` <[boolean]> Whether to use `element.innerText` instead of `element.textContent` when retrieving DOM node text.
|
2021-08-06 14:02:41 -07:00
|
|
|
|
2021-09-27 11:14:35 -07:00
|
|
|
Ensures [Locator] points to an element that contains the given text. You can use regular expressions for the value as well.
|
2021-08-06 14:02:41 -07:00
|
|
|
|
|
|
|
```js
|
2021-08-13 18:59:38 +03:00
|
|
|
const locator = page.locator('.title');
|
2021-08-06 14:02:41 -07:00
|
|
|
await expect(locator).toContainText('substring');
|
2021-09-27 11:14:35 -07:00
|
|
|
await expect(locator).toContainText(/\d messages/);
|
|
|
|
```
|
|
|
|
|
|
|
|
Note that if array is passed as an expected value, entire lists can be asserted:
|
|
|
|
|
|
|
|
```js
|
|
|
|
const locator = page.locator('list > .list-item');
|
|
|
|
await expect(locator).toContainText(['Text 1', 'Text 4', 'Text 5']);
|
2021-08-06 14:02:41 -07:00
|
|
|
```
|
|
|
|
|
2021-10-29 15:25:52 -07:00
|
|
|
## expect(locator).toHaveAttribute(name, value[, options])
|
2021-10-19 13:54:26 -07:00
|
|
|
- `name` <[string]> Attribute name
|
|
|
|
- `value` <[string]|[RegExp]> Attribute value
|
2021-08-06 14:02:41 -07:00
|
|
|
- `options`
|
2021-10-29 15:25:52 -07:00
|
|
|
- `timeout` <[number]> Time to retry assertion for, defaults to `timeout` in [`property: TestConfig.expect`].
|
2021-08-06 14:02:41 -07:00
|
|
|
|
|
|
|
Ensures [Locator] points to an element with given attribute.
|
|
|
|
|
|
|
|
```js
|
2021-08-13 18:59:38 +03:00
|
|
|
const locator = page.locator('input');
|
2021-08-06 16:58:42 -07:00
|
|
|
await expect(locator).toHaveAttribute('type', 'text');
|
2021-08-06 14:02:41 -07:00
|
|
|
```
|
|
|
|
|
2021-10-29 15:25:52 -07:00
|
|
|
## expect(locator).toHaveClass(expected[, options])
|
2021-10-19 13:54:26 -07:00
|
|
|
- `expected` <[string] | [RegExp] | [Array]<[string]|[RegExp]>>
|
2021-08-06 14:02:41 -07:00
|
|
|
- `options`
|
2021-10-29 15:25:52 -07:00
|
|
|
- `timeout` <[number]> Time to retry assertion for, defaults to `timeout` in [`property: TestConfig.expect`].
|
2021-08-06 14:02:41 -07:00
|
|
|
|
|
|
|
Ensures [Locator] points to an element with given CSS class.
|
|
|
|
|
|
|
|
```js
|
2021-08-13 18:59:38 +03:00
|
|
|
const locator = page.locator('#component');
|
2021-08-06 14:02:41 -07:00
|
|
|
await expect(locator).toHaveClass(/selected/);
|
|
|
|
```
|
|
|
|
|
|
|
|
Note that if array is passed as an expected value, entire lists can be asserted:
|
|
|
|
|
|
|
|
```js
|
2021-09-02 15:48:04 -07:00
|
|
|
const locator = page.locator('list > .component');
|
2021-08-06 14:02:41 -07:00
|
|
|
await expect(locator).toHaveClass(['component', 'component selected', 'component']);
|
|
|
|
```
|
|
|
|
|
2021-10-29 15:25:52 -07:00
|
|
|
## expect(locator).toHaveCount(count[, options])
|
2021-10-19 13:54:26 -07:00
|
|
|
- `count` <[number]>
|
2021-08-06 14:02:41 -07:00
|
|
|
- `options`
|
2021-10-29 15:25:52 -07:00
|
|
|
- `timeout` <[number]> Time to retry assertion for, defaults to `timeout` in [`property: TestConfig.expect`].
|
2021-08-06 14:02:41 -07:00
|
|
|
|
|
|
|
Ensures [Locator] resolves to an exact number of DOM nodes.
|
|
|
|
|
|
|
|
```js
|
2021-09-27 11:14:35 -07:00
|
|
|
const list = page.locator('list > .component');
|
2021-08-06 14:02:41 -07:00
|
|
|
await expect(list).toHaveCount(3);
|
|
|
|
```
|
|
|
|
|
2021-10-29 15:25:52 -07:00
|
|
|
## expect(locator).toHaveCSS(name, value[, options])
|
2021-10-19 13:54:26 -07:00
|
|
|
- `name` <[string]> CSS property name
|
|
|
|
- `value` <[string]|[RegExp]> CSS property value
|
2021-08-06 14:02:41 -07:00
|
|
|
- `options`
|
2021-10-29 15:25:52 -07:00
|
|
|
- `timeout` <[number]> Time to retry assertion for, defaults to `timeout` in [`property: TestConfig.expect`].
|
2021-08-06 14:02:41 -07:00
|
|
|
|
2021-09-27 11:14:35 -07:00
|
|
|
Ensures [Locator] resolves to an element with the given computed CSS style.
|
2021-08-06 14:02:41 -07:00
|
|
|
|
|
|
|
```js
|
2021-08-13 18:59:38 +03:00
|
|
|
const locator = page.locator('button');
|
2021-08-06 14:02:41 -07:00
|
|
|
await expect(locator).toHaveCSS('display', 'flex');
|
|
|
|
```
|
|
|
|
|
2021-10-29 15:25:52 -07:00
|
|
|
## expect(locator).toHaveId(id[, options])
|
2021-10-19 13:54:26 -07:00
|
|
|
- `id` <[string]> Element id
|
2021-08-06 14:02:41 -07:00
|
|
|
- `options`
|
2021-10-29 15:25:52 -07:00
|
|
|
- `timeout` <[number]> Time to retry assertion for, defaults to `timeout` in [`property: TestConfig.expect`].
|
2021-08-06 14:02:41 -07:00
|
|
|
|
|
|
|
Ensures [Locator] points to an element with the given DOM Node ID.
|
|
|
|
|
|
|
|
```js
|
2021-08-13 18:59:38 +03:00
|
|
|
const locator = page.locator('input');
|
2021-08-06 14:02:41 -07:00
|
|
|
await expect(locator).toHaveId('lastname');
|
|
|
|
```
|
|
|
|
|
2021-10-29 15:25:52 -07:00
|
|
|
## expect(locator).toHaveJSProperty(name, value[, options])
|
2021-10-19 13:54:26 -07:00
|
|
|
- `name` <[string]> Property name
|
|
|
|
- `value` <[any]> Property value
|
2021-08-06 14:02:41 -07:00
|
|
|
- `options`
|
2021-10-29 15:25:52 -07:00
|
|
|
- `timeout` <[number]> Time to retry assertion for, defaults to `timeout` in [`property: TestConfig.expect`].
|
2021-08-06 14:02:41 -07:00
|
|
|
|
|
|
|
Ensures [Locator] points to an element with given JavaScript property. Note that this property can be
|
|
|
|
of a primitive type as well as a plain serializable JavaScript object.
|
|
|
|
|
|
|
|
```js
|
2021-08-13 18:59:38 +03:00
|
|
|
const locator = page.locator('.component');
|
2021-08-06 16:58:42 -07:00
|
|
|
await expect(locator).toHaveJSProperty('loaded', true);
|
2021-08-06 14:02:41 -07:00
|
|
|
```
|
|
|
|
|
2021-10-29 15:25:52 -07:00
|
|
|
## expect(locator).toHaveText(expected[, options])
|
2021-10-19 13:54:26 -07:00
|
|
|
- `expected` <[string] | [RegExp] | [Array]<[string]|[RegExp]>>
|
2021-08-06 14:02:41 -07:00
|
|
|
- `options`
|
2021-10-29 15:25:52 -07:00
|
|
|
- `timeout` <[number]> Time to retry assertion for, defaults to `timeout` in [`property: TestConfig.expect`].
|
2021-10-19 13:54:26 -07:00
|
|
|
- `useInnerText` <[boolean]> Whether to use `element.innerText` instead of `element.textContent` when retrieving DOM node text.
|
2021-08-06 14:02:41 -07:00
|
|
|
|
|
|
|
Ensures [Locator] points to an element with the given text. You can use regular expressions for the value as well.
|
|
|
|
|
|
|
|
```js
|
2021-08-13 18:59:38 +03:00
|
|
|
const locator = page.locator('.title');
|
2021-09-27 11:14:35 -07:00
|
|
|
await expect(locator).toHaveText(/Welcome, Test User/);
|
2021-08-06 14:02:41 -07:00
|
|
|
await expect(locator).toHaveText(/Welcome, .*/);
|
|
|
|
```
|
|
|
|
|
|
|
|
Note that if array is passed as an expected value, entire lists can be asserted:
|
|
|
|
|
|
|
|
```js
|
2021-09-27 11:14:35 -07:00
|
|
|
const locator = page.locator('list > .component');
|
2021-08-06 14:02:41 -07:00
|
|
|
await expect(locator).toHaveText(['Text 1', 'Text 2', 'Text 3']);
|
|
|
|
```
|
|
|
|
|
2021-10-29 15:25:52 -07:00
|
|
|
## expect(locator).toHaveValue(value[, options])
|
2021-10-19 13:54:26 -07:00
|
|
|
- `value` <[string] | [RegExp]>
|
2021-08-06 14:02:41 -07:00
|
|
|
- `options`
|
2021-10-29 15:25:52 -07:00
|
|
|
- `timeout` <[number]> Time to retry assertion for, defaults to `timeout` in [`property: TestConfig.expect`].
|
2021-08-06 14:02:41 -07:00
|
|
|
|
2021-10-19 13:54:26 -07:00
|
|
|
Ensures [Locator] points to an element with the given input value. You can use regular expressions for the value as well.
|
2021-08-06 14:02:41 -07:00
|
|
|
|
|
|
|
```js
|
2021-10-19 13:54:26 -07:00
|
|
|
const locator = page.locator('input[type=number]');
|
|
|
|
await expect(locator).toHaveValue(/[0-9]/);
|
2021-08-06 14:02:41 -07:00
|
|
|
```
|
|
|
|
|
2021-10-29 15:25:52 -07:00
|
|
|
## expect(page).toHaveTitle(title[, options])
|
2021-10-19 13:54:26 -07:00
|
|
|
- `title` <[string] | [RegExp]>
|
2021-08-06 14:02:41 -07:00
|
|
|
- `options`
|
2021-10-29 15:25:52 -07:00
|
|
|
- `timeout` <[number]> Time to retry assertion for, defaults to `timeout` in [`property: TestConfig.expect`].
|
2021-08-06 14:02:41 -07:00
|
|
|
|
2021-10-19 13:54:26 -07:00
|
|
|
Ensures page has a given title.
|
2021-08-06 14:02:41 -07:00
|
|
|
|
|
|
|
```js
|
2021-10-19 13:54:26 -07:00
|
|
|
await expect(page).toHaveTitle(/.*checkout/);
|
2021-08-06 14:02:41 -07:00
|
|
|
```
|
|
|
|
|
2021-10-29 15:25:52 -07:00
|
|
|
## expect(page).toHaveURL(url[, options])
|
2021-10-19 13:54:26 -07:00
|
|
|
- `url` <[string] | [RegExp]>
|
2021-08-06 14:02:41 -07:00
|
|
|
- `options`
|
2021-10-29 15:25:52 -07:00
|
|
|
- `timeout` <[number]> Time to retry assertion for, defaults to `timeout` in [`property: TestConfig.expect`].
|
2021-08-06 14:02:41 -07:00
|
|
|
|
2021-10-19 13:54:26 -07:00
|
|
|
Ensures page is navigated to a given URL.
|
2021-08-06 14:02:41 -07:00
|
|
|
|
|
|
|
```js
|
2021-10-19 13:54:26 -07:00
|
|
|
await expect(page).toHaveURL(/.*checkout/);
|
2021-08-06 14:02:41 -07:00
|
|
|
```
|
2021-10-29 15:25:52 -07:00
|
|
|
|
|
|
|
## expect(value).toMatchSnapshot(name[, options])
|
|
|
|
- `name` <[string] | [Array]<[string]>> Snapshot name.
|
|
|
|
- `options`
|
|
|
|
- `threshold` <[float]> Image matching threshold between zero (strict) and one (lax), default is configurable with [`property: TestConfig.expect`].
|
|
|
|
|
|
|
|
Ensures that passed value, either a [string] or a [Buffer], matches the expected snapshot stored in the test snapshots directory.
|
|
|
|
|
|
|
|
```js
|
|
|
|
// Basic usage.
|
|
|
|
expect(await page.screenshot()).toMatchSnapshot('landing-page.png');
|
|
|
|
|
|
|
|
// Configure image matching threshold.
|
|
|
|
expect(await page.screenshot()).toMatchSnapshot('landing-page.png', { threshold: 0.3 });
|
|
|
|
|
|
|
|
// Bring some structure to your snapshot files by passing file path segments.
|
|
|
|
expect(await page.screenshot()).toMatchSnapshot(['landing', 'step2.png']);
|
|
|
|
expect(await page.screenshot()).toMatchSnapshot(['landing', 'step3.png']);
|
|
|
|
```
|
|
|
|
|
|
|
|
Learn more about [visual comparisons](./test-snapshots.md).
|