import { fileURLToPath } from 'node:url'
import { defineConfig, devices } from '@playwright/experimental-ct-vue'
import vue from '@vitejs/plugin-vue'

// Component-test config — mounts individual components in a real
// Chromium via Playwright Component Testing. Used by:
//   pnpm test:component        (all CT tests, baselines verified)
//   pnpm test:visual           (subset tagged @visual)
//   pnpm test:visual:update    (regenerate visual baselines)
//
// E2E (real backend + real frontend) lives in playwright.config.ts.

const sharedAliases = {
  '@': fileURLToPath(new URL('./src', import.meta.url)),
  '@core': fileURLToPath(new URL('./src/@core', import.meta.url)),
  '@layouts': fileURLToPath(new URL('./src/@layouts', import.meta.url)),
  '@images': fileURLToPath(new URL('./src/assets/images/', import.meta.url)),
  '@styles': fileURLToPath(new URL('./src/assets/styles/', import.meta.url)),
}

export default defineConfig({
  testDir: './tests/playwright-ct',
  testMatch: /.*\.spec\.ts$/,
  snapshotDir: './tests/playwright-ct/__screenshots__',
  snapshotPathTemplate: '{snapshotDir}/{testFilePath}/{arg}{ext}',
  fullyParallel: true,
  forbidOnly: !!process.env.CI,
  retries: 0,
  workers: process.env.CI ? 1 : undefined,
  reporter: process.env.CI ? 'github' : 'list',

  use: {
    trace: 'off',
    viewport: { width: 1440, height: 900 },
    ctPort: 3100,
    ctViteConfig: {
      plugins: [vue()],
      resolve: { alias: sharedAliases },

      // Vuetify ships ESM that Vite needs to inline-process; matches
      // the convention from vitest.config.ts's component project.
      ssr: { noExternal: ['vuetify'] },
    },
  },

  // Linux-Chromium-only baselines per RFC §A.5 — Firefox/WebKit and
  // mobile/responsive viewports deferred to a later sprint. Running
  // baselines on macOS (dev) vs Linux (CI) will produce a 1-2px
  // anti-alias diff; pixel tolerance below absorbs that, but the
  // canonical baseline IS the dev machine for now (no CI yet — see
  // BACKLOG TEST-INFRA-002).
  expect: {
    toHaveScreenshot: {
      maxDiffPixelRatio: 0.001,
      threshold: 0.2,
    },
  },

  projects: [
    {
      name: 'chromium',
      use: { ...devices['Desktop Chrome'] },
    },
  ],

  // Auto-start the prototype static server for visual baselines.
  // Tests under tests/playwright-ct/visual/ navigate to this URL via
  // page.goto() rather than calling mount(); they coexist with normal
  // CT tests in the same runner.
  webServer: {
    command: 'node tests/playwright-ct/visual/static-server.mjs',
    url: `http://127.0.0.1:${process.env.PROTOTYPE_PORT ?? 5179}/crewli-timetable.html`,
    reuseExistingServer: !process.env.CI,
    timeout: 30_000,
    stdout: 'ignore',
    stderr: 'pipe',
  },
})