Files
CPLv4.0/tests/kabelueberwachung-overlays.spec.ts

95 lines
3.3 KiB
TypeScript

import { test, expect, Page, Locator } from "@playwright/test";
// Helpers
function cardByCableName(page: Page, name: string): Locator {
// Find a module card that contains the visible cable name text
return page.locator("div.relative.bg-gray-300", { hasText: name }).first();
}
function slotOverlayIn(card: Locator): Locator {
// Slot overlay is the only element with absolute inset-0 inside the card
return card.locator("div.absolute.inset-0");
}
async function setDeviceEvents(
page: Page,
{ ksx, ksy, ksz }: { ksx?: number[]; ksy?: number[]; ksz?: number[] }
) {
await page.evaluate(
({ ksx, ksy, ksz }) => {
interface W {
loopMeasurementEvent?: number[];
tdrMeasurementEvent?: number[];
alignmentEvent?: number[];
}
const w = window as unknown as W;
if (ksx) w.loopMeasurementEvent = ksx;
if (ksy) w.tdrMeasurementEvent = ksy;
if (ksz) w.alignmentEvent = ksz;
},
{ ksx, ksy, ksz }
);
}
// Notes:
// - On /kabelueberwachung, the global overlay is hidden and each module shows its own overlay when active.
// - DeviceEventsBridge polls the window arrays every 2 seconds.
// - Dev mode serves /api/cpl/kabelueberwachungAPIHandler which initializes those arrays from mocks.
test.describe("Kabelüberwachung per-slot overlays", () => {
test.beforeEach(async ({ page }) => {
await page.goto("http://localhost:3000/kabelueberwachung");
// Ensure page has rendered modules
await expect(page.getByText("Rack 1")).toBeVisible();
// Wait a moment for initial device arrays and first poll
await page.waitForTimeout(2500);
});
test("only active slot is blocked; others remain usable", async ({
page,
}) => {
const card1 = cardByCableName(page, "Kabel 1"); // slot 1 (index 0) has events in mock
const card2 = cardByCableName(page, "Kabel 2"); // slot 2 (index 1) is inactive in mock
// 1) Initial: overlay visible on Kabel 1, not on Kabel 2
await expect(slotOverlayIn(card1)).toBeVisible();
await expect(slotOverlayIn(card2)).toHaveCount(0);
// 2) Interact with Kabel 2 while Kabel 1 is blocked
await expect(card2.getByRole("button", { name: "ISO" })).toBeVisible();
await card2.getByRole("button", { name: "ISO" }).click();
// ISO modal should open
await expect(page.getByText("Isolationswiderstand")).toBeVisible();
// Close modal with Escape
await page.keyboard.press("Escape");
await expect(page.getByText("Isolationswiderstand")).toHaveCount(0);
// 3) Dynamically switch overlay from Kabel 1 to Kabel 2
const zero = new Array(32).fill(0);
const ksx = zero.slice();
ksx[1] = 1; // activate Schleife for slot 2
await setDeviceEvents(page, { ksx });
// Wait for bridge poll and UI update
await page.waitForTimeout(2500);
await expect(slotOverlayIn(card1)).toHaveCount(0);
await expect(slotOverlayIn(card2)).toBeVisible();
// Percentage text should show in the overlay (e.g., "12%")
await expect(slotOverlayIn(card2).getByText(/%$/)).toBeVisible();
});
test("global overlay is not shown on kabelueberwachung page", async ({
page,
}) => {
// A full-screen overlay would be fixed inset-0 at document level; ensure none
const globalOverlay = page.locator(
'div.fixed.inset-0:has-text("Bitte warten…")'
);
await expect(globalOverlay).toHaveCount(0);
});
});