Initial Commit

apps/testbed/e2e/layout/navigation.spec.ts

@@ -0,0 +1,63 @@
+import { test, expect } from "@playwright/test";
+
+test.describe("Navigation", () => {
+  test("home page renders page-title", async ({ page }) => {
+    await page.goto("/");
+    await expect(page.locator('[data-testid="page-title"]')).toBeVisible();
+    await expect(page.locator('[data-testid="sidebar"]')).toBeVisible();
+    await expect(page.locator('[data-testid="header"]')).toBeVisible();
+  });
+
+  test("sidebar nav links exist for all routes", async ({ page }) => {
+    await page.goto("/");
+    // Check a few known nav links
+    await expect(page.locator('[data-testid="nav-crypto"]')).toBeVisible();
+    await expect(page.locator('[data-testid="nav-logger"]')).toBeVisible();
+    await expect(page.locator('[data-testid="nav-datetime"]')).toBeVisible();
+  });
+
+  const libraryRoutes = [
+    { path: "/crypto", title: "@suaveplan/crypto" },
+    { path: "/logger", title: "@suaveplan/logger" },
+    { path: "/datetime", title: "@suaveplan/datetime" },
+    { path: "/i18n", title: "@suaveplan/i18n" },
+    { path: "/feature-flags", title: "@suaveplan/feature-flags" },
+  ];
+
+  for (const route of libraryRoutes) {
+    test(`navigating to ${route.path} shows page-title`, async ({ page }) => {
+      await page.goto(route.path);
+      await expect(page.locator('[data-testid="page-title"]')).toContainText(
+        route.title,
+      );
+    });
+  }
+
+  test("all pages have demo-card and console-panel", async ({ page }) => {
+    const routes = ["/", "/crypto", "/logger", "/datetime", "/i18n", "/feature-flags"];
+    for (const route of routes) {
+      await page.goto(route);
+      await expect(page.locator('[data-testid="demo-card"]')).toBeAttached();
+      await expect(page.locator('[data-testid="console-panel"]')).toBeAttached();
+    }
+  });
+
+  test("home page shows library cards", async ({ page }) => {
+    await page.goto("/");
+    const cards = page.locator('[data-testid="library-card"]');
+    await expect(cards.first()).toBeVisible();
+    const count = await cards.count();
+    expect(count).toBeGreaterThan(5);
+  });
+
+  test("clicking a library card navigates to the page", async ({ page }) => {
+    await page.goto("/");
+    await page.locator('[data-testid="library-card"]').first().click();
+    await expect(page.locator('[data-testid="page-title"]')).toBeVisible();
+  });
+
+  test("404 page renders page-title", async ({ page }) => {
+    await page.goto("/does-not-exist");
+    await expect(page.locator('[data-testid="page-title"]')).toContainText("404");
+  });
+});