✅ Add items and admin tests, and refactor existing ones (#2146)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2026-01-23 17:27:17 +01:00
parent 64eac127f0
commit 43fac49a14
6 changed files with 403 additions and 94 deletions
--- a/frontend/tests/items.spec.ts
+++ b/frontend/tests/items.spec.ts
@@ -0,0 +1,132 @@
+import { expect, test } from "@playwright/test"
+import { createUser } from "./utils/privateApi"
+import {
+  randomEmail,
+  randomItemDescription,
+  randomItemTitle,
+  randomPassword,
+} from "./utils/random"
+import { logInUser } from "./utils/user"
+
+test("Items page is accessible and shows correct title", async ({ page }) => {
+  await page.goto("/items")
+  await expect(page.getByRole("heading", { name: "Items" })).toBeVisible()
+  await expect(page.getByText("Create and manage your items")).toBeVisible()
+})
+
+test("Add Item button is visible", async ({ page }) => {
+  await page.goto("/items")
+  await expect(page.getByRole("button", { name: "Add Item" })).toBeVisible()
+})
+
+test.describe("Items management", () => {
+  test.use({ storageState: { cookies: [], origins: [] } })
+  let email: string
+  const password = randomPassword()
+
+  test.beforeAll(async () => {
+    email = randomEmail()
+    await createUser({ email, password })
+  })
+
+  test.beforeEach(async ({ page }) => {
+    await logInUser(page, email, password)
+    await page.goto("/items")
+  })
+
+  test("Create a new item successfully", async ({ page }) => {
+    const title = randomItemTitle()
+    const description = randomItemDescription()
+
+    await page.getByRole("button", { name: "Add Item" }).click()
+    await page.getByLabel("Title").fill(title)
+    await page.getByLabel("Description").fill(description)
+    await page.getByRole("button", { name: "Save" }).click()
+
+    await expect(page.getByText("Item created successfully")).toBeVisible()
+    await expect(page.getByText(title)).toBeVisible()
+  })
+
+  test("Create item with only required fields", async ({ page }) => {
+    const title = randomItemTitle()
+
+    await page.getByRole("button", { name: "Add Item" }).click()
+    await page.getByLabel("Title").fill(title)
+    await page.getByRole("button", { name: "Save" }).click()
+
+    await expect(page.getByText("Item created successfully")).toBeVisible()
+    await expect(page.getByText(title)).toBeVisible()
+  })
+
+  test("Cancel item creation", async ({ page }) => {
+    await page.getByRole("button", { name: "Add Item" }).click()
+    await page.getByLabel("Title").fill("Test Item")
+    await page.getByRole("button", { name: "Cancel" }).click()
+
+    await expect(page.getByRole("dialog")).not.toBeVisible()
+  })
+
+  test("Title is required", async ({ page }) => {
+    await page.getByRole("button", { name: "Add Item" }).click()
+    await page.getByLabel("Title").fill("")
+    await page.getByLabel("Title").blur()
+
+    await expect(page.getByText("Title is required")).toBeVisible()
+  })
+
+  test.describe("Edit and Delete", () => {
+    let itemTitle: string
+
+    test.beforeEach(async ({ page }) => {
+      itemTitle = randomItemTitle()
+
+      await page.getByRole("button", { name: "Add Item" }).click()
+      await page.getByLabel("Title").fill(itemTitle)
+      await page.getByRole("button", { name: "Save" }).click()
+      await expect(page.getByText("Item created successfully")).toBeVisible()
+      await expect(page.getByRole("dialog")).not.toBeVisible()
+    })
+
+    test("Edit an item successfully", async ({ page }) => {
+      const itemRow = page.getByRole("row").filter({ hasText: itemTitle })
+      await itemRow.getByRole("button").last().click()
+      await page.getByRole("menuitem", { name: "Edit Item" }).click()
+
+      const updatedTitle = randomItemTitle()
+      await page.getByLabel("Title").fill(updatedTitle)
+      await page.getByRole("button", { name: "Save" }).click()
+
+      await expect(page.getByText("Item updated successfully")).toBeVisible()
+      await expect(page.getByText(updatedTitle)).toBeVisible()
+    })
+
+    test("Delete an item successfully", async ({ page }) => {
+      const itemRow = page.getByRole("row").filter({ hasText: itemTitle })
+      await itemRow.getByRole("button").last().click()
+      await page.getByRole("menuitem", { name: "Delete Item" }).click()
+
+      await page.getByRole("button", { name: "Delete" }).click()
+
+      await expect(
+        page.getByText("The item was deleted successfully"),
+      ).toBeVisible()
+      await expect(page.getByText(itemTitle)).not.toBeVisible()
+    })
+  })
+})
+
+test.describe("Items empty state", () => {
+  test.use({ storageState: { cookies: [], origins: [] } })
+
+  test("Shows empty state message when no items exist", async ({ page }) => {
+    const email = randomEmail()
+    const password = randomPassword()
+    await createUser({ email, password })
+    await logInUser(page, email, password)
+
+    await page.goto("/items")
+
+    await expect(page.getByText("You don't have any items yet")).toBeVisible()
+    await expect(page.getByText("Add a new item to get started")).toBeVisible()
+  })
+})