Перейти к основному содержимому

Написание тестов

Введение

Тесты Playwright просты: они выполняют действия и проверяют состояние на соответствие ожиданиям.

Playwright автоматически ждёт прохождения проверок actionability перед выполнением каждого действия. Вам не нужно добавлять ручные ожидания или бороться с гонками (race conditions). Ассерты Playwright устроены так, чтобы описывать ожидания, которые со временем будут выполнены, устраняя нестабильные таймауты и проверки «на гонках».

Вы узнаете

Первый тест

Посмотрите на следующий пример, чтобы увидеть, как написать тест.

tests/example.spec.ts
import { test, expect } from '@playwright/test';

test('has title', async ({ page }) => {
await page.goto('https://playwright.dev/');

// Ожидаем, что заголовок "содержит" подстроку.
await expect(page).toHaveTitle(/Playwright/);
});

test('get started link', async ({ page }) => {
await page.goto('https://playwright.dev/');

// Нажимаем на ссылку "Начать".
await page.getByRole('link', { name: 'Get started' }).click();

// Ожидаем, что на странице есть заголовок с именем "Установка".
await expect(page.getByRole('heading', { name: 'Installation' })).toBeVisible();
});
примечание

Добавьте // @ts-check в начале каждого тестового файла при использовании JavaScript в VS Code, чтобы получить автоматическую проверку типов.

Действия

Большинство тестов начинаются с перехода по URL. После этого тест взаимодействует с элементами страницы.

await page.goto('https://playwright.dev/');

Playwright ждёт, пока страница достигнет состояния загрузки (load state), прежде чем продолжить. Подробнее об опциях page.goto().

Взаимодействия

Выполнение действий начинается с поиска элементов. Для этого Playwright использует Locators API. Локаторы — это способ находить элемент(ы) на странице в любой момент времени. Подробнее о доступных разных типах локаторов.

Перед выполнением действия Playwright ждёт, пока элемент станет actionable, поэтому вам не нужно вручную ждать, пока он станет доступен.

// Создаем локатор.
const getStarted = page.getByRole('link', { name: 'Get started' });

// Нажимаем на него.
await getStarted.click();

В большинстве случаев это будет записано в одну строку:

await page.getByRole('link', { name: 'Get started' }).click();

Основные действия

Вот самые популярные действия Playwright. Полный список см. в разделе Locator API.

ДействиеОписание
locator.check()Установить флажок в поле ввода
locator.click()Нажать на элемент
locator.uncheck()Снять флажок с поля ввода
locator.hover()Навести курсор на элемент
locator.fill()Заполнить поле формы, ввести текст
locator.focus()Установить фокус на элемент
locator.press()Нажать на одну клавишу
locator.setInputFiles()Выбрать файлы для загрузки
locator.selectOption()Выбрать опцию в выпадающем списке

Утверждения

В Playwright есть асинхронные матчеры, которые ждут, пока ожидаемое условие не будет выполнено. Использование этих матчеров делает тесты стабильными (non-flaky) и устойчивыми. Например, этот код ждёт, пока у страницы появится заголовок, содержащий «Playwright»:

await expect(page).toHaveTitle(/Playwright/);

Вот самые популярные асинхронные ассерты. Полный список см. в руководстве по асертам:

УтверждениеОписание
expect(locator).toBeChecked()Флажок установлен
expect(locator).toBeEnabled()Элемент включен
expect(locator).toBeVisible()Элемент видим
expect(locator).toContainText()Элемент содержит текст
expect(locator).toHaveAttribute()Элемент имеет атрибут
expect(locator).toHaveCount()Список элементов имеет заданную длину
expect(locator).toHaveText()Элемент соответствует тексту
expect(locator).toHaveValue()Элемент ввода имеет значение
expect(page).toHaveTitle()У страницы есть заголовок
expect(page).toHaveURL()У страницы есть URL

В Playwright также есть универсальные матчеры вроде toEqual, toContain, toBeTruthy, которые можно использовать для проверки любых условий. Эти проверки не используют await, так как выполняют немедленные синхронные проверки уже доступных значений.

expect(success).toBeTruthy();

Изоляция тестов

Playwright Test основан на концепции тестовых фикстур, например встроенной фикстуры page, которая передаётся в ваш тест. Страницы изолированы между тестами благодаря Browser Context, который эквивалентен совершенно новому профилю браузера. Каждый тест получает чистое окружение — даже когда несколько тестов выполняются в одном браузере.

tests/example.spec.ts
import { test } from '@playwright/test';

test('example test', async ({ page }) => {
// "page" принадлежит изолированному контексту браузера, созданному для этого конкретного теста.
});

test('another test', async ({ page }) => {
// "page" во втором тесте полностью изолирован от первого теста.
});

Использование хуков тестов

Вы можете использовать различные хуки тестов, такие как test.describe, чтобы объявить группу тестов, и test.beforeEach и test.afterEach, которые выполняются перед/после каждого теста. Другие хуки включают test.beforeAll и test.afterAll, которые выполняются один раз для каждого рабочего процесса перед/после всех тестов.

tests/example.spec.ts
import { test, expect } from '@playwright/test';

test.describe('navigation', () => {
test.beforeEach(async ({ page }) => {
// Переходим на начальный URL перед каждым тестом.
await page.goto('https://playwright.dev/');
});

test('main navigation', async ({ page }) => {
// Утверждения используют API expect.
await expect(page).toHaveURL('https://playwright.dev/');
});
});

Что дальше