Implementation Engineer
e9da21b57e
- composables/useApi.ts: base API client with runtimeConfig - composables/useEquipment.ts: equipment API wrapper (list, detail, categories) - components/EquipmentCard.vue: card with image/placeholder, badge, name, price, add-to-cart - pages/mietkatalog.vue: SSR list with search, category chips, sort, pagination, skeleton, empty/error states - pages/mietkatalog/[id].vue: SSR detail with specs table, related items, breadcrumb, add-to-cart - nuxt.config.ts: runtimeConfig with apiBase - 101 vitest tests passing (5 files) - Build: 0 errors, 2.09 MB
55 lines
2.2 KiB
TypeScript
55 lines
2.2 KiB
TypeScript
import { test, expect } from "@playwright/test";
|
|
|
|
test.describe("Equipment Detail Page", () => {
|
|
test("should show error for non-existent ID", async ({ page }) => {
|
|
await page.goto("/mietkatalog/999999");
|
|
await expect(page.getByText("nicht gefunden")).toBeVisible();
|
|
});
|
|
|
|
test("should have link back to mietkatalog on error", async ({ page }) => {
|
|
await page.goto("/mietkatalog/999999");
|
|
const link = page.getByText("Zurück zum Mietkatalog");
|
|
await expect(link).toBeVisible();
|
|
});
|
|
|
|
test("should display breadcrumb navigation", async ({ page }) => {
|
|
await page.goto("/mietkatalog/1");
|
|
await expect(page.getByText("Home")).toBeVisible();
|
|
await expect(page.getByText("Mietkatalog")).toBeVisible();
|
|
});
|
|
|
|
test("should show equipment name as heading", async ({ page }) => {
|
|
await page.goto("/mietkatalog/1");
|
|
const name = page.getByTestId("equipment-name");
|
|
const errorState = page.getByText("nicht gefunden");
|
|
const hasContent = await name.isVisible().catch(() => false) || await errorState.isVisible().catch(() => false);
|
|
expect(hasContent).toBeTruthy();
|
|
});
|
|
|
|
test("should show specs section if equipment found", async ({ page }) => {
|
|
await page.goto("/mietkatalog/1");
|
|
const specs = page.getByTestId("equipment-specs");
|
|
const errorState = page.getByText("nicht gefunden");
|
|
const hasContent = await specs.isVisible().catch(() => false) || await errorState.isVisible().catch(() => false);
|
|
expect(hasContent).toBeTruthy();
|
|
});
|
|
|
|
test("should have Mietanfrage button", async ({ page }) => {
|
|
await page.goto("/mietkatalog/1");
|
|
const btn = page.getByTestId("add-to-cart-detail");
|
|
const errorState = page.getByText("nicht gefunden");
|
|
const hasContent = await btn.isVisible().catch(() => false) || await errorState.isVisible().catch(() => false);
|
|
expect(hasContent).toBeTruthy();
|
|
});
|
|
|
|
test("should navigate back to mietkatalog via breadcrumb", async ({ page }) => {
|
|
await page.goto("/mietkatalog/1");
|
|
const breadcrumbLink = page.locator('a[href="/mietkatalog"]').first();
|
|
if (await breadcrumbLink.isVisible()) {
|
|
await breadcrumbLink.click();
|
|
await page.waitForURL("/mietkatalog");
|
|
await expect(page).toHaveURL(/\/mietkatalog$/);
|
|
}
|
|
});
|
|
});
|