✨ feat: implement new feature for enhanced user experience

2026-02-11 16:36:56 +00:00
parent 62f1906276
commit dc00d24899
75 changed files with 2456 additions and 35 deletions
--- a/playwright.config.ts
+++ b/playwright.config.ts
@@ -0,0 +1,113 @@
+import { defineConfig, devices } from "@playwright/test"
+
+/**
+ * Playwright configuration for tibi-svelte projects.
+ *
+ * Run against the CODING_URL (externally reachable via HTTPS).
+ * Override with: CODING_URL=https://... yarn test
+ */
+
+/**
+ * Traefik skips basic-auth for requests whose User-Agent contains
+ * "Playwright" (see docker-compose-local.yml, priority-100 router).
+ * Append the marker to every device preset so the original UA is preserved
+ * (important for mobile/responsive detection) while bypassing auth.
+ */
+function withPlaywrightUA(device: (typeof devices)[string]) {
+    return { ...device, userAgent: `${device.userAgent} Playwright` }
+}
+
+export default defineConfig({
+    testDir: "./tests",
+    fullyParallel: true,
+    forbidOnly: !!process.env.CI,
+    retries: process.env.CI ? 2 : 0,
+    workers: process.env.CI ? 1 : 16,
+    reporter: [["html", { open: "never" }]],
+    globalSetup: "./tests/global-setup.ts",
+    globalTeardown: "./tests/global-teardown.ts",
+
+    /* ── Visual Regression defaults ──────────────────────────────────── */
+    snapshotPathTemplate: "{testDir}/__screenshots__/{projectName}/{testFilePath}/{arg}{ext}",
+    expect: {
+        toHaveScreenshot: {
+            /* 2 % pixel tolerance – accounts for cross-OS font rendering */
+            maxDiffPixelRatio: 0.02,
+            /* per-pixel colour distance threshold (0 = exact, 1 = any) */
+            threshold: 0.2,
+            /* animation settling time before capture */
+            animations: "disabled",
+        },
+    },
+
+    use: {
+        /* Read from .env PROJECT_NAME or override via CODING_URL env var */
+        baseURL: process.env.CODING_URL || "https://localhost:3000",
+        headless: true,
+        ignoreHTTPSErrors: true,
+        trace: "on",
+        /* BrowserSync keeps a WebSocket open permanently, preventing
+           "networkidle" and "load" from resolving reliably.
+           Default all navigations to "domcontentloaded". */
+        navigationTimeout: 30000,
+    },
+
+    projects: [
+        /* ── Desktop E2E ───────────────────────────────────────────────── */
+        {
+            name: "chromium",
+            testDir: "./tests/e2e",
+            use: { ...withPlaywrightUA(devices["Desktop Chrome"]) },
+        },
+
+        /* ── API Tests ─────────────────────────────────────────────────── */
+        {
+            name: "api",
+            testDir: "./tests/api",
+            use: {
+                ...withPlaywrightUA(devices["Desktop Chrome"]),
+            },
+        },
+
+        /* ── Mobile E2E ────────────────────────────────────────────────── */
+        {
+            name: "mobile-iphonese",
+            testDir: "./tests/e2e-mobile",
+            use: {
+                ...withPlaywrightUA(devices["iPhone SE"]),
+                defaultBrowserType: "chromium",
+            },
+        },
+        {
+            name: "mobile-ipad",
+            testDir: "./tests/e2e-mobile",
+            use: {
+                ...withPlaywrightUA(devices["iPad Mini"]),
+                defaultBrowserType: "chromium",
+            },
+        },
+
+        /* ── Visual Regression ─────────────────────────────────────────── */
+        {
+            name: "visual-desktop",
+            testDir: "./tests/e2e-visual",
+            use: { ...withPlaywrightUA(devices["Desktop Chrome"]) },
+        },
+        {
+            name: "visual-iphonese",
+            testDir: "./tests/e2e-visual",
+            use: {
+                ...withPlaywrightUA(devices["iPhone SE"]),
+                defaultBrowserType: "chromium",
+            },
+        },
+        {
+            name: "visual-ipad",
+            testDir: "./tests/e2e-visual",
+            use: {
+                ...withPlaywrightUA(devices["iPad Mini"]),
+                defaultBrowserType: "chromium",
+            },
+        },
+    ],
+})