Структура проекта

Организация проекта играет ключевую роль в эффективности автоматизированного тестирования. Правильная структура упрощает поддержку тестов, масштабирование и интеграцию с CI/CD. В Playwright для JavaScript существует несколько общепринятых подходов к структуре проекта, которые обеспечивают модульность, читаемость и повторное использование кода.

1. Основные директории проекта

tests/ – основная директория для хранения тестов. Обычно она разделяется по функциональным областям или типам тестов. Например:

tests/
 ├─ login/
 │   ├─ login.spec.js
 │   └─ forgotPassword.spec.js
 ├─ dashboard/
 │   ├─ dashboard.spec.js
 │   └─ widgets.spec.js
 └─ api/
     └─ apiEndpoints.spec.js

pages/ – каталог для реализации паттерна Page Object Model (POM). Каждая страница или компонент приложения имеет свой класс с методами для взаимодействия:

pages/
 ├─ LoginPage.js
 ├─ DashboardPage.js
 └─ SettingsPage.js

fixtures/ – для хранения данных тестов, предварительных конфигураций и mock-данных:

fixtures/
 ├─ users.js
 └─ mockResponses.js

utils/ – вспомогательные функции, которые используются в нескольких тестах:

utils/
 ├─ helpers.js
 ├─ apiRequests.js
 └─ fileHandlers.js

playwright.config.js – основной файл конфигурации Playwright, где задаются базовые URL, таймауты, браузеры для тестирования, пути для отчетов и другие параметры.

2. Использование Page Object Model (POM)

Page Object Model обеспечивает разделение логики тестов и логики взаимодействия со страницами. Это делает тесты более читаемыми и удобными для поддержки. Пример структуры класса страницы:

class LoginPage {
    constructor(page) {
        this.page = page;
        this.usernameInput = page.locator('#username');
        this.passwordInput = page.locator('#password');
        this.loginButton = page.locator('#login');
    }

    async login(username, password) {
        await this.usernameInput.fill(username);
        await this.passwordInput.fill(password);
        await this.loginButton.click();
    }
}

module.exports = { LoginPage };

Тест с использованием POM будет выглядеть так:

const { test, expect } = require('@playwright/test');
const { LoginPage } = require('../pages/LoginPage');

test('успешный вход', async ({ page }) => {
    const loginPage = new LoginPage(page);
    await page.goto('https://example.com/login');
    await loginPage.login('user', 'password');
    await expect(page).toHaveURL('https://example.com/dashboard');
});

3. Настройка конфигурации

Файл playwright.config.js управляет поведением тестов:

// playwright.config.js
const { defineConfig } = require('@playwright/test');

module.exports = defineConfig({
    testDir: './tests',
    timeout: 30000,
    retries: 1,
    use: {
        headless: true,
        viewport: { width: 1280, height: 720 },
        ignoreHTTPSErrors: true,
        video: 'on-first-retry',
    },
    projects: [
        { name: 'chromium', use: { browserName: 'chromium' } },
        { name: 'firefox', use: { browserName: 'firefox' } },
        { name: 'webkit', use: { browserName: 'webkit' } },
    ],
});
  • testDir – папка с тестами.
  • timeout – максимальное время выполнения одного теста.
  • retries – количество повторов при неудаче.
  • use – настройки по умолчанию для всех тестов (браузер, видимость окна, видео и скриншоты).
  • projects – позволяет запускать тесты сразу в нескольких браузерах.

4. Организация фикстур

Playwright поддерживает фикстуры, которые упрощают подготовку тестового окружения. Их можно определить на уровне проекта или отдельного теста:

const { test } = require('@playwright/test');

test.use({
    storageState: 'auth.json' // сохраняет состояние входа в систему
});

test('тест с авторизацией', async ({ page }) => {
    await page.goto('https://example.com/dashboard');
    // тестируем функционал авторизованного пользователя
});

Фикстуры делают тесты независимыми и ускоряют повторное использование состояния браузера между тестами.

5. Разделение тестов по уровням

Для упрощения поддержки проекта тесты можно классифицировать:

  • smoke/ – минимальный набор тестов для проверки критических функций.
  • regression/ – регрессионные тесты для проверки старого функционала после изменений.
  • e2e/ – полные сквозные сценарии.
  • api/ – тесты API, если Playwright используется для интеграционного тестирования.

Такое разделение ускоряет запуск и упрощает интеграцию с CI/CD, позволяя запускать только нужные наборы тестов.

6. Отчётность и логирование

Playwright поддерживает встроенные отчеты:

use: {
    screenshot: 'only-on-failure',
    video: 'retain-on-failure',
    trace: 'on-first-retry',
}
  • Скриншоты и видео помогают выявлять причину падения теста.
  • Трассировка (trace) позволяет проследить каждый шаг теста, включая действия пользователя и сетевые запросы.

Рекомендуется сохранять отчеты в отдельной папке reports/, чтобы их можно было легко интегрировать в CI/CD и систему визуализации результатов.

7. Рекомендации по поддерживаемой структуре

  • Каждая страница должна иметь свой отдельный класс в pages/.
  • Общие функции и утилиты хранятся в utils/ и не дублируются в тестах.
  • Тестовые данные и mock-ответы располагаются в fixtures/.
  • Тесты структурируются по функциональным блокам внутри tests/.
  • Конфигурация браузеров, таймаутов и отчетности централизуется в playwright.config.js.

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

Оглавление