Vitest UI

Vitest, построенный на Vite, использует Dev-сервер для запуска тестов. Это позволяет Vitest предоставлять удобный UI для просмотра и взаимодействия с вашими тестами. Vitest UI является опциональным, поэтому его необходимо установить отдельно:

bash

npm i -D @vitest/ui

Затем запустите тесты с UI, используя флаг --ui:

bash

vitest --ui

После этого вы сможете получить доступ к Vitest UI по адресу http://localhost:51204/__vitest__/

Начиная с Vitest 0.26.0, UI также можно использовать в качестве репортера. Чтобы сгенерировать HTML-отчет и просматривать результаты тестов, используйте репортер 'html' в вашей конфигурации Vitest:

// vitest.config.ts

export default {
  test: {
    reporters: ['html'],
  },
};

Начиная с Vitest 0.31.0, вы можете просматривать отчет о покрытии кода в Vitest UI. Подробную информацию см. в разделе Vitest UI Coverage.

WARNING

Чтобы видеть выполнение тестов в реальном времени в терминале, добавьте репортер default в массив reporters: ['default', 'html'].

TIP

Для просмотра HTML-отчета можно использовать команду vite preview:

npx vite preview --outDir ./html

Вывод можно настроить с помощью опции конфигурации outputFile. Необходимо указать путь к .html файлу. Например, ./html/index.html является значением по умолчанию.

Vitest UI ​

Vitest UI