Ожидание сетевых запросов

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

Роль ожидания сетевых запросов

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

Методы ожидания сетевых запросов

Playwright предоставляет несколько методов для работы с сетевыми запросами и их ожиданиями. Рассмотрим наиболее часто используемые из них.

Ожидание ответа от конкретного запроса

Один из способов ожидания — это использование метода page.waitForResponse(), который позволяет ожидать завершение ответа от конкретного запроса. Этот метод полезен, когда нужно убедиться, что определённый сетевой запрос успешно завершился.

Пример:

const response = await page.waitForResponse('https://example.com/api/data');
console.log('Ответ на запрос:', response.status());

Метод waitForResponse() принимает в качестве аргумента URL, регулярное выражение или функцию фильтрации. Он будет ждать, пока не поступит ответ на запрос, соответствующий условию. После этого можно обработать ответ (например, проверить его статус).

Ожидание нескольких ответов

Если в тестируемом приложении происходит несколько сетевых запросов, можно использовать Promise.all(), чтобы дождаться завершения всех запросов. Для этого нужно использовать несколько вызовов page.waitForResponse() в сочетании с асинхронным ожиданием.

Пример:

const requests = [
  page.waitForResponse('https://example.com/api/data1'),
  page.waitForResponse('https://example.com/api/data2')
];

await Promise.all(requests);
console.log('Оба запроса завершены');

Этот подход позволяет синхронизировать тест с несколькими запросами, ожидая их завершения одновременно.

Ожидание запросов, соответствующих условию

Если необходимо ожидать запросы, которые соответствуют определённому шаблону (например, все POST-запросы к API), можно воспользоваться фильтрацией с использованием функций. Метод page.waitForRequest() может быть полезен для этого.

Пример:

await page.waitForRequest(request => request.method() === 'POST' && request.url().includes('/api'));
console.log('Запрос POST к API завершён');

Этот метод позволяет задать более сложные условия для отслеживания сетевых запросов, например, фильтровать их по методу или URL.

Ожидание запросов перед действиями

В некоторых случаях требуется выполнить определённое действие (клик, отправка формы и т. п.), после чего нужно дождаться завершения сетевых запросов перед проверками или дальнейшими действиями. В таких случаях можно использовать метод page.waitForRequest() перед выполнением действия.

Пример:

const [response] = await Promise.all([
  page.waitForResponse('https://example.com/api/submit'),
  page.click('#submit-button')
]);

console.log('Запрос завершён с кодом ответа:', response.status());

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

Работа с сетевыми запросами во время навигации

При тестировании навигации важно правильно синхронизировать выполнение теста с завершением всех сетевых запросов, которые происходят при загрузке новой страницы. Это можно сделать с помощью методов page.waitForNavigation() в сочетании с ожиданием сетевых запросов.

Пример:

const [response] = await Promise.all([
  page.waitForResponse('https://example.com/api/initial-data'),
  page.goto('https://example.com/new-page')
]);

console.log('Запрос завершён при переходе на страницу');

В данном примере тест сначала ожидает сетевой запрос, а затем выполняет навигацию на новую страницу. Ожидание запросов при навигации позволяет избежать состояния, когда запросы ещё не завершились, а тест уже пытается проверить данные.

Ожидание ошибок в сетевых запросах

В процессе тестирования важно уметь проверять не только успешные ответы, но и ошибки, которые могут возникнуть при запросах. Для этого можно использовать метод waitForResponse() в сочетании с проверкой кода ответа.

Пример:

const response = await page.waitForResponse('https://example.com/api/error');
if (response.status() !== 200) {
  console.log('Произошла ошибка:', response.status());
}

Этот метод позволяет обработать ошибки и убедиться, что приложение корректно реагирует на них.

Работа с запросами и заголовками

Playwright также позволяет проверять заголовки запросов и ответов, что полезно для тестирования безопасности и корректности взаимодействия с сервером. Для этого можно использовать методы request.headers() и response.headers().

Пример:

const response = await page.waitForResponse('https://example.com/api/data');
const headers = response.headers();
if (headers['content-type'] !== 'application/json') {
  console.log('Неверный тип контента:', headers['content-type']);
}

Такой подход позволяет контролировать правильность заголовков и проводить тестирование API с учётом этих данных.

Обработка времени ожидания

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

Пример:

try {
  await page.waitForResponse('https://example.com/api/data', { timeout: 5000 });
} catch (error) {
  console.log('Тайм-аут ожидания ответа:', error);
}

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

Заключение

Ожидание сетевых запросов в Playwright — важная часть процесса тестирования, особенно когда работа приложения зависит от взаимодействия с сервером. Методы, такие как waitForResponse(), waitForRequest(), и различные фильтрации, позволяют точно синхронизировать тесты с состоянием приложения. Правильное использование этих методов помогает избежать ошибок, связанных с асинхронной природой веб-приложений, и позволяет создавать стабильные и надёжные тесты.

Оглавление