Ожидание навигации и ответов

Иногда нужно дождаться не элемента, а события: перехода на новую страницу или ответа сервера.

Явное ожидание — это команда дождаться конкретного события (навигации, сетевого ответа, состояния загрузки), когда авто-ожиданий элемента недостаточно.

Зачем это нужно

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

Ожидание навигации: waitForURL

После действия, которое приводит к переходу, можно дождаться нужного адреса. Поддерживаются шаблоны с подстановкой (** — любой путь).

await page.getByRole('button', { name: 'Оформить заказ' }).click();
await page.waitForURL('**/order/confirmed');

// или сразу проверка адреса (тоже ждёт)
await expect(page).toHaveURL(/\/order\/confirmed/);

Часто отдельный waitForURL не нужен — expect(page).toHaveURL(...) сам подождёт нужный адрес и заодно сделает проверку, поэтому в тестах чаще пишут именно его.

Ожидание сетевого ответа

Иногда важно дождаться конкретного API-запроса — например, чтобы убедиться, что данные действительно ушли на сервер, и проверить код ответа. Правильный приём — сначала начать ждать ответ, потом выполнить действие. Иначе ответ может прийти раньше, чем мы начали слушать, и ожидание зависнет.

// начинаем ждать ответ ДО клика
const responsePromise = page.waitForResponse('**/api/orders');
await page.getByRole('button', { name: 'Сохранить' }).click();
const response = await responsePromise;

expect(response.status()).toBe(200);

Этот порядок — частая ловушка. Если поставить await page.waitForResponse(...) после клика, можно пропустить ответ и зависнуть до таймаута. Та же логика, что и с другими событиями: подписку оформляют до действия, которое событие порождает.

Ожидание состояния загрузки

waitForLoadState ждёт, пока страница достигнет определённого состояния. Применяется редко, потому что навигация и так ожидается автоматически при goto и кликах по ссылкам.

await page.goto('https://example.com');
await page.waitForLoadState('networkidle');  // пока сеть не утихнет

С networkidle будьте осторожны: на сайтах с постоянными фоновыми запросами (аналитика, опрос сервера, WebSocket) сеть может никогда не «утихнуть», и ожидание дойдёт до таймаута. Чаще лучше ждать конкретный элемент через expect — это и быстрее, и понятнее.

Итог

• Явные ожидания нужны для событий без элемента: навигации и сетевых ответов.
• Адрес чаще достаточно проверить через expect(page).toHaveURL — он сам ждёт.
• waitForResponse ставьте до действия, иначе пропустите ответ.
• networkidle ненадёжен на сайтах с фоновыми запросами — лучше ждать элемент.