import { defineConfig, devices } from '@playwright/test'

// Vue↔React usage-level parity gate (D1). Two webServers: the Vue docs harness
// (5173, canonical SFC / light-DOM) and the React harness (5174, <tvu-*> CE /
// shadow-DOM). The spec renders the same props + same slot fixture on both and
// compares Vue-actual ↔ React-actual.
export default defineConfig({
  testDir: 'tests/parity',
  testMatch: '**/*.spec.ts',
  use: { viewport: { width: 320, height: 160 } },
  projects: [{ name: 'chromium', use: { ...devices['Desktop Chrome'] } }],
  webServer: [
    { command: 'pnpm dev', url: 'http://localhost:5173', reuseExistingServer: true, timeout: 120_000 },
    {
      command: 'pnpm --dir react-pilot exec vite --config harness/vite.harness.config.ts --port 5174',
      url: 'http://localhost:5174',
      reuseExistingServer: true,
      timeout: 120_000,
    },
  ],
})