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

export default defineConfig({
  testDir: "./e2e",
  testMatch: "**/*.visual.spec.ts",
  fullyParallel: false,
  forbidOnly: true,
  retries: 0,
  workers: 2,
  reporter: [["list"], ["html", { outputFolder: "playwright-report-visual", open: "never" }]],
  outputDir: "test-results/visual",
  snapshotPathTemplate: "{testDir}/__screenshots__/{testFilePath}/{arg}{ext}",
  expect: {
    toHaveScreenshot: {
      animations: "disabled",
      caret: "hide",
      // Keep the changed-pixel budget strict while ignoring sub-perceptual
      // antialiasing differences between local and hosted container runtimes.
      maxDiffPixels: 5,
      threshold: 0.1,
    },
  },
  use: {
    ...devices["Desktop Chrome"],
    baseURL: "http://localhost:4174",
    colorScheme: "light",
    deviceScaleFactor: 1,
    locale: "en-US",
    launchOptions: {
      args: ["--disable-gpu", "--font-render-hinting=none"],
    },
    reducedMotion: "reduce",
    timezoneId: "UTC",
    trace: "retain-on-failure",
    viewport: { width: 1440, height: 1000 },
  },
  webServer: {
    command: "npm run dev -- --port 4174 --strictPort",
    url: "http://localhost:4174",
    reuseExistingServer: false,
    timeout: 120_000,
  },
});