# Неделя #5: Composition API

# Задачи на неделю

  1. Доделать оставшийся функционал страницы (страница профиля и подписок)
  2. Протестировать компоненты
  3. Использовать Composition API для создания компонентов

# План недели

  • Посмотреть видео-курс Composition API (36м)
  • Реализовать компоненты страницы профиля и подписок в стиле Composition API
  • Посмотреть видео-курс Тестирование JS-кода (51м)
  • Посмотреть видео-курс Vue.js. Тестирование компонентов (47м)
  • Посмотреть видео-курс Тестирование. Моки (13м)
  • Протестировать компонент ишьюз (issues) на главной страницы

# Options API vs. Composition API

  • "Классический" способ описания компонентов при помощи объекта с настройками использует Options API.

  • Описание компонента при помощи функций - Composition API

Изначально функционал Composition API позиционировался как основной при написании компонентов на Vue3. Но в последствии (из-за разногласий внутри сообщества) было решено что это станет альтернативным способом описания компонентов. Т.е его можно использовать и для создания простых компонентов, не обязательно для разделения или переиспользования логики. Какой способ использовать как основной остается за выбором каждой команды разработчиков.

# Тестирование компонента

Необходимо протестировать компонент отображения ишьюз (issues) на главной страницы.

Для этого нужно удостовериться что выполняются тесты для сл. кейсов:

  • При клике изменяется надпись Show/Hide issues
  • При клике выполняется запрос к серверу
  • Количество элементов внутри компонента соответствует количеству элементов пришедших в ответе
  • При многократном открытии/закрытии компонента не происходит повторных запросов
  • При установке пакетов убедитесь что установлена версия поддерживающая тестирование Vue3 компонентов
npm install --save-dev @vue/test-utils@next

# либо
yarn add --dev @vue/test-utils@next

←