community-rule/tests/e2e/edge-cases.spec.ts

import { test, expect } from "@playwright/test";

test.describe("Edge Cases and Error Scenarios", () => {
  test.beforeEach(async ({ page }) => {
    await page.goto("/");
  });

  test("handles slow network conditions", async ({ page }) => {
    // Page is already loaded from beforeEach
    // Simulate slow network for any subsequent requests
    await page.route("**/*", (route) => {
      // Add 2 second delay to all requests
      setTimeout(() => route.continue(), 2000);
    });

    // Navigate to a new page to test slow network conditions
    // Use a fresh navigation instead of reload to avoid Web Inspector issues
    await page.goto("/", { waitUntil: "domcontentloaded", timeout: 10000 });

    // Page should still load eventually
    await expect(page.locator("text=Build structure")).toBeVisible({
      timeout: 10000,
    });
  });

  test("handles offline mode gracefully", async ({ page }) => {
    // Page is already loaded from beforeEach, so we can test offline behavior
    // without reloading (which is blocked by Web Inspector in local environments)

    // Simulate offline mode by blocking all network requests
    await page.route("**/*", (route) => {
      route.abort();
    });

    // Verify page content is still visible (cached content should remain)
    // This tests that the page doesn't crash when network requests fail
    const body = page.locator("body");
    await expect(body).toBeVisible();

    // Verify key content is still accessible
    await expect(page.locator("text=Build structure")).toBeVisible();
  });

  test("handles JavaScript errors gracefully", async ({ page }) => {
    // Inject a JavaScript error
    await page.evaluate(() => {
      // Create a temporary error handler
      const originalError = console.error;
      console.error = () => {}; // Suppress error logging

      // Trigger a harmless error
      try {
        throw new Error("Test error");
      } catch (_e) {
        // Error handled
      }

      console.error = originalError;
    });

    // Page should continue to function
    await expect(page.locator("text=Build structure")).toBeVisible();

    const createCta = page.getByRole("button", { name: "Create rule" });
    const facilitatorCta = page.getByRole("link", {
      name: /Talk to a facilitator/i,
    });
    const visibleCreate = createCta.filter({ has: page.locator(":visible") });
    if ((await visibleCreate.count()) > 0) {
      await visibleCreate.first().click();
      await expect(page).toHaveURL(/\/create/);
    } else {
      await expect(facilitatorCta.first()).toBeVisible();
    }
  });

  test("handles missing images gracefully", async ({ page }) => {
    // Block image requests
    await page.route("**/*.{png,jpg,jpeg,svg,webp}", (route) => {
      route.abort();
    });

    // Navigate to a new page to test missing images
    // Use a fresh navigation instead of reload to avoid Web Inspector issues
    await page.goto("/", { waitUntil: "domcontentloaded" });

    // Page should still function without images
    await expect(page.locator("text=Build structure")).toBeVisible();
    await expect(
      page.getByRole("heading", { name: "CommunityRule Creative Team" }),
    ).toBeVisible();
  });
});