Запись видео тестов

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

Основные подходы к записи видео

Существует несколько способов организации записи видео при тестировании с WebdriverIO:

  1. Использование плагинов WebdriverIO Плагин @wdio/video-reporter позволяет автоматически сохранять видеозаписи тестов в заданной директории. Видео создаются только для неудачных тестов или для всех тестов в зависимости от конфигурации.

  2. Интеграция с внешними утилитами Можно использовать сторонние инструменты для захвата экрана, например ffmpeg, для записи сессий браузера. В этом случае WebdriverIO управляет запуском и завершением записи через хуки beforeSession и afterTest.

  3. Docker-контейнеры с записью видео В средах CI/CD, таких как Jenkins или GitLab, часто используется Selenium Grid в Docker. В таких контейнерах можно включить запись видео с помощью утилит вроде selenium-video-node или VNC с захватом экрана.

Настройка @wdio/video-reporter

Для использования видеорепортера необходимо установить пакет:

npm install @wdio/video-reporter --save-dev

В конфигурационном файле WebdriverIO (wdio.conf.js) подключение выглядит следующим образом:

const video = require('@wdio/video-reporter');

exports.config = {
    reporters: [
        'spec',
        [video, {
            saveAllVideos: false,       // Сохранять видео только для неудачных тестов
            videoSlowdownMultiplier: 3, // Увеличивает продолжительность видео для медленных тестов
            outputDir: './videos/'      // Директория для сохранения видео
        }]
    ],
    ...
};

Ключевые параметры:

  • saveAllVideos – если true, будут сохраняться все видео, иначе только неудачные.
  • videoSlowdownMultiplier – замедляет видео для удобного анализа.
  • outputDir – путь к директории для хранения файлов.

Использование хуков для кастомизации

WebdriverIO предоставляет множество хуков, которые позволяют управлять процессом записи:

  • beforeTest – можно запускать внешнюю утилиту записи перед тестом.
  • afterTest – остановка записи и сохранение видео.
  • onComplete – очистка временных файлов или генерация отчетов с ссылками на видео.

Пример кастомного подхода с использованием ffmpeg:

const { execSync } = require('child_process');

beforeTest(() => {
    execSync('ffmpeg -y -video_size 1280x720 -f x11grab -i :99.0 ./videos/test.mp4', { stdio: 'ignore' });
});

afterTest(() => {
    execSync('pkill ffmpeg', { stdio: 'ignore' });
});

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

Форматы и оптимизация видео

Наиболее популярные форматы для хранения видео тестов:

  • MP4 (H.264) – баланс качества и размера файла, поддерживается большинством проигрывателей.
  • WebM – оптимизирован для веб-отображения, меньший размер, но не всегда поддерживается внешними системами CI.

Для оптимизации больших тестовых сессий можно использовать videoSlowdownMultiplier и уменьшать разрешение видео, чтобы снизить нагрузку на CI-сервер и объем хранилища.

Интеграция с отчетами

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

afterTest(async (test) => {
    if (!test.passed) {
        const videoPath = `./videos/${test.title}.mp4`;
        await browser.call(() => attachVideoToReport(videoPath));
    }
});

Функция attachVideoToReport добавляет ссылку на видео в отчет, что позволяет просматривать выполнение тестов напрямую из интерфейса отчета.

Практические рекомендации

  • Сохранять видео только для неудачных тестов, чтобы экономить ресурсы.
  • Уменьшать разрешение при работе на CI/CD.
  • Использовать автоматическую генерацию имен файлов с датой и временем, чтобы избежать перезаписи.
  • Проверять совместимость форматов с отчетами и браузерами, на которых выполняются тесты.
  • При использовании Docker учитывать ограничения контейнера по захвату видео и доступ к дисплею.

Запись видео тестов в WebdriverIO обеспечивает визуальный контроль качества и упрощает отладку сложных сценариев. Правильная настройка плагинов и интеграция с отчетами делают процесс удобным и эффективным.

Оглавление