Перейти к основному содержанию

Timeline Reporter

wdio-timeline-reporter - это сторонний пакет, для получения дополнительной информации смотрите GitHub | npm

Универсальный WebdriverIO репортер для агрегированной визуализации результатов ваших тестов, потому что "Лучше один раз увидеть"

example.png

Почему​

Потому что мы тратим много времени на отладку неудачных тестов, переключаясь между выводом терминала и просмотром скриншотов ошибок и т.д. Этот репортер объединяет всю типичную информацию, которая вам потребуется, в один отчет. Запускайте тесты и получайте удобную временную шкалу событий, к которой можно вернуться, чтобы дополнительно проверить, что всё выглядит нормально.

Возможности включают:​

  • Отлично работает с фреймворками Mocha и Jasmine. Также работает с Cucumber, но каждый шаг будет отображаться как тест
  • Наглядная сводка результатов тестирования.
  • Подробности каждого тестового запуска, включая все скриншоты, сделанные во время выполнения теста.
  • Фильтрация результатов тестов. Отлично подходит для фокусировки на неудачных тестах
  • К тесту прилагается трассировка стека ошибок.
  • Возможность добавления дополнительной информации к тесту во время выполнения.
  • Постобработка не требуется. По завершении процесса тестирования wdio будет сгенерирован статический html-файл отчета.
  • Сервис Timeline для управления снимками экрана, включая изменение размера изображений.

Пример html-отчета можно найти здесь

Инструкции по установке WebdriverIO можно найти здесь.

Установка​

ДЛЯ ВЕРСИИ, СОВМЕСТИМОЙ С WEBDRIVERIO V4, СМОТРИТЕ ЗДЕСЬ

npm install --save wdio-timeline-reporter

Зависимость будет добавлена в ваш package.json

{
"dependencies": {
"wdio-timeline-reporter": "^5.1.0"
}
}

Использование​

Добавьте timeline в массив reporters в вашем конфигурационном файле wdio.

Также импортируйте и добавьте TimelineService из wdio-timeline-reporter.

Сервис является обязательным для объединения отчетов и создания html, так как репортеры теперь инициализируются для каждого экземпляра запуска в webdriverio 5. См. открытое обсуждение по webdriverio

TimelineService также может управлять снимками экрана во время выполнения тестов. У вас есть возможность уменьшить размер и качество изображений и встроить изображения в отчет как base64. Эти параметры настраиваются с помощью опций репортера.

// wdio.conf.js
const { TimelineService } = require('wdio-timeline-reporter/timeline-service');
exports.config = {
// ...
reporters: [['timeline', { outputDir: './desired_location' }]],
// ...
services: [[TimelineService]]
};

Опции репортера​

Если вы хотите переопределить конфигурацию репортера по умолчанию, добавьте объект reporterOptions в массив timeline в разделе reporters, как показано ниже.

reporter-options.png

индексописание
1.Директория, где будут созданы html-файл и скриншоты. Обязательная опция
2.Имя html-файла отчета. Значение по умолчанию - timeline-report.html
3.Встраивать изображения как base64 в html-файл. Значение по умолчанию - false
4.Опции объекта для манипуляции изображениями
5.Установить качество JPEG. Актуально только если опция resize - true. Чем меньше значение, тем меньше размер и качество изображения. Значение по умолчанию - 70. Максимально допустимое значение - 100
6.Изменять размер изображения. Значение по умолчанию - false
7.Значение для уменьшения общего количества пикселей. Актуально только если опция resize - true. По умолчанию 1. Допустимые значения 1 - 5
8.Как часто делать скриншоты. Поддерживаемые значения: on:error, before:click, none. По умолчанию none. before:click - отличный вариант для создания временной шкалы скриншотов тестируемого приложения.

Добавление дополнительной информации в контекст теста​

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

Базовое использование​

Статический метод TimelineReporter.addContext принимает либо строковый параметр, либо объект с двумя свойствами title и value, например

{ title: 'sessionId', value: 'b59bb9ec-ab15-475e-9ce6-de8a14ca0cd3' }

value также может быть ссылкой

Пример Mocha​
const TimelineReporter = require('wdio-timeline-reporter').default;

describe('Suite', function() {
it('Test', function() {
// объект в качестве параметра
TimelineReporter.addContext({
title: 'Test User',
value: 'user id created during the test'
});

// значение как тег якоря
TimelineReporter.addContext({
title: 'Dynamic link',
value: '<a href="">Some important link related to test</a>'
});

// строковый параметр
TimelineReporter.addContext('This test might be flaky');
});
});

Благодарности​

Хотелось бы выразить благодарность авторам и сопровождающим wdio-json-reporter. Изучение их решения для v5 помогло ускорить мою работу

Welcome! How can I help?

WebdriverIO AI Copilot