Проверки в Playwright

В этой главе даётся всестороннее введение в систему утверждений Playwright, включая утверждения с автоматическим повтором, общие утверждения и использование мягких утверждений.

Что такое утверждение?

Утверждение используется для проверки того, совпадает ли ожидаемый результат теста с фактическим результатом.

Playwright предоставляет два набора утверждений:общие утверждения(из Jest) иутверждения с автоматическим повтором(уникальные для Playwright).

Утверждения с автоматическим повтором vs общие утверждения

Утверждения с автоматическим повтором (асинхронные сопоставители)

Веб-специфичные утверждения Playwright автоматически повторяются до выполнения условия или наступления тайм-аута и должны использоватьawait。

Пример

// Утверждение с автоповтором — ждёт выполнения условия
await expect(page.getByText('EXAMPLE')).toBeVisible();

Общие утверждения

Используется для сравнения значений, не специфичных для веб-интерфейса; не выполняет автоматический повтор.

Пример

// Общее утверждение — выполняется сразу, не ожидает
expect(1 + 1).toBe(2);
expect('hello').toContain('ell');
expect(true).toBeTruthy();
TypeАвтоповтор?Требуется await?Сценарий применения
Утверждения с автоповторомДаОбязательныйawaitВеб-специфичный контент, такой как элементы страницы, URL, заголовок и т. д.
Общие утверждениянетНе требуетсяЗначения JavaScript, такие как обычные переменные, массивы, объекты и т. д.

Утверждения уровня страницы

Пример

// Утверждение заголовка страницы
await expect(page).toHaveTitle('Чему мы учимся — не только технологиям, но и мечтам!');
await expect(page).toHaveTitle(/EXAMPLE/);

// Утверждение URL страницы
await expect(page).toHaveURL('https://www.example.com/');
await expect(page).toHaveURL(/example\.com/);

Утверждения видимости

Пример

const btn = page.getByRole('button', { name: 'Submit' });

// Элемент виден
await expect(btn).toBeVisible();

// Элемент не виден
await expect(btn).toBeHidden();

// Элемент существует в DOM (но не обязательно виден)
await expect(btn).toBeAttached();

// Элемент виден в области просмотра
await expect(btn).toBeInViewport();

Утверждения текста и значений

Пример

const heading = page.getByRole('heading', { name: 'ПРИМЕР' });

// Текстовое содержимое элемента точно совпадает
await expect(heading).toHaveText('Не только технологии, но и мечты!');

// Текстовое содержимое элемента содержит подстроку
await expect(heading).toContainText('технологии');

// Текущее значение поля ввода
await expect(page.getByLabel('имя пользователя')).toHaveValue('example_user');

// Содержимое элемента пусто
await expect(page.getByTestId('error-msg')).toBeEmpty();

Проверки состояния

Пример

const checkbox = page.getByLabel('Согласен с условиями');
const input = page.getByLabel('электронная почта');

// Элемент включен
await expect(input).toBeEnabled();

// Элемент отключён
await expect(input).toBeDisabled();

// Элемент доступен для редактирования
await expect(input).toBeEditable();

// Флажок установлен
await expect(checkbox).toBeChecked();

// Элемент в фокусе
await expect(input).toBeFocused();

Утверждения атрибутов

Пример

const element = page.locator('.example-logo');

// Утверждение атрибута DOM
await expect(element).toHaveAttribute('src', '/static/images/logo.png');

// Проверяем только, что атрибут существует
await expect(element).toHaveAttribute('alt');

// Проверка имени CSS-класса
await expect(element).toHaveClass('logo-primary');

// Проверка значения CSS-свойства
await expect(element).toHaveCSS('display', 'block');

// Проверка ID элемента
await expect(element).toHaveId('main-logo');

// Доступное имя
await expect(page.getByRole('button')).toHaveAccessibleName('Submit');

Проверки количества

Пример

// Количество совпавших элементов
const items = page.getByRole('listitem');
await expect(items).toHaveCount(5);

// Используется с filter
const activeItems = page.getByRole('listitem').filter({ hasText: 'Activated' });
await expect(activeItems).toHaveCount(3);

Краткий справочник по общим утверждениям

МетодОписаниеПример
toBe(value)Строгое равенство (===)expect(x).toBe(42)
toEqual(value)Глубокое равенствоexpect(obj).toEqual({ a: 1 })
toContain(item)Массив/строка содержитexpect(arr).toContain('a')
toBeTruthy()Значение истинноexpect(x).toBeTruthy()
toBeFalsy()Значение является ложнымexpect(x).toBeFalsy()
toBeNull()Значение равно nullexpect(x).toBeNull()
toBeGreaterThan(n)Больше чем nexpect(x).toBeGreaterThan(10)
toBeLessThan(n)Меньше чем nexpect(x).toBeLessThan(100)
toHaveLength(n)Длина массиваexpect(arr).toHaveLength(3)

expect.soft() Мягкие утверждения

Обычные утверждения завершают тест сразу после сбоя.

Мягкие утвержденияНе завершают выполнение после сбоя; они продолжают выполнение последующего кода и сообщают обо всех сбоях единообразно в конце теста.

Пример

test('Несколько проверок при валидации формы', async ({ page }) => {
  await page.goto('https://example.com/form');

  // Мягкое утверждение — сбой не останавливает тест
  await expect.soft(page.getByLabel('username')).toBeVisible();
  await expect.soft(page.getByLabel('password')).toBeVisible();
  await expect.soft(page.getByLabel('email')).toBeVisible();
  await expect.soft(page.getByRole('button', { name: 'Register' })).toBeEnabled();

  // Если какое-либо из вышеуказанных утверждений не проходит, проверка продолжается, и все ошибки сообщаются в конце.
});

Используйте при тестировании страниц с формамиexpect.soft()Вы можете обнаружить все отсутствующие поля сразу, без необходимости исправлять их по одному, прежде чем увидеть следующую проблему. Это значительно повышает эффективность отладки.

Тайм-аут проверки

Автоматически повторяющиеся проверки имеют тайм-аут по умолчанию 5 секунд, который можно настроить в файле конфигурации или для отдельной проверки:

Пример

// Установить тайм-аут для отдельной проверки (в миллисекундах)
await expect(page.getByText('Loading...')).toBeHidden({ timeout: 10000 });

// Глобально задаётся в файле конфигурации
// playwright.config.ts:
// export default defineConfig({
// expect: { timeout: 10000 },
// });
Другие расширения