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

Playwright — это мощная библиотека для автоматизированного тестирования, которая позволяет эмулировать поведение пользователя в различных браузерах. В этом разделе рассматривается процесс создания и запуска первого теста с использованием Playwright в JavaScript.

Установка Playwright

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

npm install playwright

Playwright автоматически установит все необходимые компоненты, включая поддерживаемые браузеры: Chromium, Firefox и WebKit.

Создание базового теста

После установки Playwright можно приступать к написанию теста. Тесты в Playwright пишутся с использованием стандартных инструментов JavaScript, таких как Mocha или Jest. Однако, для простоты, начнем с создания теста без каких-либо сторонних тестовых фреймворков, используя только стандартные средства.

Пример:

const { chromium } = require('playwright');

(async () => {
  // Запуск браузера
  const browser = await chromium.launch();
  
  // Открытие новой страницы
  const page = await browser.newPage();
  
  // Переход на сайт
  await page.goto('https://example.com');
  
  // Проверка заголовка страницы
  const title = await page.title();
  console.log(title); // Должен вывести 'Example Domain'

  // Закрытие браузера
  await browser.close();
})();

Этот пример запускает браузер, переходит на сайт, извлекает его заголовок и выводит его в консоль.

Структура теста

  1. Запуск браузера: await chromium.launch() запускает браузер в фоновом режиме.
  2. Открытие страницы: await browser.newPage() создает новую вкладку.
  3. Переход на сайт: await page.goto('URL') выполняет навигацию к указанному ресурсу.
  4. Получение данных: await page.title() извлекает заголовок страницы.
  5. Закрытие браузера: await browser.close() завершает сессию.

Добавление утверждений

Для автоматического тестирования необходимо добавлять утверждения, проверяющие правильность выполнения операций. Например, для проверки заголовка страницы можно использовать assert из стандартной библиотеки Node.js.

Пример с утверждением:

const { chromium } = require('playwright');
const assert = require('assert');

(async () => {
  const browser = await chromium.launch();
  const page = await browser.newPage();
  await page.goto('https://example.com');
  
  const title = await page.title();
  assert.strictEqual(title, 'Example Domain'); // Утверждение на соответствие заголовка
  
  await browser.close();
})();

В данном примере, если заголовок страницы не совпадет с ожидаемым, тест завершится с ошибкой.

Работа с элементами страницы

Playwright предоставляет богатый набор методов для взаимодействия с элементами на странице, таких как клики, ввод текста и ожидания.

Пример: Взаимодействие с элементами

const { chromium } = require('playwright');
const assert = require('assert');

(async () => {
  const browser = await chromium.launch();
  const page = await browser.newPage();
  await page.goto('https://example.com');

  // Клик по элементу
  await page.click('text=More information');

  // Проверка, что открылся нужный URL
  await page.waitForURL('https://www.iana.org/domains/example');
  const currentUrl = page.url();
  assert.strictEqual(currentUrl, 'https://www.iana.org/domains/example');
  
  await browser.close();
})();

В этом примере после клика по ссылке с текстом “More information” Playwright ждет перехода на новый URL, после чего проверяет его соответствие ожидаемому.

Ожидания

Одной из важнейших частей тестирования является правильная синхронизация с элементами страницы. Playwright предоставляет несколько встроенных методов для ожидания, таких как waitForSelector и waitForTimeout.

Пример: Ожидание элемента

const { chromium } = require('playwright');
const assert = require('assert');

(async () => {
  const browser = await chromium.launch();
  const page = await browser.newPage();
  await page.goto('https://example.com');
  
  // Ожидание появления элемента на странице
  await page.waitForSelector('text=More information');

  const link = await page.$('text=More information');
  assert.ok(link); // Проверка, что элемент найден

  await browser.close();
})();

Здесь метод waitForSelector ожидает появления на странице элемента, содержащего текст “More information”. После этого происходит проверка наличия элемента.

Отладка

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

const { chromium } = require('playwright');

(async () => {
  const browser = await chromium.launch({ headless: false }); // Включение режима с визуализацией
  const page = await browser.newPage();
  await page.goto('https://example.com');
  
  // Добавьте дополнительные шаги для тестирования

  await browser.close();
})();

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

await page.pause(); // Тест приостановится на этом шаге

Использование других браузеров

Playwright поддерживает не только Chromium, но и Firefox и WebKit, что позволяет тестировать веб-приложения на разных движках браузеров. Для использования других браузеров достаточно изменить объект, который передается в метод launch:

const { firefox } = require('playwright'); // Для Firefox
const { webkit } = require('playwright');  // Для WebKit

// Пример с Firefox:
const browser = await firefox.launch();

Каждый браузер имеет свои особенности, которые могут повлиять на внешний вид или функциональность веб-приложения, поэтому важно тестировать приложение на нескольких движках.

Заключение

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

Оглавление