Генератор тестов (Codegen)

Что такое Playwright Codegen

Playwright Codegen — это встроенный инструмент, который записывает ваши действия в браузере и преобразует их в готовый тестовый код. Достаточно выполнить одну команду в терминале, и откроется браузер, каждое ваше действие будет записано в виде стабильного, готового к использованию теста на Python.

Запуск генератора

Базовый запуск

Просто выполните команду в терминале:

# Запуск генератора в режиме по умолчанию
playwright codegen

После запуска откроется два окна: браузер (где вы выполняете действия) и Playwright Inspector (с генерируемым кодом). Выберите язык Python в Inspector, если он не установлен по умолчанию.

С указанием URL

Можно сразу указать адрес страницы, с которой начать:

# Открыть playwright.dev и начать запись
playwright codegen playwright.dev

# Запуск с локальным сервером
playwright codegen http://localhost:3000

Настройка размера окна

По умолчанию окно браузера имеет размер 1280x720. Вы можете изменить его:

# Кастомный размер окна просмотра
playwright codegen --viewport-size=1280,720

# Мобильный размер
playwright codegen --viewport-size=375,812

Эмуляция устройств

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

# Эмуляция iPhone 13
playwright codegen --device="iPhone 13"

# Эмуляция Pixel 5
playwright codegen --device="Pixel 5"

# Эмуляция iPad Pro
playwright codegen --device="iPad Pro 11"

Цветовая схема

Вы можете задать цветовую схему для тестирования тёмной темы:

# Тёмная тема
playwright codegen --color-scheme=dark

# Светлая тема (по умолчанию)
playwright codegen --color-scheme=light

Сохранение результата в файл

Сгенерированный код можно сразу сохранить в файл:

# Сохранение в файл test_my.py
playwright codegen --output test_my.py

# Сохранение с указанием полного пути
playwright codegen --output tests/test_login.py

Выбор целевого языка

По умолчанию Codegen генерирует код на Python. Можно явно указать целевой язык:

# Python (по умолчанию)
playwright codegen --target=python

# JavaScript
playwright codegen --target=javascript

# Java
playwright codegen --target=java

# .NET C#
playwright codegen --target=csharp

Запись действий

Когда браузер открыт, каждое ваше действие записывается в реальный код. Вот что поддерживается:

• Клики — по кнопкам, ссылкам, любым элементам. Генерируется locator.click()
• Ввод текста — заполнение полей ввода. Генерируется locator.fill()
• Навигация — переход по ссылкам, ввод URL. Генерируется page.goto()
• Выбор опций — из выпадающих списков. Генерируется locator.select_option()
• Отметка чекбоксов — генерируется locator.check() / locator.uncheck()
• Drag-and-drop — генерируется locator.drag_to()

Пример сгенерированного кода:

from playwright.sync_api import sync_playwright

def run(playwright):
    browser = playwright.chromium.launch(headless=False)
    context = browser.new_context()
    page = context.new_page()
    page.goto("https://example.com")
    page.get_by_role("button", name="Submit").click()
    page.get_by_label("Email").fill("user@example.com")
    page.get_by_role("combobox", name="Country").select_option("RU")
    page.get_by_role("checkbox", name="Agree").check()
    page.get_by_role("link", name="Logout").click()
    context.close()
    browser.close()

with sync_playwright() as playwright:
    run(playwright)

Playwright Inspector

Playwright Inspector — это графический интерфейс, который открывается вместе с Codegen. Он предоставляет:

• Дерево локаторов — иерархия DOM с подсветкой элементов при наведении
• Генерируемый код — обновляется в реальном времени по мере действий
• Копирование селекторов — можно скопировать рекомендованный локатор для любого элемента
• Режим Pick Locator — выберите элемент на странице и получите лучший локатор

Pick Locator mode

Режим Pick Locator позволяет навести курсор на любой элемент страницы и мгновенно получить рекомендуемый локатор для него. Playwright анализирует DOM и выбирает наиболее стабильный и читаемый локатор (обычно get_by_role или get_by_text).

# Включение Pick Locator из командной строки
playwright codegen --inspector

В Inspector нажмите кнопку "Pick Locator" (значок прицела), затем наведитесь на элемент на странице — в Inspector отобразится лучший локатор.

Assertion tools (Утверждения)

Codegen позволяет добавлять проверки прямо во время записи. В Inspector есть три кнопки для утверждений:

• Visibility — проверка видимости элемента. Генерирует expect(locator).is_visible()
• Text — проверка текста элемента. Генерирует expect(locator).to_have_text()
• Value — проверка значения поля. Генерирует expect(locator).to_have_value()

Пример сгенерированного кода с утверждениями:

def run(playwright):
    browser = playwright.chromium.launch(headless=False)
    context = browser.new_context()
    page = context.new_page()
    page.goto("https://example.com")

    # Утверждение: кнопка видна
    page.get_by_role("button", name="Submit").is_visible()

    # Утверждение: текст заголовка
    page.get_by_role("heading", name="Welcome").is_visible()

    # Утверждение: поле содержит значение
    page.get_by_label("Email").fill("user@example.com")
    page.get_by_label("Email").input_value() == "user@example.com"

    context.close()
    browser.close()

Эмуляционные опции

Codegen поддерживает множество опций для эмуляции различных условий:

Часовой пояс

# Эмуляция часового пояса Москвы
playwright codegen --timezone="Europe/Moscow"

# Эмуляция часового пояса Нью-Йорка
playwright codegen --timezone="America/New_York"

Геолокация

# Эмуляция координат (Москва)
playwright codegen --geolocation="55.7558,37.6173"

# Эмуляция координат (Нью-Йорк)
playwright codegen --geolocation="40.7128,-74.0060"

Язык браузера

# Русский язык интерфейса
playwright codegen --lang="ru-RU"

# Несколько языков
playwright codegen --lang="de-DE,en-US"

page.pause() — открытие Inspector в коде

Вы можете вставить вызов page.pause() в свой тестовый код, чтобы вручную открыть Playwright Inspector в нужный момент выполнения. Это позволяет переключиться в режим записи прямо посередине теста.

def test_example(page):
    page.goto("https://example.com")
    page.get_by_role("button", name="Login").click()

    # Открыть Inspector для ручного взаимодействия
    page.pause()

    # Код после паузы продолжится после нажатия "Resume" в Inspector
    page.get_by_role("heading", name="Dashboard").is_visible()

Сохранение и загрузка аутентификации

Codegen поддерживает сохранение состояния аутентификации (cookies, localStorage) для повторного использования в последующих сессиях.

Сохранение состояния

# Запись действий с сохранением сессии
playwright codegen --save-storage=auth.json

# После закрытия браузера файл auth.json будет содержать куки и localStorage

Загрузка состояния

# Запуск с ранее сохранённой сессией
playwright codegen --load-storage=auth.json

# Пользователь уже будет авторизован
playwright codegen --load-storage=auth.json https://example.com/dashboard

Программное использование storageState:

import json

# Сохранение состояния контекста
storage = context.storage_state(path="auth.json")

# Загрузка состояния в новый контекст
context = browser.new_context(storage_state="auth.json")

Настройка трассировки, видео и скриншотов из Codegen

Вы можете настроить дополнительные опции прямо при запуске Codegen:

Трассировка

# Включение трассировки
playwright codegen --trace on

# Трассировка только при ошибках
playwright codegen --trace retain-on-failure

Видеозапись

# Запись видео теста
playwright codegen --video on

# Видео только при падении
playwright codegen --video retain-on-failure

Скриншоты

# Скриншоты на каждом шаге
playwright codegen --screenshot on

# Скриншоты только при падении
playwright codegen --screenshot only-on-failure

Практический пример: запись теста авторизации

Полный сценарий работы с Codegen для создания теста авторизации:

# Шаг 1: Запуск генератора с эмуляцией мобильного устройства и русским языком
playwright codegen --device="iPhone 13" --lang="ru-RU" --output test_auth.py

# Шаг 2: Выполните в браузере:
# 1. Перейдите на страницу логина
# 2. Введите email
# 3. Введите пароль
# 4. Нажмите кнопку "Войти"
# 5. Добавьте утверждение (visibility) на элемент после входа

# Шаг 3: Закройте браузер — код сохранится в test_auth.py

Результат в файле test_auth.py:

from playwright.sync_api import sync_playwright

def run(playwright):
    iphone_13 = playwright.devices["iPhone 13"]
    browser = playwright.webkit.launch(headless=False)
    context = browser.new_context(
        **iphone_13,
        locale="ru-RU",
    )
    page = context.new_page()
    page.goto("https://example.com/login")
    page.get_by_placeholder("Email").fill("user@example.com")
    page.get_by_placeholder("Пароль").fill("mypassword")
    page.get_by_role("button", name="Войти").click()
    page.get_by_role("heading", name="Dashboard").is_visible()
    context.close()
    browser.close()

with sync_playwright() as playwright:
    run(playwright)

Советы и рекомендации

Заключение

Playwright Codegen — мощный инструмент для быстрого создания тестов. Он не только ускоряет написание кода, но и помогает изучать правильные паттерны использования локаторов и API Playwright. Используйте его как отправную точку, а затем дорабатывайте тесты под свои нужды.