Тестирование TODO-приложения
Тестирование полноценного React-приложения с помощью React Testing Library внутри Jest. Здесь вы научитесь правильно организовывать тестовую инфраструктуру, изолировать бекенд и писать надежные тесты, которые достаточного легко отлаживать.
Цель
Независимо от используемых инструментов и способов организации кода, разработка фронтенд-проектов, в своей основе, базируется на одних и тех же принципах и технологиях. На нижнем уровне любое фронтенд-приложение работает с большим и сложным DOM API браузера, в который сейчас входит всё, начиная от манипулирования внешним видом страницы, до взаимодействия с бэкендом и базами данных прямо в браузере.
Ещё один краеугольный камень фронтенд-разработки – Ajax. Выполнение HTTP-запросов само по себе – процесс несложный, но здесь много тонкостей. Во-первых, в этом месте появляется асинхронный JavaScript, а значит, и работа с промисами, и обработка ошибок. Во-вторых, любое внешнее взаимодействие в браузере неразрывно связано с безопасностью, о которой нужно иметь хорошее представление. Иначе легко попасть в ситуацию, когда проект взломают.
Чтобы протестировать всё это, понадобится хороший инструментарий для выполнения множества задач:
- семантической выборки элементов со страницы;
- выполнения тестами действий как пользователь;
- мокинг сетевых запросов и возвращение подготовленных данных;
- проверка ожидаемого с действительным;
- ... и многое другое.
Все эти темы и инструменты раскрываются в данном проекте.
Описание
ToDo List – программа для создания списков и отметки выполненных пунктов. Такие программы часто применяются как списки дел или покупок. Зачастую подобные программы имеют веб-версию и мобильное приложение, а синхронизируются они благодаря бэкенду, который хранит списки каждого пользователя в своей базе данных. Бэкенд при этом является типичным REST API, отдающим данные любому авторизированному клиенту.
Задачей этого проекта является тестирование типового ToDo List, обладающего web-интерфейсом и взаимодействующим с бэкендом по сети.
Наставники



Проекты входят в стоимость обучения на любом плане: самостоятельном, групповом и индивидуальном. Дополнительно платить не нужно.
Проекты дают опыт разработки в реальной среде. Проходите каждый проект сразу после изучения курсов, которые стоят в учебном плане перед ним, — это отличный способ глубже разобраться в материале.
Проекты — портфолио программиста. Их код останется в вашем аккаунте на GitHub и будет преимуществом при поиске работы.
Чтобы узнать о том, что такое проекты и в чём их польза, прочитайте нашу статью «Анатомия проектов Хекслета».
Задавайте вопросы в разделе «Обсуждение» на странице шага, на котором возникли трудности, или вашему наставнику. Изучите вопросы других студентов в «Обсуждениях»: там собрана большая база знаний, ей можно и нужно пользоваться.
Автоматизированные тесты и линтер. В групповом и индивидуальном форматах наставник дополнительно проверит то, что тестами проверить невозможно (архитектуру проекта, правильность именования, удачность решений), и проведёт код-ревью, чтобы сделать проект ещё качественнее.
Нажмите на виджет в правом нижнем углу экрана и поищите ответ в нашей справке. Или сразу пишите на support@hexlet.io — вам ответит живой человек из команды Хекслета.