💸 Як тестувати AI-фічі і не збанкрутувати на API-ключах OpenAI

Уявіть: у вас є Angular -фронтенд, який через NestJS бекенд стукає до GPT-4, щоб згенерувати користувачу звіт.

Ви пишете E2E тест. Він працює. Але коли ваш CI/CD починає ганяти цей тест 50 разів на день, ви отримуєте три проблеми:

1️⃣ Гроші: Кожен запуск спалює ваш бюджет на OpenAI API.

2️⃣ Швидкість: Відповідь від LLM може займати 10-20 секунд. Тести стають нестерпно довгими.

3️⃣ Flakiness (нестабільність): Сервери OpenAI іноді лягають або віддають 500-ту помилку. Ваш тест падає, хоча ваш власний код працює ідеально.

Рішення: Жорсткий Mocking AI-запитів у Playwright

Щоб перевірити, як ваш UI рендерить відповідь від ШІ, чи правильно працює markdown-розмітка та як обробляються помилки, вам не потрібен реальний ШІ.

Ми перехоплюємо запит від фронтенду до нашого бекенду і підсовуємо йому заздалегідь підготовлену "фейкову" відповідь нейромережі.

Як це реалізувати (Playwright Network Interception):
test('UI коректно рендерить згенерований AI звіт', async ({ page }) => {
// 1. Перехоплюємо запит до нашого NestJS API
await page.route('**/api/v1/generate-report', async route => {
// 2. Імітуємо ідеальну відповідь від AI без звернення до реального OpenAI
const mockAiResponse = {
status: 'success',
data: {
content: '## Ваш звіт готовий\n\n- Знайдено 3 проблеми.\n- Оптимізація можлива.',
tokensUsed: 150
}
};

// 3. Віддаємо мок назад у браузер
await route.fulfill({
status: 200,
contentType: 'application/json',
body: JSON.stringify(mockAiResponse)
});
});

// 4. Тригеримо генерацію в UI
await page.getByRole('button', { name: 'Згенерувати звіт' }).click();

// 5. Перевіряємо, чи Angular правильно відрендерив markdown (відповідь прийде миттєво!)
await expect(page.locator('h2')).toHaveText('Ваш звіт готовий');
});

Що ми отримали?
Час виконання тесту впав з 15 секунд до 0.5 секунди. Вартість прогону — $0. Ви ізолювали свою систему від нестабільності стороннього AI-провайдера. Реальне підключення до OpenAI залишається тільки для одного-двох інтеграційних тестів, а весь E2E шар покривається моками.

А як ви тестуєте функціонал, зав'язаний на платних API?

👇
🔥 — Мокаю все, що рухається, через page.route!
👀 — Ганяю реальні запити, компанія платить за API.
🤯 — Чекаю по 20 секунд у кожному тесті...