|
| 1 | +import { defineConfig, devices } from '@playwright/test'; |
| 2 | + |
| 3 | +// --- Runtime modes --- |
| 4 | +// RUN_MODE=LOCAL -> Start Astro dev server (local development) |
| 5 | +// RUN_MODE=BUILD -> Build Astro site and serve from "dist" (CI / closest to production) |
| 6 | +// RUN_MODE=REMOTE -> Do not start any local server, test directly against remote URL |
| 7 | +const RUN_MODE = process.env.RUN_MODE ?? (process.env.CI ? 'BUILD' : 'LOCAL'); |
| 8 | + |
| 9 | +// Allow overriding test directory via environment variable (default: ./tests) |
| 10 | +const testDir = process.env.TEST_DIR ?? './test'; |
| 11 | + |
| 12 | +// Base URL changes depending on the mode |
| 13 | +// LOCAL -> http://localhost:4321 (Astro dev server) |
| 14 | +// BUILD -> http://localhost:4173 (served "dist") |
| 15 | +// REMOTE -> PROD_BASE_URL (falls back to p5js.org) |
| 16 | +const baseURL = |
| 17 | + RUN_MODE === 'LOCAL' |
| 18 | + ? 'http://localhost:4321' |
| 19 | + : RUN_MODE === 'BUILD' |
| 20 | + ? 'http://localhost:4173' |
| 21 | + : process.env.PROD_BASE_URL ?? 'https://p5js.org'; |
| 22 | + |
| 23 | + |
| 24 | +export default defineConfig({ |
| 25 | + // Use dynamic testDir (default ./tests) |
| 26 | + testDir, |
| 27 | + outputDir: 'test-results', |
| 28 | + // Global timeout for each test to improve stability |
| 29 | + timeout: 30 * 1000, |
| 30 | + fullyParallel: true, |
| 31 | + forbidOnly: !!process.env.CI, |
| 32 | + // Retry failed tests in CI |
| 33 | + retries: process.env.CI ? 2 : 0, |
| 34 | + // Force single worker in CI to avoid port/resource conflicts |
| 35 | + workers: process.env.CI ? 1 : undefined, |
| 36 | + // Reporters: "list" for readable console logs + "html" for detailed report |
| 37 | + reporter: [ |
| 38 | + ['list'], |
| 39 | + ['html', { outputFolder: 'playwright-report', open: 'never' }], |
| 40 | + ], |
| 41 | + use: { |
| 42 | + baseURL, |
| 43 | + // Save trace only on first retry for debugging failed tests |
| 44 | + trace: 'on-first-retry', |
| 45 | + // Capture screenshot only on failure |
| 46 | + screenshot: 'only-on-failure', |
| 47 | + // Keep video only on failure in CI |
| 48 | + video: process.env.CI ? 'retain-on-failure' : 'off', |
| 49 | + }, |
| 50 | + |
| 51 | + // Test projects: three major engines + iPhone 15 viewport |
| 52 | + projects: [ |
| 53 | + { name: 'Desktop Chrome', use: { ...devices['Desktop Chrome'] } }, |
| 54 | + { name: 'Desktop Firefox', use: { ...devices['Desktop Firefox'] } }, |
| 55 | + { name: 'Desktop Safari', use: { ...devices['Desktop Safari'] } }, |
| 56 | + { name: 'iPhone 15', use: { ...devices['iPhone 15'] } }, |
| 57 | + { name: 'Pixel 7', use: { ...devices['Pixel 7'] } }, |
| 58 | + ], |
| 59 | + |
| 60 | + // Start appropriate webServer depending on the mode |
| 61 | + webServer: |
| 62 | + RUN_MODE === 'LOCAL' |
| 63 | + ? { |
| 64 | + // Start Astro dev server for local development |
| 65 | + command: 'npm run dev', |
| 66 | + port: 4321, |
| 67 | + reuseExistingServer: !process.env.CI, |
| 68 | + timeout: 180_000, |
| 69 | + } |
| 70 | + : RUN_MODE === 'BUILD' |
| 71 | + ? { |
| 72 | + command: 'npm run build && npm run preview -- --port 4173 --host', |
| 73 | + port: 4173, // choose port OR url (not both) |
| 74 | + reuseExistingServer: !process.env.CI, |
| 75 | + timeout: 180_000, |
| 76 | + } |
| 77 | + : undefined, // REMOTE mode → no server started |
| 78 | +}); |
| 79 | + |
0 commit comments