GitHub Actions для Автоматизации QA

К концу этого туториала у вас будет полностью автоматизированный QA-конвейер, работающий в GitHub Actions, который выполняет тесты при каждом коммите, генерирует отчеты и уведомляет вашу команду о сбоях. Всего за 60 минут вы трансформируете ручные процессы тестирования в систему непрерывного обеспечения качества, которая экономит часы повторяющейся работы.

Что вы Построите

Вы создадите CI/CD конвейер GitHub Actions, который автоматически:

• Запускает unit, интеграционные и end-to-end тесты на pull request’ах
• Выполняет тесты в нескольких окружениях (версии Node.js, браузеры, ОС)
• Генерирует отчеты о покрытии тестами и загружает их в Codecov
• Отправляет Slack-уведомления при сбоях тестов
• Создает preview-развертывания для ручного QA-тестирования
• Реализует умные повторные попытки для нестабильных тестов

Это решает распространенную проблему QA с несогласованным выполнением тестов и задержанной обратной связью. С GitHub Actions каждое изменение кода запускает автоматизированные проверки качества, обнаруживая баги до их попадания в production.

Цели Обучения

В этом туториале вы узнаете:

• Как настроить workflows GitHub Actions для тестирования
• Как реализовать матричные стратегии для кроссплатформенного тестирования
• Как интегрировать сторонние инструменты тестирования (Playwright, Cypress, Jest)
• Как кэшировать зависимости для ускорения выполнения workflow
• Как реализовать условные шаги на основе результатов тестов
• Как защитить секреты и API-ключи в GitHub Actions

Оценка времени: 60-90 минут

Предварительные Требования

Требуемое ПО

Перед началом установите:

Установка:

# macOS
brew install git node gh

# Linux (Ubuntu/Debian)
sudo apt update
sudo apt install git nodejs npm

# Windows (используя Chocolatey)
choco install git nodejs gh

Требуемые Знания

Вы должны быть знакомы с:

• Основами Git (commit, push, pull requests)
• Базовым синтаксисом YAML
• Основами тестирования JavaScript/TypeScript (Jest, Mocha или подобные)
• Не требуется: Продвинутые концепции DevOps

Требуемые Ресурсы

• Аккаунт GitHub (бесплатного тарифа достаточно)
• Репозиторий с существующим набором тестов
• Текстовый редактор (рекомендуется VS Code)

Шаг 1: Создайте Ваш Первый Workflow GitHub Actions

На этом шаге мы создадим базовый workflow, который запускает тесты при каждом push.

Создайте Директорию Workflow

Workflows GitHub Actions находятся в .github/workflows/:

mkdir -p .github/workflows
cd .github/workflows
touch ci.yml

Определите Базовый Workflow

Откройте .github/workflows/ci.yml и добавьте:

name: QA Automation Pipeline

on:
  push:
    branches: [main, develop]
  pull_request:
    branches: [main]

jobs:
  test:
    name: Run Tests
    runs-on: ubuntu-latest

    steps:
      - name: Checkout code
        uses: actions/checkout@v4

      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: '18'
          cache: 'npm'

      - name: Install dependencies
        run: npm ci

      - name: Run unit tests
        run: npm test

Что это делает:

• Триггеры: Запускается при push в ветки main/develop и на pull request’ах
• ubuntu-latest: Использует хостинговый Ubuntu runner от GitHub
• actions/checkout@v4: Делает checkout кода вашего репозитория
• actions/setup-node@v4: Устанавливает Node.js с кэшированием зависимостей
• npm ci: Чистая установка (быстрее и надежнее, чем npm install)
• npm test: Выполняет скрипты тестов, определенные в package.json

Push и Запуск Workflow

git add .github/workflows/ci.yml
git commit -m "Add GitHub Actions CI workflow"
git push origin main

Checkpoint: Теперь у вас есть автоматизированные тесты, запускающиеся при каждом push в main.

Шаг 2: Добавьте Матричное Тестирование для Нескольких Окружений

Реализуйте Матричную Стратегию

Матричное тестирование запускает ваши тесты в нескольких конфигурациях одновременно:

name: QA Automation Pipeline

on:
  push:
    branches: [main, develop]
  pull_request:
    branches: [main]

jobs:
  test:
    name: Test on Node ${{ matrix.node-version }}
    runs-on: ${{ matrix.os }}

    strategy:
      matrix:
        os: [ubuntu-latest, windows-latest, macos-latest]
        node-version: [18, 20]
        exclude:
          - os: windows-latest
            node-version: 18

    steps:
      - uses: actions/checkout@v4

      - name: Setup Node.js ${{ matrix.node-version }}
        uses: actions/setup-node@v4
        with:
          node-version: ${{ matrix.node-version }}
          cache: 'npm'

      - name: Install dependencies
        run: npm ci

      - name: Run tests
        run: npm test

      - name: Upload test results
        if: failure()
        uses: actions/upload-artifact@v4
        with:
          name: test-results-${{ matrix.os }}-node${{ matrix.node-version }}
          path: test-results/
          retention-days: 30

Что изменилось:

• Измерения матрицы: Тесты запускаются на 3 ОС × 2 версии Node = 5 комбинаций
• Параллельное выполнение: Все job’ы матрицы запускаются одновременно
• Условный upload: Результаты тестов загружаются только при сбое тестов

Ожидаемый результат: GitHub Actions создаст 5 параллельных job’ов, завершающихся за время самого медленного теста (~2-3 минуты вместо 10+ минут последовательно).

Checkpoint: Тесты теперь запускаются на нескольких операционных системах и версиях Node.js параллельно.

Шаг 3: Интегрируйте End-to-End Тестирование с Playwright

Добавьте Конфигурацию Playwright

Установите Playwright в ваш проект:

npm install -D @playwright/test
npx playwright install --with-deps chromium firefox webkit

Создайте playwright.config.ts:

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

export default defineConfig({
  testDir: './e2e',
  fullyParallel: true,
  forbidOnly: !!process.env.CI,
  retries: process.env.CI ? 2 : 0,
  workers: process.env.CI ? 1 : undefined,
  reporter: [
    ['html'],
    ['junit', { outputFile: 'test-results/junit.xml' }]
  ],
  use: {
    baseURL: 'http://localhost:3000',
    trace: 'on-first-retry',
    screenshot: 'only-on-failure'
  },
  projects: [
    {
      name: 'chromium',
      use: { ...devices['Desktop Chrome'] },
    },
    {
      name: 'firefox',
      use: { ...devices['Desktop Firefox'] },
    },
    {
      name: 'webkit',
      use: { ...devices['Desktop Safari'] },
    },
  ],
  webServer: {
    command: 'npm run start',
    url: 'http://localhost:3000',
    reuseExistingServer: !process.env.CI,
    timeout: 120000,
  },
});

Обновите Workflow для E2E Тестов

Добавьте новый job в .github/workflows/ci.yml:

  e2e-test:
    name: E2E Tests - ${{ matrix.browser }}
    runs-on: ubuntu-latest
    needs: test

    strategy:
      matrix:
        browser: [chromium, firefox, webkit]

    steps:
      - uses: actions/checkout@v4

      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'

      - name: Install dependencies
        run: npm ci

      - name: Install Playwright browsers
        run: npx playwright install --with-deps ${{ matrix.browser }}

      - name: Build application
        run: npm run build

      - name: Run E2E tests
        run: npx playwright test --project=${{ matrix.browser }}
        env:
          CI: true

      - name: Upload Playwright report
        if: always()
        uses: actions/upload-artifact@v4
        with:
          name: playwright-report-${{ matrix.browser }}
          path: playwright-report/
          retention-days: 30

Что это добавляет:

• needs: test: E2E тесты запускаются только если unit-тесты прошли
• Матрица браузеров: Тесты запускаются в Chromium, Firefox и WebKit
• Автоматические повторы: Настроены в playwright.config.ts (2 повтора в CI)
• Upload артефактов: Отчеты и скриншоты сохраняются на 30 дней

Шаг 4: Добавьте Отчетность о Покрытии Кода

Настройте Сбор Покрытия

Обновите package.json для генерации покрытия:

{
  "scripts": {
    "test": "jest",
    "test:coverage": "jest --coverage --coverageReporters=lcov"
  }
}

Интегрируйте Codecov

Добавьте upload в Codecov в .github/workflows/ci.yml:

  test:
    steps:
      - name: Run tests with coverage
        run: npm run test:coverage

      - name: Upload coverage to Codecov
        uses: codecov/codecov-action@v4
        with:
          token: ${{ secrets.CODECOV_TOKEN }}
          files: ./coverage/lcov.info
          flags: unittests
          name: codecov-${{ matrix.os }}-node${{ matrix.node-version }}
          fail_ci_if_error: true

Настройте Codecov

1. Перейдите на codecov.io и войдите через GitHub
2. Добавьте ваш репозиторий
3. Скопируйте токен upload
4. В вашем GitHub репозитории: Settings → Secrets → New repository secret
   • Name: CODECOV_TOKEN
   • Value: [вставьте токен]

Ожидаемый результат: Codecov будет комментировать pull request’ы с diff’ами покрытия.

Шаг 5: Реализуйте Умные Уведомления

Добавьте Slack Уведомления

Создайте .github/workflows/notify.yml:

name: Test Notifications

on:
  workflow_run:
    workflows: ["QA Automation Pipeline"]
    types: [completed]

jobs:
  notify:
    runs-on: ubuntu-latest
    if: ${{ github.event.workflow_run.conclusion == 'failure' }}

    steps:
      - name: Send Slack notification
        uses: slackapi/slack-github-action@v1
        with:
          payload: |
            {
              "text": "❌ Тесты упали в ${{ github.repository }}",
              "blocks": [
                {
                  "type": "section",
                  "text": {
                    "type": "mrkdwn",
                    "text": "*Уведомление о Сбое Теста*\n\n:x: Тесты упали на `${{ github.event.workflow_run.head_branch }}`"
                  }
                }
              ]
            }
        env:
          SLACK_WEBHOOK_URL: ${{ secrets.SLACK_WEBHOOK_URL }}

Шаг 6: Оптимизируйте Производительность Workflow

Реализуйте Кэширование Зависимостей

- name: Cache Playwright browsers
  uses: actions/cache@v4
  with:
    path: ~/.cache/ms-playwright
    key: playwright-${{ runner.os }}-${{ hashFiles('package-lock.json') }}
    restore-keys: |
      playwright-${{ runner.os }}-

Условное Выполнение Тестов

Пропускайте E2E тесты для изменений только документации:

  e2e-test:
    runs-on: ubuntu-latest
    if: |
      !contains(github.event.head_commit.message, '[skip-e2e]')

Прирост производительности:

• Кэширование зависимостей: 2-3 минуты → 30 секунд
• Кэширование браузеров Playwright: 1 минута → 10 секунд
• Условные пропуски: Избегайте ненужных E2E запусков

Устранение Неполадок

Проблема 1: Установка Браузера Playwright Падает

Сообщение об ошибке:

Error: browserType.launch: Executable doesn't exist

Быстрое решение:

- name: Install Playwright browsers
  run: npx playwright install --with-deps

Проблема 2: Ошибки Таймаута в E2E Тестах

Если процесс медленный:

Увеличьте таймаут в playwright.config.ts:

export default defineConfig({
  timeout: 60000, // 60 секунд на тест
});

Проблема 3: Секреты Недоступны

Проверить существование секрета:

gh secret list

Установить секрет через CLI:

gh secret set CODECOV_TOKEN --body "ваш-токен-здесь"

Следующие Шаги

Поздравляем! Вы успешно построили production-ready QA automation конвейер с GitHub Actions. 🎉

Что вы Построили

Теперь у вас есть:

• ✅ Автоматическое выполнение тестов при каждом коммите
• ✅ Матричное мультиокружение тестирование
• ✅ E2E тесты в трех браузерах
• ✅ Отслеживание покрытия кода с Codecov
• ✅ Умные уведомления о сбоях через Slack
• ✅ Оптимизированные workflows с кэшированием

Прокачайте Навыки

Готовы к большему? Попробуйте эти улучшения:

Простые Улучшения (30 мин каждое)

1. Добавьте Visual Regression Testing

   npm install -D playwright-expect
   

2. Включите Автоматические Обновления Зависимостей

   # .github/dependabot.yml
   version: 2
   updates:
     - package-ecosystem: npm
       directory: "/"
       schedule:
         interval: weekly
   

Промежуточные Улучшения (1-2 часа каждое)

3. Добавьте Performance Testing с Lighthouse
4. Реализуйте Deployment Previews

Продвинутые Улучшения (3+ часа)

5. Создайте Переиспользуемые Шаблоны Workflow
6. Реализуйте Test Sharding

Связанные Туториалы

Продолжайте обучение:

• GitOps Workflows для QA
• Оптимизация CI/CD Pipeline
• Автоматизированное Security Testing

Заключение

Что вы Достигли

В этом туториале вы:

1. ✅ Создали базовый workflow GitHub Actions
2. ✅ Реализовали матричное тестирование в ОС и версиях Node
3. ✅ Интегрировали Playwright для кроссбраузерного E2E тестирования
4. ✅ Добавили отслеживание покрытия кода с Codecov
5. ✅ Настроили Slack уведомления для сбоев
6. ✅ Оптимизировали производительность workflow с кэшированием

Ключевые Выводы

• Автоматизация необходима: GitHub Actions устраняет накладные расходы ручного тестирования
• Матричное тестирование ловит платформо-специфичные баги: Тестируйте в окружениях рано
• Быстрые петли обратной связи: Оптимизированные workflows дают результаты за минуты
• Наблюдаемые системы побеждают: Уведомления и отчеты держат команды в курсе

Вопросы или отзывы? Оставьте комментарий!

Было полезно? Поделитесь с командой!