Написание тестов взаимодействия со страницей
Нажимайте кнопки, заполняйте формы и проверяйте состояние DOM с помощью мощного API Playwright.
«Написание тестов взаимодействия со страницей» — бесплатный урок Sveltejs Academy на CoddyKit. Это урок 2 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения Sveltejs Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс Sveltejs Academy содержит 4 уроков всего.
Базовый тест
Каждый тест импортирует средства тестирования и проверок из Playwright.
import { test, expect } from "@playwright/test";
test("homepage", async ({ page }) => {
await page.goto("/");
await expect(page).toHaveTitle(/My App/);
});Навигация
Используйте page.goto(url) для перехода на страницы и page.click() для навигации с помощью нажатий.
Селекторы
Используйте локаторы по роли, тексту или идентификатору теста для надёжных селекторов.
await page.getByRole("button", { name: "Save" }).click();Заполнение форм
Используйте fill, type, check и selectOption.
await page.getByLabel("Email").fill("user@example.com");Проверки
Используйте expect(locator) для повторяющихся проверок, например toBeVisible и toHaveText.
Асинхронность и ожидание
Каждое действие асинхронно. Всегда используйте await.
Автоматическое ожидание
Playwright автоматически ждёт, пока элементы станут доступными для действия. Это уменьшает количество нестабильных тестов.
Снимки экрана
Создавайте снимки экрана при сбое или в рамках визуального тестирования на регрессии.
await page.screenshot({ path: "result.png" });Безголовый режим
По умолчанию тесты выполняются без интерфейса браузера. Переключите режим с интерфейсом с помощью --headed, чтобы наблюдать за выполнением.
Параллельные тесты
Playwright запускает тесты параллельно для каждого рабочего процесса. Используйте изолированное состояние (файлы cookie и хранилище).
Используйте модель объекта страницы
В больших наборах тестов инкапсулируйте селекторы и действия, относящиеся к странице, в классах.
Быстрая проверка
Какой тип локатора наиболее устойчив?
Итоги
Пишите тесты взаимодействия с переходом, click, fill и локаторами на основе ролей. Используйте повторяющие проверки с помощью expect.
Часто задаваемые вопросы
Урок «Написание тестов взаимодействия со страницей» бесплатный?
Да — полный текст урока «Написание тестов взаимодействия со страницей» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс Sveltejs Academy, подпишись на CoddyKit PRO. Курс Sveltejs Academy содержит 4 уроков всего.
Чему я научусь в уроке «Написание тестов взаимодействия со страницей»?
Нажимайте кнопки, заполняйте формы и проверяйте состояние DOM с помощью мощного API Playwright. Ты практикуешь Sveltejs Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.
Нужен ли мне опыт, чтобы начать Sveltejs Academy?
Предыдущий опыт не требуется. Sveltejs Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 2 из 4.
Сколько времени занимает урок «Написание тестов взаимодействия со страницей»?
Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.
Можно ли писать и запускать код в этом уроке Sveltejs Academy?
Да. Каждый урок Sveltejs Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.
Все уроки этого курса
- Настройка Playwright в SvelteKit
- Написание тестов взаимодействия со страницей
- Тестирование форм и навигации
- Интеграция с CI