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

const port = Number(process.env.LUMI_UI_TEST_PORT || 3317);

module.exports = defineConfig({
  testDir: "./tests/ui",
  outputDir: "./test-results/ui",
  timeout: 45_000,
  expect: { timeout: 8_000 },
  fullyParallel: false,
  workers: 1,
  retries: process.env.CI ? 1 : 0,
  reporter: [["list"], ["html", { outputFolder: "test-results/ui-report", open: "never" }]],
  use: {
    baseURL: `http://127.0.0.1:${port}`,
    trace: "retain-on-failure",
    screenshot: "only-on-failure",
    video: "retain-on-failure",
    reducedMotion: "reduce"
  },
  webServer: {
    command: "node tests/ui/fixture-server.js",
    url: `http://127.0.0.1:${port}/health`,
    timeout: 60_000,
    reuseExistingServer: false,
    env: {
      ...process.env,
      PORT: String(port),
      LUMI_UI_TEST_PORT: String(port),
      NODE_ENV: "test"
    }
  },
  projects: [
    { name: "phone-320", use: { browserName: "chromium", viewport: { width: 320, height: 720 }, isMobile: true, hasTouch: true } },
    { name: "phone-390", use: { browserName: "chromium", viewport: { width: 390, height: 844 }, isMobile: true, hasTouch: true } },
    { name: "tablet-768", use: { browserName: "chromium", viewport: { width: 768, height: 1024 }, hasTouch: true } },
    { name: "desktop-1280", use: { browserName: "chromium", viewport: { width: 1280, height: 900 } } },
    { name: "desktop-1920", use: { browserName: "chromium", viewport: { width: 1920, height: 1080 } } }
  ]
});