Проект автоматизации тестирования React приложения

Проект демонстрирует автоматизацию тестирования React приложения с использованием React Testing Library, Vitest и паттерна Page Object Model.

Описание

Приложение включает в себя:

• Форму регистрации пользователя с полями: email, пароль, адрес, город, страна, чекбокс принятия правил
• Интегрированный виджет чат-бота для взаимодействия с пользователем
• Покрытие тестами с использованием Page Object Model

Структура проекта

.
├── __fixtures__/          # Фикстуры для тестов
│   └── steps.js          # Шаги для чат-бота
├── __tests__/            # Тесты
│   ├── pages/            # Page Objects
│   │   ├── ChatbotPage.js
│   │   └── RegistrationFormPage.js
│   ├── utils/            # Утилиты для тестов
│   │   └── testHelpers.js
│   └── main.test.jsx    # Основные тесты
├── src/                  # Исходный код приложения
│   ├── App.jsx           # Главный компонент
│   └── main.jsx          # Точка входа
└── package.json

Технологии

• Vitest — фреймворк для тестирования
• React Testing Library — утилиты для тестирования React компонентов
• @hexlet/chatbot-v2 — виджет чат-бота

Установка

npm install

Запуск

Запуск приложения в режиме разработки

npm run dev

Запуск тестов

npm test

Линтинг

npm run lint

Покрытие тестами

Проект включает тесты для:

• Запуска и работы чат-бота
• Работы формы регистрации (заполнение, отправка, проверка результатов)
• Совместной работы виджета и формы
• Полного цикла навигации по чат-боту
• Крайних случаев (повторные клики, быстрые переходы, множественное открытие/закрытие)