From 842bbe44f1cd1dda44615e6f9c38518643a29fc0 Mon Sep 17 00:00:00 2001
From: adilallo <39313955+adilallo@users.noreply.github.com>
Date: Fri, 12 Sep 2025 16:01:12 -0600
Subject: [PATCH] Update visual regression tests

---
 .gitea/workflows/ci.yaml            |  1 +
 .runner.pid                         |  1 +
 app/not-found.js                    | 14 ++++++++++
 tests/e2e/visual-regression.spec.ts | 42 ++++++++++++++++++++++-------
 vitest.config.mjs                   |  9 ++++++-
 5 files changed, 56 insertions(+), 11 deletions(-)
 create mode 100644 .runner.pid
 create mode 100644 app/not-found.js

diff --git a/.gitea/workflows/ci.yaml b/.gitea/workflows/ci.yaml
index 6a9fa2d..77d2cf1 100644
--- a/.gitea/workflows/ci.yaml
+++ b/.gitea/workflows/ci.yaml
@@ -14,6 +14,7 @@ jobs:
       matrix: { node-version: [18, 20] }
     env:
       NODE_OPTIONS: "--max_old_space_size=4096"
+      CI: true
     steps:
       - uses: actions/checkout@v4
       - uses: actions/setup-node@v4
diff --git a/.runner.pid b/.runner.pid
new file mode 100644
index 0000000..67f2872
--- /dev/null
+++ b/.runner.pid
@@ -0,0 +1 @@
+94423
diff --git a/app/not-found.js b/app/not-found.js
new file mode 100644
index 0000000..720f7b2
--- /dev/null
+++ b/app/not-found.js
@@ -0,0 +1,14 @@
+export default function NotFound() {
+  return (
+    <div className="min-h-screen bg-[#F4F3F1] flex items-center justify-center">
+      <div className="text-center">
+        <h1 className="text-6xl font-bold text-[var(--color-content-default-primary)] mb-4">
+          404
+        </h1>
+        <p className="text-[var(--color-content-default-secondary)]">
+          Page Not Found
+        </p>
+      </div>
+    </div>
+  );
+}
diff --git a/tests/e2e/visual-regression.spec.ts b/tests/e2e/visual-regression.spec.ts
index 0bc34b2..1b7de2b 100644
--- a/tests/e2e/visual-regression.spec.ts
+++ b/tests/e2e/visual-regression.spec.ts
@@ -376,18 +376,40 @@ test.describe("Visual Regression Tests", () => {
     });
   });
 
-  test("error states", async ({ page }) => {
-    // Test error states by simulating a more controlled error condition
-    // Instead of blocking resources, we'll simulate a network error state
+  test("blog listing page", async ({ page }) => {
+    // Navigate to blog listing page
+    await page.goto("/blog");
+    await page.waitForLoadState("networkidle");
+    await settle(page);
 
-    // Navigate to a non-existent route to trigger a 404-like state
+    // Take full page screenshot of blog listing
+    await expect(page).toHaveScreenshot("blog-listing.png", {
+      fullPage: true,
+      animations: "disabled",
+    });
+  });
+
+  test("blog post page", async ({ page }) => {
+    // Navigate to a specific blog post
+    await page.goto("/blog/resolving-active-conflicts");
+    await page.waitForLoadState("networkidle");
+    await settle(page);
+
+    // Take full page screenshot of blog post
+    await expect(page).toHaveScreenshot("blog-post.png", {
+      fullPage: true,
+      animations: "disabled",
+    });
+  });
+
+  test("404 error page", async ({ page }) => {
+    // Navigate to a non-existent route to trigger 404
     await page.goto("/non-existent-page");
+    await page.waitForLoadState("networkidle");
+    await settle(page);
 
-    // Wait for page to stabilize
-    await page.waitForTimeout(2000);
-
-    // Take screenshot of error state
-    await expect(page).toHaveScreenshot("homepage-error.png", {
+    // Take screenshot of 404 page
+    await expect(page).toHaveScreenshot("404-error.png", {
       animations: "disabled",
     });
   });
@@ -413,7 +435,7 @@ test.describe("Visual Regression Tests", () => {
     await page.evaluate(() => {
       document.documentElement.style.setProperty(
         "--prefers-reduced-motion",
-        "reduce",
+        "reduce"
       );
     });
 
diff --git a/vitest.config.mjs b/vitest.config.mjs
index 83c0e50..d9d426b 100644
--- a/vitest.config.mjs
+++ b/vitest.config.mjs
@@ -43,6 +43,13 @@ export default defineConfig({
       thresholds: { lines: 50, functions: 50, statements: 50, branches: 50 },
     },
     pool: "threads",
-    testTimeout: 10000,
+    testTimeout: 30000, // Increased from 10s to 30s for CI environment
+    hookTimeout: 30000, // Increased hook timeout for CI
+    teardownTimeout: 30000, // Increased teardown timeout for CI
+    // CI optimizations
+    maxConcurrency: process.env.CI ? 2 : 5, // Reduce concurrency in CI
+    maxThreads: process.env.CI ? 2 : 4, // Reduce threads in CI
+    minThreads: process.env.CI ? 1 : 2, // Minimum threads in CI
+    retry: process.env.CI ? 2 : 0, // Retry failed tests in CI
   },
 });