[Перевод] Ускоряем e2e-тесты с помощью playwright-network-cache
Проблема сетевых запросов в e2e-тестах
Сетевые запросы часто являются самой медленной частью при выполнении e2e-тестов. При запуске большого количества тестов, повторяющиеся запросы к внешним API могут стать бутылочным горлышком, значительно увеличивая время прогона. Кроме того, реальные API могут быть нестабильными, с периодическими таймаутами, делая ваши тесты хрупкими и ненадежными.
Стандартный подход к этой проблеме — мокирование ответов API. Оно значительно ускоряет выполнение тестов, но требует дополнительный действий: нужно тщательно создавать мок-ответы, поддерживать их в актуальном состоянии и обеспечивать обработку каждого возможного сетевого сценария. Это может стать проблемой по мере развития API или изменения бизнес-требований. Частично эту задачу решают HAR-файлы, позволяя захватывать и воспроизводить сетевой трафик веб-страницы. Но работа с HAR-файлами в Playwright имеет свои минусы и не дает достаточной гибкости.
Библиотека playwright-network-cache
Библиотека playwright-network-cache позволяет автоматически кэшировать сетевые ответы в Playwright тестах и устраняет необходимость в ручных моках или HAR-файлах. Сетевые ответы сохраняются на файловой системе при первом запуске теста и повторно используются в последующих запусках. Более того, ответы сохраняются в понятной древовидной структуре папок, что облегчает отладку тестов.
Как это решает проблему
Автоматическое кэширование: Библиотека автоматически кэширует сетевые ответы при первом запуске тестов. Это означает, что в будущих запусках ваши тесты не будут ждать ответа от внешних API — вместо этого будут использоваться кэшированные данные, что приводит к более быстрым и надежным тестам.
Настраиваемая длительность кэша (TTL): Вы можете контролировать, как долго кэшированный файл сохраняется, установив время жизни (TTL). После истечения указанного времени библиотека снова обращается к реальному API и обновляет кэш, сохраняя ваши тестовые данные актуальными.
Подмена ответов: Нужно подменить ответ для конкретного теста?
playwright-network-cache
позволяет на лету изменять тело ответа без необходимости ручных правок в мок-файлах.Гибкая структура папок: Система кэширования организует файлы на основе имени хоста, метода запроса и пути URL, обеспечивая легкую навигацию и управление кэшированными данными. Для более сложных случаев вы можете разделить файлы по параметрам запроса, телу запроса или другим данным, обеспечивая гибкость в хранении и применении кеша для конкретных кейсов.
Ускорение тестов: Повторно используя кэшированные ответы, тесты больше не ждут ответа от реальных API и выполняются значительно быстрее. Это особенно полезно при работе с большими наборами тестов или при запуске в CI-средах, где ресурсы ограничены.
Управление моками: Забудьте о ручном написании моков. Библиотека всё берёт на себя — от кэширования до воспроизведения и подмены ответов. Вам больше не нужно вручную создавать мок-ответы для каждого сценария, и вы можете сосредоточиться на логике ваших тестов.
Без HAR: HAR-файлы могут быть полезны для записи и воспроизведения сетевых взаимодействий, но они быстро становятся громоздкими, особенно когда нужно изменить ответы.
playwright-network-cache
предоставляет более гибкую альтернативу HAR, позволяя управлять отдельными ответами как JSON-файлами.
Пример
Представьте, что вы тестируете приложение, которое получает список котиков из API. Без кэширования каждый запуск теста будет делать запрос к реальному API, что может быть медленным и ненадежным.
Шаг 1: Установка библиотеки
npm install -D playwright-network-cache
Шаг 2: Настройка фикстуры cacheRoute
Создайте файл fixtures.js
и добавьте следующий код:
// fixtures.js
import { test as base } from '@playwright/test';
import { CacheRoute } from 'playwright-network-cache';
export const test = base.extend({
cacheRoute: async ({ page }, use) => {
const cacheRoute = new CacheRoute(page, { /* cache options */ });
await use(cacheRoute);
},
});
Шаг 3: Использование фикстуры в тесте
// example.spec.js
import { test } from './fixtures';
test('Получение списка котиков', async ({ page, cacheRoute }) => {
await cacheRoute.GET('https://example.com/api/cats', {
ttlMinutes: 60, // Обновлять кэш каждые 60 минут
});
await page.goto('https://example.com');
// Дополнительные действия в тесте...
});
При первом запуске ответ кэшируется в директории .network-cache
со структурой:
.network-cache
└── example.com
└── api-cats
└── GET
├── headers.json
└── body.json
В последующих запусках будет использоваться кэшированный ответ, что значительно ускорит выполнение теста.
Изменение кэшированного ответа
Если вам нужно изменить ответ для конкретного теста:
test('Измененный список котиков', async ({ page, cacheRoute }) => {
await cacheRoute.GET('https://example.com/api/cats', {
modify: async (route, response) => {
const json = await response.json();
json[0].name = 'Барсик';
await route.fulfill({ json });
},
});
await page.goto('https://example.com');
// Дополнительные действия в тесте...
});
В документации библиотеки есть множество других примеров и вариантов использования.
Не только кэширование
playwright-network-cache
— это не только про кэширование. Он предлагает продвинутые функции:
Обработка HTTP статусов и ошибок
Отключение или обновление кэша при необходимости
Изоляция кэш-файлов для отдельных тестов
Заключение
Если вы хотите сделать ваши Playwright тесты более быстрыми и надежными, попробуйте playwright-network-cache. Благодаря кэшированию сетевых ответов на файловой системе, вы получаете гибкую и простую альтернативу HAR-файлам.
Спасибо за внимание ❤️