novalon-website/e2e/playwright.config.tiered.ts

import { defineConfig, devices } from '@playwright/test';
import { getEnvironment } from './src/config/environments';
import { getMobileDevices } from './src/utils/devices';
import { getTestTier } from './src/config/test-tiers';

const env = getEnvironment();

function createTieredConfig(tierName: string) {
  const tier = getTestTier(tierName);
  
  return defineConfig({
    testDir: './src/tests',
    fullyParallel: tier.fullyParallel,
    forbidOnly: !!process.env.CI,
    retries: tier.retries,
    workers: tier.workers,
    globalSetup: require.resolve('./global-setup'),
    reporter: [
      ['html', { open: 'never' }],
      ['json', { outputFile: `test-results/${tierName}-results.json` }],
      ['junit', { outputFile: `test-results/${tierName}-junit.xml` }],
      ['line'],
      ['list'],
      ['allure-playwright', {
        outputFolder: 'allure-results',
        detail: true,
        suiteTitle: false,
      }],
    ],
    timeout: tier.timeout,
    expect: {
      timeout: tier.timeout / 2,
    },
    use: {
      baseURL: env.baseURL,
      trace: env.trace,
      screenshot: env.screenshot,
      video: env.video,
      headless: true,
      viewport: { width: 1280, height: 720 },
      actionTimeout: tier.timeout / 2,
      navigationTimeout: tier.timeout,
      launchOptions: {
        slowMo: env.slowMo,
      },
      storageState: '.auth/admin.json',
    },
    projects: [
      {
        name: 'chromium',
        use: { ...devices['Desktop Chrome'] },
      },
      {
        name: 'chromium-coverage',
        use: { 
          ...devices['Desktop Chrome'],
          browserName: 'chromium',
        },
        testMatch: tier.testMatch,
      },
      {
        name: 'firefox',
        use: { ...devices['Desktop Firefox'] },
      },
      {
        name: 'webkit',
        use: { ...devices['Desktop Safari'] },
      },
      {
        name: 'Mobile Chrome',
        use: { ...devices['Pixel 5'] },
      },
      {
        name: 'Mobile Safari',
        use: { ...devices['iPhone 12'] },
      },
      ...getMobileDevices().map(device => ({
        name: `mobile-${device.name.replace(/\s+/g, '-').toLowerCase()}`,
        use: {
          ...devices['Mobile Chrome'],
          viewport: device.viewport,
          userAgent: device.userAgent,
          deviceScaleFactor: device.deviceScaleFactor,
          isMobile: true,
        },
      })),
      {
        name: 'performance-mobile',
        use: {
          ...devices['Mobile Chrome'],
          viewport: { width: 375, height: 667 },
          isMobile: true,
        },
        testMatch: /.*\.perf\.spec\.ts/,
      },
      {
        name: 'pwa-mobile',
        use: {
          ...devices['Mobile Chrome'],
          viewport: { width: 375, height: 667 },
          isMobile: true,
          serviceWorkers: 'allow',
        },
        testMatch: /.*\.pwa\.spec\.ts/,
      },
    ],
    webServer: env.name === 'development' && !process.env.DISABLE_WEB_SERVER ? {
      command: 'cd .. && npm run dev',
      url: 'http://localhost:3000',
      timeout: 120000,
      reuseExistingServer: !process.env.CI,
    } : undefined,
  });
}

export default createTieredConfig(process.env.TEST_TIER || 'standard');