Файл конфигурации cypress.config.js

Файл cypress.config.js является центральным элементом настройки Cypress-проектов. Он управляет поведением тестовой среды, параметрами запуска и интеграцией с внешними инструментами. Этот файл создаётся в корне проекта и экспортирует объект конфигурации, который Cypress использует при запуске тестов.

Структура файла конфигурации

Типичный файл cypress.config.js выглядит следующим образом:

const { defineConfig } = require('cypress');

module.exports = defineConfig({
  e2e: {
    baseUrl: 'http://localhost:3000',
    specPattern: 'cypress/e2e/**/*.cy.js',
    supportFile: 'cypress/support/e2e.js',
    viewportWidth: 1280,
    viewportHeight: 720,
    defaultCommandTimeout: 8000,
    pageLoadTimeout: 60000,
  },
  env: {
    apiUrl: 'http://localhost:5000/api',
    loginUser: 'testuser'
  },
  retries: {
    runMode: 2,
    openMode: 0
  },
  reporter: 'mochawesome',
  reporterOptions: {
    reportDir: 'cypress/reports',
    overwrite: false,
    html: true,
    json: true
  }
});

Ключевые блоки конфигурации:

  • e2e — настройки для энд-ту-энд тестирования. Сюда входят базовый URL, шаблоны поиска тестов, файлы поддержки, размеры окна браузера, таймауты и т.д.
  • env — переменные окружения. Используются для передачи настроек, которые могут меняться между средами (например, URL API, учетные данные).
  • retries — настройка повторных попыток для тестов при их падении.
  • reporter и reporterOptions — настройки отчетности, позволяют интегрировать Cypress с внешними инструментами для генерации отчетов.

Настройка E2E тестирования

Блок e2e включает несколько важных параметров:

  • baseUrl — базовый URL для всех тестов. Упрощает написание команд cy.visit('/') без указания полного адреса.
  • specPattern — шаблон поиска файлов тестов. Позволяет структурировать проект по папкам и именам файлов.
  • supportFile — путь к файлу поддержки, где подключаются общие команды и хуки.
  • viewportWidth и viewportHeight — размеры окна браузера, имитирующие конкретное устройство.
  • defaultCommandTimeout — максимальное время ожидания для команд Cypress, таких как cy.get или cy.click.
  • pageLoadTimeout — таймаут ожидания полной загрузки страницы.

Пример расширенной настройки с разными браузерами:

e2e: {
  baseUrl: 'http://localhost:3000',
  browser: 'chrome',
  specPattern: 'cypress/e2e/**/*.cy.js',
  setupNodeEvents(on, config) {
    // слушатели событий Node.js, например логирование или кастомные плагины
  }
}

Переменные окружения

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

env: {
  apiUrl: 'https://staging.example.com/api',
  adminUser: 'admin',
  adminPassword: 'secret'
}

Доступ к переменным осуществляется через Cypress.env():

cy.request({
  method: 'POST',
  url: `${Cypress.env('apiUrl')}/login`,
  body: { username: Cypress.env('adminUser'), password: Cypress.env('adminPassword') }
});

Использование env улучшает переносимость тестов между локальной средой, staging и production.

Таймауты и повторные попытки

Настройки таймаутов помогают управлять ожиданием элементов и страниц:

  • defaultCommandTimeout — стандартное время ожидания команд Cypress.
  • pageLoadTimeout — время ожидания полной загрузки страницы.
  • responseTimeout — максимальное время ожидания ответа от сервера при API-запросах.

Повторные попытки тестов на случай временных сбоев настраиваются через retries:

retries: {
  runMode: 2,   // количество повторов при запуске через CLI
  openMode: 0   // количество повторов в интерактивном режиме
}

Подключение плагинов

Файл конфигурации поддерживает настройку плагинов через setupNodeEvents:

setupNodeEvents(on, config) {
  // Пример: плагин для скриншотов
  const { addMatchImageSnapshotPlugin } = require('cypress-image-snapshot/plugin');
  addMatchImageSnapshotPlugin(on, config);

  // Возврат конфигурации с изменениями
  return config;
}

setupNodeEvents используется для регистрации любых Node.js событий: логирования, модификации тестовой конфигурации, интеграции с CI/CD или внешними сервисами.

Репортеры

Cypress поддерживает различные репортеры для формирования отчетов о тестах:

reporter: 'mochawesome',
reporterOptions: {
  reportDir: 'cypress/reports',
  overwrite: false,
  html: true,
  json: true
}

Репортеры позволяют интегрировать Cypress с CI/CD, генерировать отчеты в форматах HTML и JSON, а также хранить историю тестов.

Советы по организации конфигурации

  • Разделять конфигурацию на локальную и CI/CD через переменные окружения или отдельные файлы.
  • Использовать supportFile для хранения общих команд и хуков, чтобы не дублировать код.
  • Настраивать specPattern по папкам, чтобы легко масштабировать тесты при увеличении проекта.
  • Регулярно обновлять таймауты и retries на основе анализа стабильности тестов.
  • Хранить конфиденциальные данные только в env или в .env файлах и подключать через dotenv.

Файл cypress.config.js является гибким инструментом для полного контроля над тестовой средой, обеспечивая стабильность, масштабируемость и интеграцию Cypress с другими инструментами.

Оглавление