Files
medassist-ng/frontend/e2e/stock-status.spec.ts
T
Daniel Volz 98939877db feat: expand Playwright E2E coverage (#155)
* feat: comprehensive Playwright E2E test rewrite

Rewrite all E2E tests with correct CSS selectors, add new spec files,
and implement robust auth handling to work within backend rate limits.

Changes:
- Rewrite fixtures/index.ts with JWT-based /auth/me mock to avoid
  10 req/min rate limit on /auth/me during test runs
- Rewrite auth.setup.ts with offline JWT validity check to reuse
  existing auth state across runs (saves login rate-limit budget)
- Rewrite auth.spec.ts (6 tests) - login page, fields, submit,
  redirect guard, invalid credentials, login/register toggle
- Rewrite dashboard.spec.ts (8 tests) - header, nav tabs,
  navigation, overview/schedules sections, days selector, redirect
- Rewrite medications.spec.ts (8 tests) - form fields, stock
  inventory, package type toggle, intake schedule, save/cancel,
  unsaved changes guard
- Rewrite settings.spec.ts (12 tests) - language, notification
  matrix, thresholds, calculation mode, toggle switch, export/import,
  user menu navigation
- Create planner.spec.ts (9 tests) - form, date inputs, calculate,
  reset, checkbox, submit, tab state, eyebrow heading
- Create schedule.spec.ts (12 tests) - timeline, days selector,
  past/future toggles, day blocks, today highlight, collapse/expand,
  overview table, share button
- Update playwright.config.ts: remove mobile projects, enable
  webServer section for CI
- Add .github/workflows/e2e.yml CI workflow for Playwright tests

Total: 57 E2E tests across 6 spec files, all passing consistently
across 5+ consecutive runs without backend restart.

Closes #154

* feat: add comprehensive E2E data tests with medication CRUD, dashboard, planner, schedule

Add 48 new Playwright E2E tests covering real medication data scenarios:
- medication-crud: 14 tests for create/edit/delete/list via UI form
- dashboard-data: 13 tests for overview table, timeline, dose tracking
- planner-data: 9 tests for demand calculator with results/status chips
- schedule-data: 11 tests for timeline, collapse/expand, dose mark/undo

Infrastructure improvements:
- Add API helpers (createMedicationViaAPI, deleteMedicationViaAPI,
  deleteAllMedicationsViaAPI) with retry logic for rate-limit resilience
- Configure chromium-data project for serial execution with retry:1
- Add /auth/me mock to avoid rate-limit exhaustion on auth endpoint
- Increase navigateTo reliability with networkidle waits
- Increase auth token validity threshold from 2 to 10 minutes
- Make backend rate limit configurable via RATE_LIMIT_MAX env var
- Set RATE_LIMIT_MAX=300 in dev docker-compose for E2E test support

Total suite: 57 empty-state + 48 data tests = 105 tests (chromium)

* test: add E2E tests for medication editing, stock status, and share schedule

- medication-edit.spec.ts: 10 tests covering generic name, notes,
  taken-by add/remove, expiry date, refill, intake schedule editing,
  adding intake rows, reminder toggle, and package type changes
- stock-status.spec.ts: 12 tests verifying dashboard shows correct
  status chips (High/Normal/Warning/Danger) for different stock levels,
  overview table, reorder card, detail modal, and planner integration
- share-schedule.spec.ts: 10 tests for taken-by badges, share button,
  share dialog, link generation, shared schedule page navigation,
  dose tracking on shared page, and notes display
- fixtures/index.ts: add createShareTokenViaAPI, updateSettingsViaAPI
  helpers; expand createMedicationViaAPI with takenBy, notes, expiryDate
- playwright.config.ts: update testMatch/testIgnore for new test files
- docker-compose.dev.yml: increase RATE_LIMIT_MAX to 1000 for E2E tests

* docs: refine release-manager instructions for CLI safety and commit-linked release notes

* fix: resolve PR155 CI failures for frontend lint and e2e proxy

* fix: stabilize auth-related e2e checks in CI
2026-02-12 20:06:11 +01:00

318 lines
12 KiB
TypeScript

import {
authFile,
createMedicationViaAPI,
deleteAllMedicationsViaAPI,
expect,
navigateTo,
type TestMedication,
test,
updateSettingsViaAPI,
} from "./fixtures";
/**
* Stock Status & Coverage E2E Tests
*
* Creates medications with different stock levels, then verifies the dashboard
* overview table shows correct status chips (High, Normal, Low, Critical, Out of Stock).
* Also tests the reorder reminder card and medication detail modal stock info.
*/
test.describe("Stock Status Levels", () => {
test.use({ storageState: authFile });
test.describe.configure({ timeout: 90000 });
// Medication with lots of stock → High status
const MED_HIGH = "StockHigh Vitamin D";
// Medication with moderate stock → Normal status
const MED_NORMAL = "StockNormal Ibuprofen";
// Medication with low stock → Low/Warning status
const MED_LOW = "StockLow Aspirin";
// Medication with very low stock → Critical/Danger status
const MED_CRITICAL = "StockCrit Metformin";
// Medication with zero stock → Out of Stock/Danger
const MED_DEPLETED = "StockEmpty Omeprazol";
const todayMorning = (() => {
const d = new Date();
d.setHours(8, 0, 0, 0);
const pad = (n: number) => n.toString().padStart(2, "0");
return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}T${pad(d.getHours())}:${pad(d.getMinutes())}`;
})();
const createdMeds: TestMedication[] = [];
test.beforeAll(async () => {
await deleteAllMedicationsViaAPI();
// Set stock thresholds:
// lowStockDays=30, criticalStockDays=7, highStockDays=90
// This means:
// > 90 days = High (green high)
// 30-90 days = Normal (green success)
// 7-29 days = Low (yellow warning)
// 1-7 days = Critical (red danger)
// 0 = Out of Stock (red danger)
await updateSettingsViaAPI({
lowStockDays: 30,
criticalStockDays: 7,
expiryWarningDays: 30,
});
// High stock: 300 pills, 1/day = 300 days → High status
createdMeds.push(
await createMedicationViaAPI({
name: MED_HIGH,
packageType: "blister",
packCount: 10,
blistersPerPack: 3,
pillsPerBlister: 10,
intakes: [{ usage: 1, every: 1, start: todayMorning, intakeRemindersEnabled: false }],
})
);
// Normal stock: 60 pills, 1/day = 60 days → Normal status
createdMeds.push(
await createMedicationViaAPI({
name: MED_NORMAL,
genericName: "Ibuprofen 400mg",
packageType: "blister",
packCount: 2,
blistersPerPack: 3,
pillsPerBlister: 10,
intakes: [{ usage: 1, every: 1, start: todayMorning, intakeRemindersEnabled: false }],
})
);
// Low stock: 20 pills, 1/day = 20 days → Low/Warning status
createdMeds.push(
await createMedicationViaAPI({
name: MED_LOW,
packageType: "blister",
packCount: 1,
blistersPerPack: 2,
pillsPerBlister: 10,
intakes: [{ usage: 1, every: 1, start: todayMorning, intakeRemindersEnabled: false }],
})
);
// Critical stock: 5 pills, 1/day = 5 days → Critical/Danger status
createdMeds.push(
await createMedicationViaAPI({
name: MED_CRITICAL,
genericName: "Metformin 500mg",
packageType: "bottle",
totalPills: 5,
looseTablets: 5,
intakes: [{ usage: 1, every: 1, start: todayMorning, intakeRemindersEnabled: false }],
})
);
// Depleted: bottle with stated capacity 1 but 0 pills in stock → Out of Stock
createdMeds.push(
await createMedicationViaAPI({
name: MED_DEPLETED,
packageType: "bottle",
totalPills: 1,
looseTablets: 0,
intakes: [{ usage: 1, every: 1, start: todayMorning, intakeRemindersEnabled: false }],
})
);
});
test.afterAll(async () => {
await deleteAllMedicationsViaAPI();
});
test("should show all medications in overview table", async ({ page }) => {
await navigateTo(page, "/dashboard");
const overviewTable = page.locator(".table.table-7");
await expect(overviewTable).toBeVisible({ timeout: 10000 });
// All 5 medications should appear
await expect(overviewTable.getByText(MED_HIGH)).toBeVisible();
await expect(overviewTable.getByText(MED_NORMAL)).toBeVisible();
await expect(overviewTable.getByText(MED_LOW)).toBeVisible();
await expect(overviewTable.getByText(MED_CRITICAL)).toBeVisible();
await expect(overviewTable.getByText(MED_DEPLETED)).toBeVisible();
});
test("should show High status chip for well-stocked medication", async ({ page }) => {
await navigateTo(page, "/dashboard");
const overviewTable = page.locator(".table.table-7");
await expect(overviewTable).toBeVisible({ timeout: 10000 });
// High stock med row should have a .status-chip.high
const highRow = overviewTable.locator(".table-row").filter({ hasText: MED_HIGH });
await expect(highRow).toBeVisible();
await expect(highRow.locator(".status-chip.high")).toBeVisible();
});
test("should show Normal status chip for moderate stock medication", async ({ page }) => {
await navigateTo(page, "/dashboard");
const overviewTable = page.locator(".table.table-7");
await expect(overviewTable).toBeVisible({ timeout: 10000 });
const normalRow = overviewTable.locator(".table-row").filter({ hasText: MED_NORMAL });
await expect(normalRow).toBeVisible();
await expect(normalRow.locator(".status-chip.success")).toBeVisible();
});
test("should show Warning status chip for low stock medication", async ({ page }) => {
await navigateTo(page, "/dashboard");
const overviewTable = page.locator(".table.table-7");
await expect(overviewTable).toBeVisible({ timeout: 10000 });
const lowRow = overviewTable.locator(".table-row").filter({ hasText: MED_LOW });
await expect(lowRow).toBeVisible();
await expect(lowRow.locator(".status-chip.warning")).toBeVisible();
});
test("should show Danger status chip for critical stock medication", async ({ page }) => {
await navigateTo(page, "/dashboard");
const overviewTable = page.locator(".table.table-7");
await expect(overviewTable).toBeVisible({ timeout: 10000 });
const criticalRow = overviewTable.locator(".table-row").filter({ hasText: MED_CRITICAL });
await expect(criticalRow).toBeVisible();
await expect(criticalRow.locator(".status-chip.danger")).toBeVisible();
});
test("should show Danger status chip for depleted medication", async ({ page }) => {
await navigateTo(page, "/dashboard");
const overviewTable = page.locator(".table.table-7");
await expect(overviewTable).toBeVisible({ timeout: 10000 });
const depletedRow = overviewTable.locator(".table-row").filter({ hasText: MED_DEPLETED });
await expect(depletedRow).toBeVisible();
await expect(depletedRow.locator(".status-chip.danger")).toBeVisible();
});
test("should show days-left and runs-out date in overview", async ({ page }) => {
await navigateTo(page, "/dashboard");
const overviewTable = page.locator(".table.table-7");
await expect(overviewTable).toBeVisible({ timeout: 10000 });
// High stock should show many days (around 299)
const highRow = overviewTable.locator(".table-row").filter({ hasText: MED_HIGH });
const highRowText = await highRow.textContent();
// Should contain a 3-digit number for days
expect(highRowText).toMatch(/\d{2,3}/);
// Depleted should show 0 or very low number
const depletedRow = overviewTable.locator(".table-row").filter({ hasText: MED_DEPLETED });
const depletedText = await depletedRow.textContent();
expect(depletedText).toContain("0");
});
test("should show reorder reminder card with low-stock medications", async ({ page }) => {
await navigateTo(page, "/dashboard");
// The reorder card should mention low-stock medications
const reorderCard = page.locator("article.card").filter({ hasText: /Reorder|low|running|refill/i });
if (await reorderCard.isVisible().catch(() => false)) {
// Should mention at least one of the low stock meds
const cardText = await reorderCard.textContent();
const mentionsLow =
cardText?.includes(MED_LOW) || cardText?.includes(MED_CRITICAL) || cardText?.includes(MED_DEPLETED);
expect(mentionsLow).toBeTruthy();
}
});
test("should color-code stock values depending on status", async ({ page }) => {
await navigateTo(page, "/dashboard");
const overviewTable = page.locator(".table.table-7");
await expect(overviewTable).toBeVisible({ timeout: 10000 });
// High stock row should have success-text class on stock cells
const highRow = overviewTable.locator(".table-row").filter({ hasText: MED_HIGH });
const highStockSpan = highRow.locator("span.success-text, span.high-text").first();
if (await highStockSpan.isVisible().catch(() => false)) {
await expect(highStockSpan).toBeVisible();
}
// Critical stock should have danger-text class
const criticalRow = overviewTable.locator(".table-row").filter({ hasText: MED_CRITICAL });
const criticalSpan = criticalRow.locator("span.danger-text").first();
if (await criticalSpan.isVisible().catch(() => false)) {
await expect(criticalSpan).toBeVisible();
}
// Low stock should have warning-text class
const lowRow = overviewTable.locator(".table-row").filter({ hasText: MED_LOW });
const warningSpan = lowRow.locator("span.warning-text").first();
if (await warningSpan.isVisible().catch(() => false)) {
await expect(warningSpan).toBeVisible();
}
});
test("should open medication detail modal showing stock info", async ({ page }) => {
await navigateTo(page, "/dashboard");
const overviewTable = page.locator(".table.table-7");
await expect(overviewTable).toBeVisible({ timeout: 10000 });
// Click on the critical stock medication row
const criticalRow = overviewTable.locator(".table-row").filter({ hasText: MED_CRITICAL });
await criticalRow.click();
const modal = page.locator(".modal-overlay");
await expect(modal).toBeVisible({ timeout: 5000 });
await expect(modal.getByText(MED_CRITICAL)).toBeVisible();
// Modal should show stock/coverage details
const modalText = await modal.textContent();
expect(modalText).toBeTruthy();
// Close modal
await page.locator("button.modal-close").click();
await expect(modal).not.toBeVisible();
});
test("should show generic name in overview for medications that have one", async ({ page }) => {
await navigateTo(page, "/dashboard");
const overviewTable = page.locator(".table.table-7");
await expect(overviewTable).toBeVisible({ timeout: 10000 });
// Click on the normal stock med (has generic name "Ibuprofen 400mg")
const normalRow = overviewTable.locator(".table-row").filter({ hasText: MED_NORMAL });
await normalRow.click();
const modal = page.locator(".modal-overlay");
await expect(modal).toBeVisible({ timeout: 5000 });
// Modal should show the generic name somewhere
await expect(modal.getByText("Ibuprofen 400mg")).toBeVisible();
await page.locator("button.modal-close").click();
});
test("should show different stock levels in planner results", async ({ page }) => {
await navigateTo(page, "/planner");
await page.waitForLoadState("networkidle");
// Calculate for 30-day default range
await page.locator('form.planner button[type="submit"]').click();
await expect(page.locator(".table")).toBeVisible({ timeout: 15000 });
const resultsTable = page.locator(".table");
// Should show status chips with different levels
const successChips = resultsTable.locator(".status-chip.success");
const dangerChips = resultsTable.locator(".status-chip.danger");
const warningChips = resultsTable.locator(".status-chip.warning");
const totalChips = (await successChips.count()) + (await dangerChips.count()) + (await warningChips.count());
expect(totalChips).toBeGreaterThanOrEqual(2);
// The depleted/critical meds should have danger chips
expect(await dangerChips.count()).toBeGreaterThanOrEqual(1);
});
});