Тест-кейси для мануального тестування UI

# Тест-кейси для мануального тестування UI

## Зміст

1. [Загальні тест-кейси](#1-загальні-тест-кейси)
2. [Реєстрація на подію](#2-реєстрація-на-подію)
3. [Процес оплати](#3-процес-оплати)
4. [Промокоди в UI](#4-промокоди-в-ui)
5. [Відображення подій](#5-відображення-подій)
6. [Навігація та UX](#6-навігація-та-ux)
7. [Responsive Design](#7-responsive-design)
8. [Помилки та валідація в UI](#8-помилки-та-валідація-в-ui)
9. [Email та повідомлення](#9-email-та-повідомлення)
10. [Відновлення платежу](#10-відновлення-платежу)

---

## 1. Загальні тест-кейси

### TC-UI-001: Перевірка завантаження головної сторінки

**Preconditions:**

- Браузер відкрито
- Користувач не автентифікований

**Steps:**

1. Відкрити головну сторінку додатку
2. Перевірити, що сторінка завантажилася без помилок
3. Перевірити відсутність помилок в консолі браузера (F12)
4. Перевірити, що всі зображення завантажилися
5. Перевірити, що шрифти відображаються коректно

**Expected Result:**

- Сторінка завантажується швидко (< 3 секунд)
- Немає помилок в консолі
- Всі елементи відображаються коректно
- Зображення не "ламаються"

---

### TC-UI-002: Перевірка відображення списку подій

**Preconditions:**

- Головна сторінка відкрита
- Є доступні події в системі

**Steps:**

1. Перевірити, що список подій відображається
2. Перевірити, що кожна подія містить:
   - Назву події
   - Дату та час
   - Місце проведення
   - Зображення (portrait або landscape)
   - Кнопку "Зареєструватися" або "Деталі"
3. Перевірити, що події відсортовані за датою (найближчі перші)
4. Перевірити, що події з минулими датами не відображаються (або відображаються окремо)

**Expected Result:**

- Всі події відображаються коректно
- Інформація читабельна
- Кнопки доступні для кліку

---

### TC-UI-003: Перевірка відображення деталей події

**Preconditions:**

- Список подій відображається

**Steps:**

1. Натиснути на подію або кнопку "Деталі"
2. Перевірити, що відкрилася сторінка з деталями події
3. Перевірити наявність:
   - Повної назви події
   - Опису події
   - Дати та часу
   - Місця проведення
   - Зображення (portrait/landscape)
   - Кількості вільних місць (якщо показується)
   - Ціни події
   - Списку спікерів (якщо є)
   - Партнерів (якщо є)
   - Кнопки "Зареєструватися"

**Expected Result:**

- Всі деталі відображаються коректно
- Зображення завантажуються
- Інформація читабельна та структурована

---

### TC-UI-004: Перевірка навігації назад

**Steps:**

1. Перейти зі списку подій на деталі події
2. Натиснути кнопку "Назад" або браузерну кнопку "Назад"
3. Перевірити, що повернулися до списку подій

**Expected Result:**

- Навігація працює коректно
- Стан сторінки зберігається (прокрутка, фільтри)

---

## 2. Реєстрація на подію

### TC-UI-REG-001: Відкриття форми реєстрації

**Preconditions:**

- Сторінка деталей події відкрита
- Подія має доступну місткість

**Steps:**

1. Натиснути кнопку "Зареєструватися"
2. Перевірити, що відкрилася форма реєстрації
3. Перевірити, що форма містить всі необхідні поля:
   - Ім'я (обов'язкове)
   - Прізвище (обов'язкове)
   - Email (обов'язкове)
   - Місто (обов'язкове)
   - Біговий клуб (опціональне)
   - Телефон (опціональне)
   - Промокод (опціональне)
4. Перевірити, що обов'язкові поля позначені (зіркочка або інший індикатор)

**Expected Result:**

- Форма відкривається швидко
- Всі поля присутні
- Обов'язкові поля чітко позначені
- Форма виглядає привабливо та зручно

---

### TC-UI-REG-002: Заповнення форми реєстрації з валідними даними

**Test Data:**

```
Ім'я: Іван
Прізвище: Петренко
Email: [email protected]
Місто: Київ
Біговий клуб: Київські бігуни
Телефон: +380501234567
```

**Steps:**

1. Заповнити всі поля валідними даними
2. Перевірити, що дані зберігаються при введенні
3. Перевірити, що немає помилок валідації
4. Натиснути кнопку "Зареєструватися" або "Продовжити"

**Expected Result:**

- Дані вводяться без проблем
- Валідація не спрацьовує доти, доки користувач не натисне кнопку
- Форма готова до відправки

---

### TC-UI-REG-003: Валідація поля "Ім'я"

**Steps:**

1. Залишити поле "Ім'я" порожнім
2. Натиснути кнопку "Зареєструватися"
3. Перевірити повідомлення про помилку: "Ім'я обов'язкове" або "Ім'я має містити мінімум 2 символи"
4. Ввести 1 символ
5. Перевірити повідомлення про помилку
6. Ввести 2 символи
7. Перевірити, що помилка зникла
8. Ввести 51 символ
9. Перевірити повідомлення про помилку: "Ім'я не може перевищувати 50 символів"

**Expected Result:**

- Помилки відображаються під полем або поруч з ним
- Повідомлення зрозумілі та українською мовою
- Помилки зникають після виправлення

---

### TC-UI-REG-004: Валідація поля "Прізвище"

**Steps:**

1. Повторити кроки з TC-UI-REG-003 для поля "Прізвище"

**Expected Result:**

- Аналогічно до поля "Ім'я"

---

### TC-UI-REG-005: Валідація поля "Email"

**Steps:**

1. Залишити поле "Email" порожнім
2. Натиснути кнопку "Зареєструватися"
3. Перевірити повідомлення: "Email обов'язковий"
4. Ввести невалідний email: "invalid-email"
5. Перевірити повідомлення: "Будь ласка, введіть валідну email адресу"
6. Ввести валідний email: "[email protected]"
7. Перевірити, що помилка зникла
8. Ввести email у верхньому регістрі: "[email protected]"
9. Перевірити, що email автоматично перетворюється на lowercase

**Expected Result:**

- Email валідується за форматом
- Регістр автоматично нормалізується
- Повідомлення зрозумілі

---

### TC-UI-REG-006: Валідація поля "Місто"

**Steps:**

1. Повторити кроки з TC-UI-REG-003 для поля "Місто" (мінімум 2 символи, максимум 100)

**Expected Result:**

- Аналогічно до інших обов'язкових полів

---

### TC-UI-REG-007: Валідація поля "Телефон" (опціональне)

**Steps:**

1. Залишити поле "Телефон" порожнім
2. Перевірити, що помилки немає (поле опціональне)
3. Ввести невалідний телефон: "abc123"
4. Перевірити повідомлення про помилку
5. Ввести валідний телефон: "+380501234567"
6. Перевірити, що помилка зникла
7. Ввести телефон з пробілами: "+380 50 123 45 67"
8. Перевірити, що прийнято
9. Ввести телефон з дужками: "(050) 123-45-67"
10. Перевірити, що прийнято

**Expected Result:**

- Поле опціональне, але валідується, якщо заповнене
- Різні формати телефонів приймаються
- Повідомлення зрозумілі

---

### TC-UI-REG-008: Валідація поля "Біговий клуб" (опціональне)

**Steps:**

1. Залишити поле порожнім
2. Перевірити, що помилки немає
3. Ввести текст довжиною 101 символ
4. Перевірити повідомлення про помилку

**Expected Result:**

- Поле опціональне
- Максимальна довжина валідується

---

### TC-UI-REG-009: Успішна відправка форми реєстрації

**Preconditions:**

- Форма заповнена валідними даними
- Подія має доступну місткість

**Steps:**

1. Заповнити всі обов'язкові поля
2. Натиснути кнопку "Зареєструватися"
3. Перевірити, що показується індикатор завантаження (spinner або disabled кнопка)
4. Дочекатися відповіді від сервера
5. Перевірити, що відображається повідомлення про успіх або автоматичне перенаправлення

**Expected Result:**

- Форма відправляється
- Показується індикатор завантаження
- Після успіху відображається повідомлення або перенаправлення

---

### TC-UI-REG-010: Відображення помилки при заповненій події

**Preconditions:**

- Подія досягла максимальної місткості

**Steps:**

1. Заповнити форму реєстрації
2. Натиснути "Зареєструватися"
3. Перевірити повідомлення про помилку: "Подія заповнена" або "Немає вільних місць"

**Expected Result:**

- Помилка відображається зрозуміло
- Користувач може повернутися назад

---

### TC-UI-REG-011: Відображення помилки при дублікаті email

**Preconditions:**

- Користувач з таким email вже зареєстрований на подію (confirmed)

**Steps:**

1. Заповнити форму з email, який вже зареєстрований
2. Натиснути "Зареєструватися"
3. Перевірити повідомлення: "Цей email вже зареєстрований на цю подію"

**Expected Result:**

- Помилка відображається
- Користувач розуміє, що вже зареєстрований

---

### TC-UI-REG-012: Відображення помилки мережі

**Preconditions:**

- Вимкнути інтернет або симулювати помилку мережі

**Steps:**

1. Заповнити форму
2. Вимкнути інтернет
3. Натиснути "Зареєструватися"
4. Перевірити повідомлення про помилку мережі

**Expected Result:**

- Показується зрозуміле повідомлення про помилку мережі
- Користувач може спробувати знову

---

### TC-UI-REG-013: Відображення помилки валідації з сервера

**Preconditions:**

- Сервер повертає помилки валідації

**Steps:**

1. Заповнити форму з невалідними даними (які проходять клієнтську валідацію)
2. Натиснути "Зареєструватися"
3. Перевірити, що помилки з сервера відображаються біля відповідних полів

**Expected Result:**

- Помилки відображаються коректно
- Користувач розуміє, що потрібно виправити

---

## 3. Процес оплати

### TC-UI-PAY-001: Перенаправлення на сторінку оплати

**Preconditions:**

- Реєстрація успішно створена
- Payment link отримано від сервера

**Steps:**

1. Після успішної реєстрації перевірити, що відображається повідомлення
2. Перевірити, що є кнопка "Перейти до оплати" або автоматичне перенаправлення
3. Натиснути кнопку або дочекатися перенаправлення
4. Перевірити, що відкрилася сторінка Monobank для оплати

**Expected Result:**

- Перенаправлення працює коректно
- Сторінка Monobank відкривається
- URL містить правильні параметри

---

### TC-UI-PAY-002: Відображення інформації про оплату перед перенаправленням

**Preconditions:**

- Реєстрація створена

**Steps:**

1. Після реєстрації перевірити, що відображається:
   - Сума до оплати
   - Назва події
   - Дата події
   - Кнопка "Оплатити"
2. Перевірити, що інформація коректна

**Expected Result:**

- Вся інформація відображається
- Дані коректні
- Кнопка доступна

---

### TC-UI-PAY-003: Повернення з успішної оплати (success URL)

**Preconditions:**

- Користувач завершив оплату на Monobank
- Monobank перенаправляє на success URL

**Steps:**

1. Завершити оплату на Monobank
2. Дочекатися перенаправлення на success URL
3. Перевірити, що відображається сторінка успіху
4. Перевірити наявність:
   - Повідомлення "Оплату успішно завершено!"
   - Деталі реєстрації
   - Інформація про подію
   - Кнопка "Повернутися на головну" або "Мої реєстрації"

**Expected Result:**

- Сторінка успіху відображається
- Вся інформація коректна
- Навігація працює

---

### TC-UI-PAY-004: Повернення з невдалої оплати (failure URL)

**Preconditions:**

- Користувач скасував оплату або оплата не вдалася
- Monobank перенаправляє на failure URL

**Steps:**

1. Скасувати оплату на Monobank
2. Дочекатися перенаправлення на failure URL
3. Перевірити, що відображається сторінка невдачі
4. Перевірити наявність:
   - Повідомлення "Оплату не вдалося завершити"
   - Причина (якщо доступна)
   - Кнопка "Спробувати знову"
   - Кнопка "Повернутися на головну"

**Expected Result:**

- Сторінка невдачі відображається
- Користувач розуміє, що сталося
- Можна спробувати знову

---

### TC-UI-PAY-005: Відображення статусу оплати на сторінці реєстрації

**Preconditions:**

- Користувач має реєстрацію
- Є сторінка "Мої реєстрації" або подібна

**Steps:**

1. Перейти на сторінку "Мої реєстрації"
2. Перевірити, що відображається статус оплати:
   - "Очікує оплати" (pending)
   - "Оплачено" (completed)
   - "Оплата не вдалася" (failed)
3. Перевірити, що для pending є кнопка "Сплатити"

**Expected Result:**

- Статуси відображаються коректно
- Кольори або іконки допомагають розрізнити статуси
- Кнопки доступні

---

### TC-UI-PAY-006: Відображення деталей платежу

**Preconditions:**

- Реєстрація з оплатою існує

**Steps:**

1. Перейти на сторінку деталей реєстрації
2. Перевірити наявність:
   - Сума оплати
   - Валюта
   - Дата оплати
   - Статус оплати
   - ID платежу (якщо показується)

**Expected Result:**

- Вся інформація відображається
- Дані коректні

---

## 4. Промокоди в UI

### TC-UI-PROMO-001: Введення промокоду в форму реєстрації

**Steps:**

1. Відкрити форму реєстрації
2. Знайти поле "Промокод" (якщо воно приховане, знайти кнопку "Є промокод?")
3. Ввести промокод: "DISCOUNT10"
4. Перевірити, що промокод зберігається
5. Перевірити, що промокод автоматично перетворюється на uppercase

**Expected Result:**

- Поле промокоду доступне
- Промокод нормалізується
- Дані зберігаються

---

### TC-UI-PROMO-002: Застосування валідного промокоду

**Preconditions:**

- Промокод "DISCOUNT10" існує та валідний
- Event basePrice = 1000

**Steps:**

1. Заповнити форму реєстрації
2. Ввести промокод "DISCOUNT10"
3. Натиснути кнопку "Застосувати" (якщо є) або просто продовжити
4. Перевірити, що відображається:
   - Повідомлення "Промокод застосовано!"
   - Початкова ціна
   - Знижка
   - Фінальна ціна (зменшена)
5. Перевірити, що фінальна ціна = 900 (якщо знижка 10%)

**Expected Result:**

- Промокод застосовується
- Ціна оновлюється
- Відображається розбивка ціни

---

### TC-UI-PROMO-003: Відображення помилки для невалідного промокоду

**Steps:**

1. Ввести неіснуючий промокод: "INVALID"
2. Натиснути "Застосувати" або продовжити реєстрацію
3. Перевірити повідомлення: "Промокод невалідний або прострочений"
4. Перевірити, що ціна не змінилася

**Expected Result:**

- Помилка відображається зрозуміло
- Ціна залишається без змін

---

### TC-UI-PROMO-004: Відображення помилки для простроченого промокоду

**Preconditions:**

- Промокод існує, але прострочений

**Steps:**

1. Ввести прострочений промокод
2. Перевірити повідомлення: "Промокод прострочений"

**Expected Result:**

- Помилка відображається

---

### TC-UI-PROMO-005: Відображення помилки для промокоду з досягнутим лімітом

**Preconditions:**

- Промокод існує, але досягнув usageLimit

**Steps:**

1. Ввести промокод, який вже використано максимальну кількість разів
2. Перевірити повідомлення: "Промокод вже використано максимальну кількість разів"

**Expected Result:**

- Помилка відображається

---

### TC-UI-PROMO-006: Відображення розбивки ціни з промокодом

**Preconditions:**

- Промокод застосовано

**Steps:**

1. Перевірити, що відображається:
   - "Базова ціна: 1000 UAH"
   - "Знижка: -100 UAH (10%)"
   - "До оплати: 900 UAH"
2. Перевірити, що числа коректні

**Expected Result:**

- Розбивка відображається зрозуміло
- Всі суми коректні

---

### TC-UI-PROMO-007: Видалення промокоду

**Steps:**

1. Ввести промокод
2. Перевірити, що є кнопка "Видалити" або "Очистити" біля промокоду
3. Натиснути кнопку
4. Перевірити, що промокод видалено
5. Перевірити, що ціна повернулася до базової

**Expected Result:**

- Промокод можна видалити
- Ціна оновлюється

---

### TC-UI-PROMO-008: Промокод з 100% знижкою

**Preconditions:**

- Промокод дає 100% знижку

**Steps:**

1. Ввести промокод зі 100% знижкою
2. Перевірити, що фінальна ціна = 0
3. Перевірити, що відображається "Безкоштовно" або "0 UAH"

**Expected Result:**

- Ціна = 0
- Відображається коректно

---

## 5. Відображення подій

### TC-UI-EVENT-001: Відображення зображень подій

**Steps:**

1. Перейти на сторінку зі списком подій
2. Перевірити, що кожна подія має зображення
3. Перевірити, що зображення завантажуються
4. Перевірити, що зображення не спотворені
5. Перевірити, що є fallback (placeholder), якщо зображення не завантажилося

**Expected Result:**

- Зображення відображаються коректно
- Немає спотворень
- Fallback працює

---

### TC-UI-EVENT-002: Відображення portrait та landscape зображень

**Preconditions:**

- Подія має обидва типи зображень

**Steps:**

1. Перевірити, що на картці події використовується правильне зображення (portrait або landscape)
2. Перевірити, що на сторінці деталей відображається відповідне зображення
3. Перевірити, що зображення адаптуються до розміру екрана

**Expected Result:**

- Правильне зображення використовується
- Адаптація працює

---

### TC-UI-EVENT-003: Відображення партнерів події

**Preconditions:**

- Подія має партнерів

**Steps:**

1. Перейти на сторінку деталей події
2. Знайти секцію "Партнери"
3. Перевірити, що відображаються:
   - Логотипи партнерів
   - Назви партнерів (якщо є)
4. Перевірити, що логотипи завантажуються

**Expected Result:**

- Партнери відображаються
- Логотипи коректні

---

### TC-UI-EVENT-004: Відображення спікерів події

**Preconditions:**

- Подія має спікерів

**Steps:**

1. Перейти на сторінку деталей події
2. Знайти секцію "Спікери"
3. Перевірити, що для кожного спікера відображається:
   - Фото
   - Ім'я
   - Короткий опис
   - Посилання на Instagram (якщо є)

**Expected Result:**

- Спікери відображаються коректно
- Вся інформація присутня

---

### TC-UI-EVENT-005: Відображення кількості вільних місць

**Preconditions:**

- Подія має обмежену місткість

**Steps:**

1. Перевірити, що відображається інформація про місткість:
   - "Залишилося X місць"
   - Або "X з Y місць зайнято"
2. Перевірити, що інформація оновлюється після реєстрацій

**Expected Result:**

- Інформація відображається
- Дані актуальні

---

### TC-UI-EVENT-006: Відображення ціни події

**Steps:**

1. Перевірити, що ціна відображається на картці події та на сторінці деталей
2. Перевірити формат: "1000 UAH" або "1 000 ₴"
3. Перевірити, що для безкоштовних подій відображається "Безкоштовно"

**Expected Result:**

- Ціна відображається коректно
- Формат зрозумілий

---

## 6. Навігація та UX

### TC-UI-NAV-001: Навігація між сторінками

**Steps:**

1. Перевірити наявність навігаційного меню (header)
2. Перевірити, що є посилання на:
   - Головну сторінку
   - Список подій
   - Мої реєстрації (якщо автентифікований)
3. Перевірити, що навігація працює

**Expected Result:**

- Навігація доступна
- Всі посилання працюють

---

### TC-UI-NAV-002: Breadcrumbs (якщо є)

**Steps:**

1. Перейти на сторінку деталей події
2. Перевірити наявність breadcrumbs: "Головна > Події > Назва події"
3. Натиснути на будь-який елемент breadcrumbs
4. Перевірити, що перехід працює

**Expected Result:**

- Breadcrumbs відображаються
- Навігація працює

---

### TC-UI-NAV-003: Пошук подій (якщо є)

**Steps:**

1. Знайти поле пошуку
2. Ввести назву події
3. Перевірити, що результати фільтруються
4. Очистити пошук
5. Перевірити, що всі події відображаються знову

**Expected Result:**

- Пошук працює
- Результати коректні

---

### TC-UI-NAV-004: Фільтрація подій (якщо є)

**Steps:**

1. Знайти фільтри (за датою, місцем тощо)
2. Застосувати фільтр
3. Перевірити, що події відфільтровані
4. Зняти фільтр
5. Перевірити, що всі події відображаються

**Expected Result:**

- Фільтри працюють
- Результати коректні

---

### TC-UI-NAV-005: Пагінація (якщо є)

**Preconditions:**

- Є більше подій, ніж поміщається на одній сторінці

**Steps:**

1. Перевірити наявність пагінації
2. Натиснути "Наступна сторінка"
3. Перевірити, що завантажилися нові події
4. Натиснути "Попередня сторінка"
5. Перевірити, що повернулися до попередніх подій

**Expected Result:**

- Пагінація працює
- Навігація зручна

---

### TC-UI-NAV-006: Скрол до форми реєстрації

**Preconditions:**

- Сторінка деталей події має форму реєстрації внизу

**Steps:**

1. Натиснути кнопку "Зареєструватися" вгорі сторінки
2. Перевірити, що сторінка плавно прокручується до форми
3. Перевірити, що форма видима та доступна

**Expected Result:**

- Плавний скрол працює
- Форма доступна

---

### TC-UI-NAV-007: Збереження стану форми при навігації

**Steps:**

1. Заповнити частину форми реєстрації
2. Перейти на іншу сторінку
3. Повернутися назад
4. Перевірити, що дані збережені (якщо реалізовано)

**Expected Result:**

- Дані зберігаються (якщо це частина UX)
- Або форма очищається (якщо це бажана поведінка)

---

## 7. Responsive Design

### TC-UI-RESP-001: Відображення на мобільному пристрої (320px - 480px)

**Preconditions:**

- Відкрити DevTools браузера
- Увімкнути режим мобільного пристрою

**Steps:**

1. Встановити ширину екрана 375px (iPhone)
2. Перевірити, що всі елементи відображаються коректно
3. Перевірити, що текст читабельний
4. Перевірити, що кнопки достатньо великі для натискання
5. Перевірити, що форма реєстрації зручна для заповнення
6. Перевірити, що навігація працює (hamburger menu, якщо є)

**Expected Result:**

- Всі елементи адаптуються
- Текст читабельний
- Кнопки доступні
- Форма зручна

---

### TC-UI-RESP-002: Відображення на планшеті (768px - 1024px)

**Steps:**

1. Встановити ширину екрана 768px (iPad)
2. Перевірити адаптацію всіх елементів
3. Перевірити, що використовується оптимальний layout

**Expected Result:**

- Layout адаптується
- Елементи розташовані оптимально

---

### TC-UI-RESP-003: Відображення на десктопі (1024px+)

**Steps:**

1. Встановити ширину екрана 1920px
2. Перевірити, що контент не розтягується занадто широко
3. Перевірити, що використовується максимальна ширина (якщо є обмеження)

**Expected Result:**

- Контент не розтягується занадто
- Layout збалансований

---

### TC-UI-RESP-004: Орієнтація екрана (portrait/landscape)

**Steps:**

1. На мобільному пристрої перевірити portrait орієнтацію
2. Повернути пристрій в landscape
3. Перевірити, що всі елементи адаптуються
4. Перевірити, що форма та контент читабельні

**Expected Result:**

- Адаптація працює в обох орієнтаціях
- Контент читабельний

---

### TC-UI-RESP-005: Touch targets на мобільних

**Steps:**

1. На мобільному пристрої перевірити розмір кнопок
2. Перевірити, що кнопки достатньо великі (мінімум 44x44px)
3. Перевірити, що між кнопками достатньо простору

**Expected Result:**

- Кнопки легко натискати
- Немає випадкових кліків

---

## 8. Помилки та валідація в UI

### TC-UI-ERROR-001: Відображення помилок валідації в реальному часі

**Steps:**

1. Відкрити форму реєстрації
2. Почати вводити email
3. Ввести невалідний формат
4. Перевірити, що помилка відображається одразу (якщо реалізовано real-time validation)
5. Виправити email
6. Перевірити, що помилка зникає

**Expected Result:**

- Валідація працює в реальному часі (якщо реалізовано)
- Помилки зникають після виправлення

---

### TC-UI-ERROR-002: Відображення помилок після submit

**Steps:**

1. Заповнити форму з помилками
2. Натиснути "Зареєструватися"
3. Перевірити, що всі помилки відображаються одночасно
4. Перевірити, що сторінка прокручується до першої помилки

**Expected Result:**

- Всі помилки видимі
- Навігація до помилок працює

---

### TC-UI-ERROR-003: Відображення загальних помилок

**Preconditions:**

- Сервер повертає загальну помилку

**Steps:**

1. Виконати дію, яка викликає помилку сервера
2. Перевірити, що відображається загальне повідомлення про помилку
3. Перевірити, що повідомлення зрозуміле та українською мовою

**Expected Result:**

- Помилка відображається
- Повідомлення зрозуміле

---

### TC-UI-ERROR-004: Відображення помилок мережі

**Steps:**

1. Вимкнути інтернет
2. Спробувати виконати дію (реєстрація, завантаження подій)
3. Перевірити повідомлення: "Помилка мережі. Перевірте підключення до інтернету"
4. Увімкнути інтернет
5. Спробувати знову
6. Перевірити, що все працює

**Expected Result:**

- Помилка мережі відображається
- Можна спробувати знову

---

### TC-UI-ERROR-005: Відображення timeout помилок

**Preconditions:**

- Симулювати повільне з'єднання

**Steps:**

1. Виконати дію, яка займає багато часу
2. Перевірити, що показується індикатор завантаження
3. Дочекатися timeout
4. Перевірити повідомлення про timeout

**Expected Result:**

- Timeout обробляється
- Повідомлення зрозуміле

---

### TC-UI-ERROR-006: Відображення 404 помилки

**Steps:**

1. Перейти на неіснуючу URL: `/events/nonexistent`
2. Перевірити, що відображається сторінка 404
3. Перевірити наявність кнопки "Повернутися на головну"

**Expected Result:**

- Сторінка 404 відображається
- Навігація доступна

---

### TC-UI-ERROR-007: Відображення 500 помилки

**Preconditions:**

- Симулювати помилку сервера

**Steps:**

1. Виконати дію, яка викликає 500 помилку
2. Перевірити повідомлення: "Щось пішло не так. Спробуйте пізніше"
3. Перевірити, що є можливість спробувати знову

**Expected Result:**

- Помилка відображається
- Користувач розуміє, що робити

---

## 9. Email та повідомлення

### TC-UI-EMAIL-001: Перевірка отримання email з payment link

**Preconditions:**

- Реєстрація створена
- Email налаштовано

**Steps:**

1. Створити реєстрацію
2. Перевірити email скриньку
3. Знайти email з темою "Завершіть вашу реєстрацію - {eventTitle}"
4. Перевірити, що email містить:
   - Привітання українською
   - Деталі події
   - Суму до оплати
   - Кнопку "Завершити оплату"
   - Текстове посилання
5. Натиснути на кнопку або посилання
6. Перевірити, що відкривається сторінка Monobank

**Expected Result:**

- Email надіслано
- Всі елементи присутні
- Посилання працює

---

### TC-UI-EMAIL-002: Перевірка email з підтвердженням

**Preconditions:**

- Оплата завершена успішно

**Steps:**

1. Завершити оплату
2. Перевірити email скриньку
3. Знайти email з темою "Реєстрацію підтверджено - {eventTitle}"
4. Перевірити, що email містить:
   - Підтвердження реєстрації
   - Деталі події
   - Суму оплати
   - ID реєстрації

**Expected Result:**

- Email надіслано
- Вся інформація присутня

---

### TC-UI-EMAIL-003: Перевірка email про невдалу оплату

**Preconditions:**

- Оплата не вдалася

**Steps:**

1. Скасувати оплату або симулювати невдачу
2. Перевірити email скриньку
3. Знайти email з темою "Оплата не вдалася - {eventTitle}"
4. Перевірити, що email містить:
   - Повідомлення про невдачу
   - Причину (якщо доступна)
   - Посилання для повторної спроби

**Expected Result:**

- Email надіслано
- Посилання працює

---

### TC-UI-EMAIL-004: Відображення повідомлення про надсилання email

**Preconditions:**

- Реєстрація створена

**Steps:**

1. Після створення реєстрації перевірити, що відображається повідомлення:
   - "Ми надіслали посилання на оплату на вашу email адресу"
   - "Перевірте вашу пошту"
2. Перевірити, що повідомлення зникає через кілька секунд (якщо реалізовано)

**Expected Result:**

- Повідомлення відображається
- Користувач розуміє, що робити далі

---

## 10. Відновлення платежу

### TC-UI-RECOV-001: Відображення опції "Відновити оплату" при повторній реєстрації

**Preconditions:**

- Користувач має pending реєстрацію
- Користувач намагається зареєструватися знову

**Steps:**

1. Спробувати зареєструватися з email, який вже має pending реєстрацію
2. Перевірити, що замість помилки відображається:
   - Повідомлення "У вас вже є незавершена реєстрація"
   - Кнопка "Продовжити оплату"
3. Натиснути кнопку
4. Перевірити, що відкривається сторінка оплати

**Expected Result:**

- Опція відновлення доступна
- Перехід працює

---

### TC-UI-RECOV-002: Сторінка "Відновити оплату"

**Preconditions:**

- Є окрема сторінка для відновлення оплати

**Steps:**

1. Перейти на сторінку "Відновити оплату"
2. Ввести email та eventId
3. Натиснути "Знайти реєстрацію"
4. Перевірити, що знайдено pending реєстрацію
5. Перевірити, що відображається payment link
6. Натиснути "Перейти до оплати"

**Expected Result:**

- Сторінка працює
- Payment link отримано
- Перехід працює

---

### TC-UI-RECOV-003: Відображення помилки, якщо pending реєстрації немає

**Steps:**

1. Ввести email, який не має pending реєстрації
2. Натиснути "Знайти реєстрацію"
3. Перевірити повідомлення: "Не знайдено незавершеної реєстрації"

**Expected Result:**

- Помилка відображається
- Повідомлення зрозуміле

---

### TC-UI-RECOV-004: Автоматичне перенаправлення на оплату при повторній реєстрації

**Preconditions:**

- Користувач має pending реєстрацію

**Steps:**

1. Заповнити форму реєстрації з тим самим email
2. Натиснути "Зареєструватися"
3. Перевірити, що автоматично відкривається сторінка оплати (без повідомлення про помилку)

**Expected Result:**

- Автоматичне перенаправлення працює
- Користувач не бачить помилку

---

### TC-UI-RECOV-005: Відображення інформації про pending реєстрацію

**Preconditions:**

- Користувач має pending реєстрацію

**Steps:**

1. Перейти на сторінку "Мої реєстрації"
2. Знайти pending реєстрацію
3. Перевірити, що відображається:
   - Статус "Очікує оплати"
   - Кнопка "Сплатити"
   - Дата створення реєстрації
4. Натиснути "Сплатити"
5. Перевірити, що відкривається сторінка оплати

**Expected Result:**

- Вся інформація відображається
- Кнопка працює

---

## 11. Додаткові тест-кейси

### TC-UI-EXTRA-001: Перевірка доступності (Accessibility)

**Steps:**

1. Перевірити, що всі кнопки мають aria-labels
2. Перевірити, що форми мають labels
3. Перевірити навігацію з клавіатури (Tab, Enter, Escape)
4. Перевірити контрастність кольорів
5. Перевірити, що можна збільшити текст (zoom)

**Expected Result:**

- Сайт доступний
- Навігація з клавіатури працює
- Контраст достатній

---

### TC-UI-EXTRA-002: Перевірка швидкості завантаження

**Steps:**

1. Відкрити DevTools > Network
2. Очистити кеш
3. Завантажити головну сторінку
4. Перевірити час завантаження (< 3 секунд)
5. Перевірити розмір завантажених ресурсів

**Expected Result:**

- Сторінка завантажується швидко
- Розмір ресурсів оптимізований

---

### TC-UI-EXTRA-003: Перевірка кешування

**Steps:**

1. Завантажити сторінку
2. Оновити сторінку (F5)
3. Перевірити, що статичні ресурси завантажуються з кешу
4. Перевірити, що динамічний контент оновлюється

**Expected Result:**

- Кешування працює
- Контент актуальний

---

### TC-UI-EXTRA-004: Перевірка роботи в різних браузерах

**Browsers to test:**

- Chrome (остання версія)
- Firefox (остання версія)
- Safari (остання версія)
- Edge (остання версія)

**Steps:**

1. Відкрити сайт в кожному браузері
2. Перевірити основні функції:
   - Реєстрація
   - Оплата
   - Навігація
3. Перевірити, що немає критичних помилок

**Expected Result:**

- Сайт працює в усіх браузерах
- Немає критичних помилок

---

### TC-UI-EXTRA-005: Перевірка роботи офлайн

**Steps:**

1. Завантажити сторінку
2. Вимкнути інтернет
3. Спробувати виконати дію
4. Перевірити, що відображається повідомлення про відсутність інтернету

**Expected Result:**

- Офлайн режим обробляється
- Повідомлення зрозуміле

---

### TC-UI-EXTRA-006: Перевірка інтеграції з соціальними мережами (якщо є)

**Steps:**

1. Знайти кнопки "Поділитися" (якщо є)
2. Натиснути на кнопку
3. Перевірити, що відкривається відповідна соціальна мережа
4. Перевірити, що посилання та опис коректні

**Expected Result:**

- Інтеграція працює
- Дані коректні

---

## 12. Чек-лист для мануального тестування

### Перед початком тестування

- [ ] Налаштовано тестове середовище
- [ ] Створено тестові події
- [ ] Створено тестові промокоди
- [ ] Налаштовано тестові email адреси
- [ ] Налаштовано Monobank test API
- [ ] Підготовлено різні пристрої для responsive тестування

### Після тестування

- [ ] Всі критичні тест-кейси пройдено
- [ ] Задокументовано всі знайдені баги
- [ ] Перевірено роботу в різних браузерах
- [ ] Перевірено responsive design
- [ ] Перевірено accessibility
- [ ] Перевірено performance

---

## Примітки

1. **Тестові дані**: Використовуйте реальні тестові дані, які відповідають бізнес-вимогам.

2. **Скріншоти**: Рекомендується робити скріншоти при знаходженні багів.

3. **Логи**: Перевіряйте консоль браузера (F12) на наявність помилок JavaScript.

4. **Network**: Перевіряйте Network tab для перевірки API запитів та відповідей.

5. **Мобільні пристрої**: Якщо можливо, тестуйте на реальних пристроях, а не тільки в DevTools.

6. **Кросс-браузерне тестування**: Перевіряйте в усіх основних браузерах.

7. **Accessibility**: Використовуйте інструменти типу Lighthouse для перевірки доступності.

8. **Performance**: Використовуйте Lighthouse або WebPageTest для перевірки продуктивності.