chore: Add Playwright tests scaffolding and initial tests

astro/.gitignore

@@ -24,3 +24,8 @@ pnpm-debug.log*
 .vscode
 # Local Netlify folder
 .netlify
+
+# Playwright
+test-results/
+playwright-report/
+playwright/.cache/

astro/package.json

@@ -7,7 +7,9 @@
     "start": "astro dev",
     "build": "astro build",
     "preview": "astro preview",
-    "astro": "astro"
+    "astro": "astro",
+    "test:e2e": "playwright test",
+    "test:e2e:ui": "playwright test --ui"
   },
   "dependencies": {
     "@astrojs/mdx": "4.3.13",
@@ -31,6 +33,8 @@
     "sass": "1.77.5"
   },
   "devDependencies": {
+    "@axe-core/playwright": "^4.11.3",
+    "@playwright/test": "^1.59.1",
     "@types/lodash-es": "^4.17.12",
     "prettier": "^3.2.5",
     "prettier-plugin-astro": "^0.14.0"

astro/playwright.config.ts

@@ -0,0 +1,25 @@
+import { defineConfig, devices } from "@playwright/test";
+
+export default defineConfig({
+  testDir: "./tests/e2e",
+  fullyParallel: true,
+  forbidOnly: !!process.env.CI,
+  retries: process.env.CI ? 2 : 0,
+  reporter: "html",
+  use: {
+    baseURL: "http://localhost:4321",
+    trace: "on-first-retry",
+  },
+  projects: [
+    {
+      name: "chromium",
+      use: { ...devices["Desktop Chrome"] },
+    },
+  ],
+  webServer: {
+    command: "npm run dev",
+    url: "http://localhost:4321",
+    reuseExistingServer: !process.env.CI,
+    timeout: 120_000,
+  },
+});

astro/tests/e2e/blog-authors.spec.ts

@@ -0,0 +1,51 @@
+import AxeBuilder from "@axe-core/playwright";
+import { expect, test } from "@playwright/test";
+
+test.describe("Blog authors index (/blog/authors/)", () => {
+  test("renders author names as strings, not [object Object]", async ({ page }) => {
+    await page.goto("/blog/authors/");
+
+    await expect(page.locator("body")).not.toContainText("[object Object]");
+    await expect(
+      page.getByRole("link", { name: /Rachael Bradley Montgomery/i }),
+    ).toBeVisible();
+  });
+
+  test("axe accessibility scan (informational, not gating)", async ({ page }) => {
+    await page.goto("/blog/authors/");
+    const results = await new AxeBuilder({ page }).analyze();
+    expect(results.violations).toEqual([]);
+  });
+});
+
+test.describe("Author detail page (/blog/authors/rachael-bradley-montgomery/)", () => {
+  const path = "/blog/authors/rachael-bradley-montgomery/";
+
+  test("header shows formatted author name, not [object Object]", async ({ page }) => {
+    await page.goto(path);
+
+    await expect(page.locator("body")).not.toContainText("[object Object]");
+    await expect(page.locator("body")).toContainText(
+      "Blogs by Rachael Bradley Montgomery",
+    );
+  });
+
+  test("breadcrumbs show ancestors and formatted author name as current page", async ({ page }) => {
+    await page.goto(path);
+
+    const nav = page.getByRole("navigation", { name: "Breadcrumb" });
+    await expect(nav).toBeVisible();
+
+    await expect(nav.getByRole("link")).toHaveText(["Home", "Blog", "Authors"]);
+
+    const current = nav.locator('[aria-current="page"]');
+    await expect(current).toHaveText("Blogs by Rachael Bradley Montgomery");
+    await expect(current).not.toContainText("[object Object]");
+  });
+
+  test("axe accessibility scan (informational, not gating)", async ({ page }) => {
+    await page.goto(path);
+    const results = await new AxeBuilder({ page }).analyze();
+    expect(results.violations).toEqual([]);
+  });
+});