Встроенные отчёты Protractor

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

Настройка встроенных отчётов

В Protractor отчёты формируются с помощью фреймворка Jasmine (или Mocha) и их возможностей по созданию Reporter-ов. По умолчанию Jasmine выводит результаты тестов в консоль, но для удобства анализа можно подключать различные встроенные репортеры.

Пример подключения стандартного консольного репортера:

exports.config = {
  framework: 'jasmine',
  specs: ['specs/**/*.spec.js'],
  
  onPrepare: function () {
    const JasmineReporters = require('jasmine-reporters');
    
    jasmine.getEnv().addReporter(
      new JasmineReporters.JUnitXmlReporter({
        savePath: 'test-results',
        consolidateAll: false
      })
    );
  }
};

Ключевые моменты:

  • onPrepare выполняется перед запуском тестов, что позволяет подключить репортеры.
  • JUnitXmlReporter формирует XML-файлы, которые легко интегрируются в CI/CD.
  • savePath указывает путь для хранения отчётов.
  • consolidateAll: false создаёт отдельный файл для каждого теста, что удобно для анализа.

Встроенные возможности Protractor

Protractor сам по себе не имеет отдельного механизма отчётности — он использует возможности фреймворков Jasmine или Mocha. Встроенные функции включают:

  • Консольный вывод результатов: jasmine.ConsoleReporter или встроенный вывод Mocha.
  • Поддержка JUnit XML формата: полезно для интеграции с Jenkins или TeamCity.
  • Настраиваемые хук-функции: onPrepare, beforeLaunch, afterLaunch, позволяющие подключать отчёты до и после выполнения тестов.

Расширенные репортеры

Для более наглядной визуализации результатов можно использовать расширенные репортеры, поддерживающие HTML и графику:

const HtmlReporter = require('protractor-beautiful-reporter');

exports.config = {
  framework: 'jasmine',
  specs: ['specs/**/*.spec.js'],

  onPrepare: function () {
    jasmine.getEnv().addReporter(
      new HtmlReporter({
        baseDirectory: 'reports',
        screenshotsSubfolder: 'images',
        takeScreenShotsOnlyForFailedSpecs: true
      }).getJasmine2Reporter()
    );
  }
};

Особенности:

  • baseDirectory — корневая папка для отчётов.
  • screenshotsSubfolder — отдельная папка для скриншотов.
  • takeScreenShotsOnlyForFailedSpecs — делает скриншоты только при падении теста, экономя место и ускоряя процесс.

Генерация скриншотов

Protractor позволяет автоматически сохранять скриншоты при падении теста. Это особенно важно для end-to-end тестирования динамических элементов Angular-приложений:

afterEach(async function () {
  const spec = jasmine.getEnv().currentSpec;
  if (spec.status === 'failed') {
    const png = await browser.takeScreenshot();
    const fs = require('fs');
    const path = `reports/screenshots/${spec.fullName}.png`;
    fs.writeFileSync(path, png, { encoding: 'base64' });
  }
});

Пояснения:

  • afterEach вызывается после каждого теста.
  • browser.takeScreenshot() возвращает изображение в формате base64.
  • Скриншоты помогают выявлять визуальные ошибки интерфейса и корректность работы динамических элементов.

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

Встроенные отчёты Protractor и репортеры легко интегрируются с системами CI/CD. Основные шаги:

  1. Формирование отчётов в формате XML или HTML.
  2. Настройка пайплайна для копирования или публикации отчётов.
  3. Настройка уведомлений о падениях тестов на основе результатов репортов.

Пример для Jenkins:

jasmine.getEnv().addReporter(
  new JasmineReporters.JUnitXmlReporter({
    savePath: 'test-results',
    consolidateAll: true
  })
);

Jenkins автоматически читает XML-файлы и формирует графики успешности тестов.

Настройка уровней детализации

Protractor позволяет настраивать уровень логирования и детализацию отчётов через фреймворки:

  • jasmine-spec-reporter — выводит подробную информацию по каждому тесту с указанием ошибок и времени выполнения.
  • verbose режим — отображает шаги каждого теста и стек-трейсы ошибок.
const SpecReporter = require('jasmine-spec-reporter').SpecReporter;

jasmine.getEnv().clearReporters();
jasmine.getEnv().addReporter(new SpecReporter({
  spec: {
    displayStacktrace: true,
    displayDuration: true
  }
}));

Основные рекомендации

  • Использовать JUnitXmlReporter для CI/CD интеграции.
  • Применять HTML-репортеры для наглядного визуального анализа.
  • Настраивать скриншоты для упрощения диагностики падений.
  • Контролировать уровни логирования через SpecReporter для детализированного отчёта о каждом тесте.
  • Хранить отчёты и скриншоты в отдельной структуре папок для удобного доступа и автоматической публикации.

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

Оглавление