Wiki · Технологии разработки

Playwright

4 мин чтенияАвтор: Сергей ЧерняковСоавторы: Евгений Баев

Playwright – это инструмент от Microsoft для автоматических тестов в браузере. Скрипт открывает сайт, как обычный посетитель, нажимает кнопки, заполняет формы и проверяет, что на экране появилось то, что должно.

Знакомая ситуация: разработчик поправил фильтр в каталоге, а через два дня выяснилось, что перестала отправляться форма заказа. Никто не проверил её после обновления, потому что «трогали же фильтр». Автотесты нужны как раз для этого: после каждого изменения они заново проходят главные сценарии, и такая поломка всплывает до выкладки на сайт.

Какие сценарии сайта закрывают автотестами

Тест на Playwright описывает путь пользователя по шагам. Например, проверка заявки с сайта клиники:

await page.goto('/zapis/');
await page.getByLabel('Телефон').fill('+7 900 000-00-00');
await page.getByRole('button', { name: 'Записаться' }).click();
await expect(page.getByText('Заявка отправлена')).toBeVisible();

Обычно первыми автоматизируют то, через что идут деньги и заявки:

формы заявки, обратного звонка и записи;
каталог с фильтрами, корзину и оформление заказа до шага оплаты;
вход и основные действия в личном кабинете, причём под разными ролями;
поиск по сайту и мобильное меню.

Пять шагов автотеста на Playwright для интернет-магазина: каталог, карточка товара, корзина, оформление заказа, проверка шага оплаты — Как автотест проходит заказ в магазине

Тесты запускают автоматически при каждом изменении кода, например в пайплайне GitLab CI/CD, и перед обновлением CMS. Если сценарий упал, выкладка останавливается.

Что Playwright умеет из коробки

Три движка браузеров: Chromium (на нём Chrome и Яндекс Браузер), Firefox и WebKit (на нём Safari). Тесты идут на Windows, Linux и macOS.
Эмуляция мобильных: Chrome на Android и мобильный Safari, с размером экрана и касаниями.
Автоожидание. Перед кликом Playwright ждёт, пока кнопка появится и станет активной. Поэтому тесты реже падают из-за того, что страница не успела загрузиться.
Запись тестов (codegen): тестировщик кликает по сайту, а Playwright пишет код сценария.
Трассировка: при падении можно посмотреть каждый шаг, скриншоты и запросы к серверу.

Тесты пишут на JavaScript и TypeScript, Python, Java или .NET. Язык не обязан совпадать с языком сайта: магазин на PHP можно тестировать скриптами на TypeScript.

Playwright или Selenium: что выбрать под задачу

Selenium старше, он управляет браузерами через WebDriver, стандарт W3C. На нём написаны тысячи тестовых наборов в крупных компаниях. Playwright моложе и сразу собран как готовый набор: браузеры, запуск, отчёты, трассировка.

Задача	Что подходит
Новые автотесты для сайта или веб-сервиса с нуля	Playwright: меньше настройки, есть ожидания и отчёты
В компании уже есть большой набор тестов и команда на Selenium	Selenium: переписывать всё ради смены инструмента дорого
Нужны редкие или старые браузеры и облачные фермы устройств	Selenium и сервисы на базе WebDriver
Нужно проверять ещё и доступность	Playwright с пакетом axe-core

Сравнение Playwright и Selenium: в каких задачах подходит каждый инструмент для автотестов сайта в браузере — Playwright и Selenium: когда что брать

Что автотесты дают владельцу сайта, а что нет

Главная выгода в том, что обновления перестают быть лотереей. Сайт можно чаще дорабатывать и обновлять, не проверяя руками каждый раз всю корзину. Но у автотестов есть цена: их пишут и поддерживают. Поменяли дизайн формы, и часть тестов придётся поправить.

И они не заменяют человека. Автотест проверит, что заявка ушла, но не заметит, что кнопка уехала под баннер на узком экране или текст стал нечитаемым. Поэтому перед крупным релизом всё равно нужно ручное тестирование сайта. Проверка на выдержку под наплывом посетителей тоже отдельная задача, про неё статья Нагрузочное тестирование.

Отдельно про ИИ. Microsoft выпускает Playwright MCP: сервер, через который языковые модели управляют браузером. Модель получает не скриншот, а структурный снимок страницы по дереву доступности. Так ИИ-агенты проходят по сайтам и помогают писать тесты, но это инструмент разработчика, а не замена набору тестов.

Автотесты на Playwright: переход, объём и сбои

Когда проекту на Selenium есть смысл переходить на Playwright?

Когда тестов мало или их всё равно переписывать, например после редизайна. Большой рабочий набор на Selenium ради смены инструмента обычно не трогают: новые сценарии можно писать на Playwright, а старые оставить, пока они не устареют.

Что такое Playwright MCP?

Это сервер от Microsoft, который даёт ИИ-модели управлять браузером через Playwright по протоколу MCP. Модель видит страницу как структурный снимок элементов и может кликать, заполнять поля и проверять результат.

Сколько автотестов нужно интернет-магазину на старте?

Начинают с пяти-десяти сценариев на путь покупателя: поиск, фильтр, карточка, корзина, оформление заказа, вход в кабинет. Этого хватает, чтобы ловить самые дорогие поломки. Дальше добавляют тест на каждую ошибку, которая уже однажды дошла до покупателей.

Кто пишет и обновляет тесты на Playwright после редизайна?

Обычно тестировщик-автоматизатор или разработчик, который делает изменение. Удобное правило: задача не считается готовой, пока не поправлены тесты на затронутые экраны. Пропишите это в договоре на поддержку, иначе после редизайна тесты начнут падать, и их просто отключат.

Как Playwright проверяет, работает ли сайт в Safari?

Через WebKit, браузерный движок, на котором построен Safari. Это близко к поведению Safari, но не полная копия, поэтому важные сценарии перед запуском всё равно проверяют на настоящем iPhone.

Автотесты на главные сценарии добавляем при доработке сайта и подключаем к технической поддержке: тесты запускаются перед каждым обновлением, и поломки форм и корзины видны до выкладки.