Allure отчёты для Playwright: настройка расширенной отчётности

Встроенный HTML-репортер Playwright не показывает пошаговую разбивку, не хранит историю трендов между CI-запусками и не позволяет связать падения с трекером задач. Allure добавляет всё это через адаптер allure-playwright, который записывает сырые результаты для последующей компиляции в интерактивный отчёт с графиками трендов и категориями падений. Здесь разобраны установка, настройка в playwright.config.ts, генерация отчётов локально и интеграция с GitHub Actions.

Что даёт Allure

Тест-сьюты, организованные по файлу, describe-блоку и названию теста
Timeline с отображением параллельного выполнения тестов
Пошаговая разбивка того что произошло в каждом тесте
Вложения: скриншоты, видео, логи консоли прямо в отчёте
Тренды: показатели pass/fail по нескольким запускам
Информация об окружении: какой браузер, ОС, версия приложения тестировались
Категории: группировка падений по типу (баги продукта, баги тестов, флаки)

Установка

# Устанавливаем адаптер Allure Playwright
npm install -D allure-playwright

# Устанавливаем Allure CLI для генерации и просмотра отчётов
npm install -D allure-commandline

Или устанавливаем Allure CLI глобально:

npm install -g allure-commandline

Конфигурация

Добавляем Allure как репортер в playwright.config.ts:

import { defineConfig } from '@playwright/test';

export default defineConfig({
  reporter: [
    ['list'],                // Вывод в консоль во время запуска
    ['allure-playwright'],   // Генерация Allure-отчёта
  ],
  
  // Опционально: дополнительная конфигурация Allure
  // reporter: [
  //   ['allure-playwright', {
  //     detail: true,
  //     outputFolder: 'allure-results',
  //     suiteTitle: false,
  //   }],
  // ],
});

Репортер записывает сырые результаты в allure-results/ во время запуска тестов. Затем из этих результатов генерируется HTML-отчёт.

Запуск и просмотр отчётов

# Запускаем тесты (результаты записываются в allure-results/)
npx playwright test

# Генерируем HTML-отчёт
npx allure generate allure-results --clean -o allure-report

# Открываем в браузере
npx allure open allure-report

Или объединяем генерацию и открытие:

npx allure generate allure-results --clean && npx allure open allure-report

Добавь в package.json для удобства:

{
  "scripts": {
    "test": "npx playwright test",
    "report": "npx allure generate allure-results --clean -o allure-report && npx allure open allure-report"
  }
}

Затем: npm test && npm run report

Добавление шагов в тесты

Allure показывает пошаговые разбивки если аннотировать код:

import { test, expect } from '@playwright/test';
import { allure } from 'allure-playwright';

test('successful login', async ({ page }) => {
  await allure.step('Navigate to login page', async () => {
    await page.goto('/login');
  });
  
  await allure.step('Enter credentials', async () => {
    await page.fill('[data-testid="email"]', 'user@test.com');
    await page.fill('[data-testid="password"]', 'ValidPass1');
  });
  
  await allure.step('Submit login form', async () => {
    await page.click('[data-testid="submit"]');
  });
  
  await allure.step('Verify redirect to dashboard', async () => {
    await expect(page).toHaveURL('/dashboard');
    await expect(page.getByTestId('welcome')).toBeVisible();
  });
});

В Allure-отчёте каждый шаг отображается отдельно со статусом pass/fail.

Добавление метаданных

Аннотируй тесты метаданными для удобной организации и фильтрации:

test('payment with valid card', async ({ page }) => {
  // Метки для фильтрации и группировки
  allure.label('feature', 'Checkout');
  allure.label('story', 'Credit card payment');
  allure.severity('critical');  // 'blocker' | 'critical' | 'normal' | 'minor' | 'trivial'
  allure.owner('qa-team');
  
  // Ссылки на задачи и тест-кейсы
  allure.issue('PROJ-123', 'https://jira.mycompany.com/PROJ-123');
  allure.tmsLink('TC-456', 'https://testrail.mycompany.com/TC-456');
  
  // Описание
  allure.description('Verify that valid Stripe test card completes purchase');
  
  // Теги
  allure.tag('smoke');
  allure.tag('payment');
  
  // ... код теста
});

Вложение скриншотов и файлов

import { allure } from 'allure-playwright';
import * as fs from 'fs';

test('verifies page layout', async ({ page }) => {
  await page.goto('/dashboard');
  
  // Прикрепляем скриншот вручную
  const screenshot = await page.screenshot();
  await allure.attachment('Dashboard screenshot', screenshot, 'image/png');
  
  // Прикрепляем текстовый файл
  const logContent = 'Test started at: ' + new Date().toISOString();
  await allure.attachment('Test log', Buffer.from(logContent), 'text/plain');
  
  // Прикрепляем JSON-данные
  const apiResponse = { status: 'ok', users: 42 };
  await allure.attachment(
    'API response',
    Buffer.from(JSON.stringify(apiResponse, null, 2)),
    'application/json'
  );
});

Скриншоты при падении прикрепляются автоматически если настроено в playwright.config.ts:

use: {
  screenshot: 'only-on-failure',
  video: 'retain-on-failure',
}

Информация об окружении

Добавляй детали окружения чтобы в отчёте было видно что тестировалось:

// В playwright.config.ts или global setup
// Создаём файл allure-results/environment.properties

// global-setup.ts
import * as fs from 'fs';
import * as path from 'path';

export default async function globalSetup() {
  const envProps = [
    `BASE_URL=${process.env.BASE_URL || 'http://localhost:3000'}`,
    `ENV=${process.env.TEST_ENV || 'local'}`,
    `BROWSER=chromium`,
    `APP_VERSION=${process.env.APP_VERSION || 'unknown'}`,
  ].join('\n');
  
  fs.mkdirSync('allure-results', { recursive: true });
  fs.writeFileSync(path.join('allure-results', 'environment.properties'), envProps);
}

Это отображается в разделе Environment Allure-отчёта.

Конфигурация категорий

Категории группируют падения тестов по типу. Создай allure-results/categories.json:

[
  {
    "name": "Product Bugs",
    "messageRegex": ".*Expected.*",
    "matchedStatuses": ["failed"]
  },
  {
    "name": "Test Infrastructure Issues",
    "messageRegex": ".*net::ERR.*|.*Navigation timeout.*|.*Connection refused.*",
    "matchedStatuses": ["failed", "broken"]
  },
  {
    "name": "Test Flakiness",
    "matchedStatuses": ["flaky"]
  }
]

Allure автоматически категоризирует падения по паттернам сообщений об ошибках.

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

GitHub Actions

- name: Run Playwright tests
  run: npx playwright test

- name: Generate Allure report
  if: always()
  run: npx allure generate allure-results --clean -o allure-report

- name: Upload Allure report
  uses: actions/upload-artifact@v4
  if: always()
  with:
    name: allure-report
    path: allure-report/
    retention-days: 30

- name: Upload raw results (for trend data)
  uses: actions/upload-artifact@v4
  if: always()
  with:
    name: allure-results
    path: allure-results/

Allure TestOps (облачная версия)

Для постоянной истории трендов между CI-запусками Allure TestOps (платный сервис) хранит результаты централизованно. Бесплатная альтернатива: загружай артефакты allure-results из предыдущих запусков и включай их в следующую команду allure generate.

Playwright Report vs Allure

Функция	Playwright HTML	Allure
Требуется настройка	Нет	Установка + шаг генерации
Пошаговая разбивка	Нет	Да (с аннотациями)
История трендов	Нет	Да
Категории	Нет	Да (настраиваемые)
Ссылки на внешние инструменты	Нет	Да (Jira, TestRail)
Лучше подходит для	Быстрое ежедневное использование	Отчёты для стейкхолдеров, история CI

Встроенный отчёт Playwright используй локально для быстрой обратной связи. Allure в CI подходит для постоянной истории и отчётности для стейкхолдеров.

Итог

# Установка
npm install -D allure-playwright allure-commandline

# Конфигурация в playwright.config.ts
reporter: [['allure-playwright']]

# Запуск, генерация, просмотр
npx playwright test
npx allure generate allure-results --clean
npx allure open allure-report

Ключевые возможности для использования:

allure.step() для читаемой разбивки теста
allure.severity() и метки для фильтрации
allure.issue() для связи падений с трекером задач
Свойства окружения для документирования что тестировалось

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

→ См. также: Отчёты тестов Playwright: встроенный HTML против Allure | Отчёты о тестах в CI: форматы, инструменты и интеграция | GitHub Actions для тестов Playwright: полная настройка (2026)