Files
dozzle/e2e/mobile-stats.spec.ts
Amir Raminfar fe6549e5f5 test: add critical int tests for mobile container stats
Covers the dashboard's CPU/mem stat badges and the invariant behind
the "mobile status bar" fix from #4862: the sticky stats header must
sit flush under the fixed mobile nav, with no gap or overlap. Adds a
data-testid to ScrollableView's header so the test doesn't rely on
CSS selectors.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-26 19:07:39 -07:00

31 lines
1.3 KiB
TypeScript

import { test, expect, devices } from "@playwright/test";
test.use({ ...devices["Pixel 5"] });
test.describe("mobile stats", () => {
test.beforeEach(async ({ page }) => {
await page.goto("http://dozzle:8080/");
});
test("shows CPU and memory stats for containers on the dashboard", async ({ page }) => {
const row = page.locator("tr").filter({ has: page.getByTitle("dozzle") });
await expect(row.getByText(/^\d+%$/)).toBeVisible();
await expect(row.getByText(/^[\d.]+ ?[KMGT]?B$/)).toBeVisible();
});
test("locks the container stats header directly under the mobile nav, with no gap or overlap", async ({ page }) => {
const row = page.locator("tr").filter({ has: page.getByTitle("dozzle") });
await row.getByTitle("dozzle").click();
await expect(page).toHaveURL(/\/container\//);
const nav = await page.getByTestId("navigation").boundingBox();
const header = await page.getByTestId("scrollable-header").boundingBox();
expect(nav).not.toBeNull();
expect(header).not.toBeNull();
// The stats header must sit flush against the bottom of the fixed nav bar:
// any gap exposes empty space, any overlap clips the CPU/MEM chips underneath the nav.
expect(Math.abs(header!.y - (nav!.y + nav!.height))).toBeLessThanOrEqual(1);
});
});