Covers dashboard card rendering (item count, nav links, active thread/setup counts) and collection page (gear display, search, category filter, tab switching). Updates playwright config to serve production build with pre-seeded test DB. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
90 lines
2.9 KiB
TypeScript
90 lines
2.9 KiB
TypeScript
import { expect, test } from "@playwright/test";
|
|
|
|
test.describe("Collection page", () => {
|
|
test.beforeEach(async ({ page }) => {
|
|
await page.goto("/collection");
|
|
await page.waitForLoadState("networkidle");
|
|
});
|
|
|
|
test.describe("Gear tab", () => {
|
|
test("shows seeded items", async ({ page }) => {
|
|
await expect(page.getByText("Zpacks Duplex")).toBeVisible();
|
|
await expect(page.getByText("BRS-3000T Stove")).toBeVisible();
|
|
});
|
|
|
|
test("search filters items by name", async ({ page }) => {
|
|
const searchInput = page.getByPlaceholder("Search items...");
|
|
await searchInput.fill("Zpacks");
|
|
await expect(page.getByText("Zpacks Duplex")).toBeVisible();
|
|
// Other items should not be visible
|
|
await expect(page.getByText("BRS-3000T Stove")).not.toBeVisible();
|
|
});
|
|
|
|
test("clearing search restores all items", async ({ page }) => {
|
|
const searchInput = page.getByPlaceholder("Search items...");
|
|
await searchInput.fill("Zpacks");
|
|
await expect(page.getByText("BRS-3000T Stove")).not.toBeVisible();
|
|
// Clear the search
|
|
await searchInput.clear();
|
|
await expect(page.getByText("BRS-3000T Stove")).toBeVisible();
|
|
});
|
|
|
|
test("category filter dropdown opens and lists categories", async ({
|
|
page,
|
|
}) => {
|
|
const filterButton = page.getByRole("button", {
|
|
name: /all categories/i,
|
|
});
|
|
await filterButton.click();
|
|
|
|
// Dropdown list (ul) contains the category options
|
|
const dropdown = page.locator("ul");
|
|
await expect(
|
|
dropdown.getByRole("button", { name: "Shelter" }),
|
|
).toBeVisible();
|
|
await expect(
|
|
dropdown.getByRole("button", { name: "Cook Kit" }),
|
|
).toBeVisible();
|
|
});
|
|
|
|
test("category filter shows only items in selected category", async ({
|
|
page,
|
|
}) => {
|
|
// Open filter dropdown
|
|
const filterButton = page.getByRole("button", {
|
|
name: /all categories/i,
|
|
});
|
|
await filterButton.click();
|
|
|
|
// Select "Shelter" from the dropdown list
|
|
const dropdown = page.locator("ul");
|
|
await dropdown.getByRole("button", { name: "Shelter" }).click();
|
|
|
|
await expect(page.getByText("Zpacks Duplex")).toBeVisible();
|
|
// Items from other categories should not be visible
|
|
await expect(page.getByText("BRS-3000T Stove")).not.toBeVisible();
|
|
});
|
|
});
|
|
|
|
test.describe("Tab switching", () => {
|
|
test("navigates to planning tab", async ({ page }) => {
|
|
await page.goto("/collection?tab=planning");
|
|
await page.waitForLoadState("networkidle");
|
|
// Planning tab shows the active thread
|
|
await expect(page.getByText("New Backpack")).toBeVisible();
|
|
});
|
|
|
|
test("navigates to setups tab", async ({ page }) => {
|
|
await page.goto("/collection?tab=setups");
|
|
await page.waitForLoadState("networkidle");
|
|
// Setups tab shows the seeded setup
|
|
await expect(page.getByText("Weekend Overnighter")).toBeVisible();
|
|
});
|
|
|
|
test("gear tab is default and shows items", async ({ page }) => {
|
|
// Default tab (no ?tab param) shows gear
|
|
await expect(page.getByText("Zpacks Duplex")).toBeVisible();
|
|
});
|
|
});
|
|
});
|