mirror of
https://github.com/amir20/dozzle.git
synced 2026-08-07 10:54:44 +00:00
Amir Raminfar
fe6549e5f5
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>
31 lines
1.3 KiB
TypeScript
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);
|
|
});
|
|
});
|