Встроенные отчеты Cypress

Cypress предоставляет мощный встроенный механизм генерации отчётов, который облегчает анализ результатов тестирования и выявление проблем. В отличие от классических инструментов, где отчёты требуют отдельной настройки, Cypress сразу предоставляет информацию о каждом тесте в интерактивном виде и поддерживает интеграцию с внешними форматами для автоматизации CI/CD процессов.

Форматы отчётов

Cypress поддерживает несколько форматов отчетности:

  • HTML – интерактивные отчёты с визуализацией структуры тестов, шагов и скриншотов.
  • JSON – структурированные данные о результатах тестирования, удобные для дальнейшей обработки и интеграции с внешними инструментами.
  • JUnit – стандартный формат для CI-систем, позволяет подключать результаты тестов в Jenkins, GitLab CI и других платформах.

Для генерации внешних отчётов часто используют cypress-mochawesome-reporter, который позволяет создавать наглядные HTML и JSON отчёты с подробной информацией о каждом тесте, включая скриншоты и видео.

Скриншоты и видео

Cypress автоматически сохраняет скриншоты и видео при падении тестов, что критически важно для отладки.

  • Скриншоты фиксируются при ошибках теста или могут быть сняты вручную с помощью команды cy.screenshot().
  • Видео записываются по умолчанию для всех прогонов тестов через CLI, если включена соответствующая опция в cypress.json ("video": true).
  • Скриншоты и видео сохраняются в директории cypress/screenshots и cypress/videos соответственно, что упрощает отслеживание ошибок в автоматических тестах.

Настройка отчётов

Для полноценного использования встроенных отчётов и интеграции с CI необходимо выполнить несколько шагов:

  1. Установка и подключение плагинов:

    npm install --save-dev mochawesome mochawesome-merge mochawesome-report-generator

    Затем подключение в файле cypress/plugins/index.js:

    const mochawesome = require('mochawesome');
module.exports = (on, config) => {
    on('after:run', (results) => {
        // обработка результатов после прогонов
    });
};

  2. Конфигурация генерации отчётов в cypress.json или cypress.config.js:

    {
  "reporter": "mochawesome",
  "reporterOptions": {
    "reportDir": "cypress/reports",
    "overwrite": false,
    "html": true,
    "json": true
  }
}

    Это позволит автоматически создавать читаемые HTML-отчёты и JSON-файлы для последующего анализа.

  3. Интеграция с CI/CD:

    • Использование mochawesome-merge для объединения отчётов из параллельных прогонов.

    • Генерация финального HTML с помощью marge:

      mochawesome-merge cypress/reports/*.json > cypress/reports/report.json
marge cypress/reports/report.json

    Такой подход обеспечивает централизованное хранение результатов и удобное отображение статистики тестирования.

Доступ к результатам тестов в коде

Cypress позволяет анализировать результаты тестов программно через объект Cypress.runner, что удобно для создания кастомных отчётов или интеграции с внешними системами.

Пример проверки статуса тестов после прогонов:

Cypress.on('test:after:run', (test, runnable) => {
    if (test.state === 'failed') {
        console.log(`Тест ${test.title} завершился с ошибкой`);
        // Возможна отправка уведомления или запись в кастомный лог
    }
});

Основные преимущества встроенных отчётов

  • Наглядность – визуальная структура тестов с пошаговыми действиями и скриншотами.
  • Автоматизация – отчёты можно автоматически интегрировать в CI/CD, упрощая контроль качества.
  • Гибкость – поддержка различных форматов: HTML, JSON, JUnit.
  • Детализация – информация о каждом тесте, включая продолжительность, ошибки, скриншоты и видео.

Использование встроенных отчётов Cypress позволяет построить прозрачный и детализированный процесс тестирования, минимизируя время на выявление проблем и обеспечивая высокий контроль над качеством приложений.

Оглавление