test: refactoring playwright test structure
This commit is contained in:
@@ -0,0 +1,417 @@
|
||||
import type { Locator, Page } from "@playwright/test";
|
||||
import { expect } from "@playwright/test";
|
||||
|
||||
export async function runCableMonitoringTest(page: Page) {
|
||||
await page.goto("/kabelueberwachung");
|
||||
|
||||
// Logo
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.getByRole("img", { name: "Logo", exact: true })
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
// TALAS Logo
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.getByRole("img", { name: "TALAS Logo" })
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
// Meldestation
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.getByRole("heading", { name: "Meldestation" })
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
// CPLV4 Ismail Rastede
|
||||
await highlightAndExpectVisible(page, page.getByText("CPLV4 Ismail Rastede"));
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
// Rack Buttons
|
||||
for (const rack of [1, 2, 3, 4, 1]) {
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.getByRole("button", { name: `Rack ${rack}` })
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
}
|
||||
|
||||
// Kabel 1
|
||||
await highlightAndExpectVisible(page, page.getByText("1", { exact: true }));
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.locator("div").filter({ hasText: /^8$/ })
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page
|
||||
.locator("div")
|
||||
.filter({ hasText: /^1KÜ705-FO⚙$/ })
|
||||
.getByRole("heading")
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(page, page.getByText("1", { exact: true }));
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page
|
||||
.locator("div")
|
||||
.filter({ hasText: /^1KÜ705-FO⚙$/ })
|
||||
.getByRole("button")
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.locator(".flex.flex-col > span").first()
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.locator(".w-\\[0\\.625rem\\]").first()
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.locator("span:nth-child(2)").first()
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page
|
||||
.locator(".w-\\[0\\.625rem\\].h-\\[0\\.625rem\\].rounded-full.bg-red-500")
|
||||
.first()
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(page, page.getByText("Erdschluss").first());
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.locator(".text-center > span:nth-child(2)").first()
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.getByText(/^RSL: \d+,\d{3} kOhm$/).first()
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(page, page.getByText("Kabel 1"));
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.locator(".text-black.text-\\[0\\.625rem\\].font-semibold").first()
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.locator(".bg-littwin-blue.text-white.text-\\[0\\.625rem\\]").first()
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.locator(".flex > button:nth-child(2)").first()
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.locator(".bg-littwin-blue.text-white.cursor-pointer").first()
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(page, page.getByText("V4.20"));
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
// Kabel 8
|
||||
await highlightAndExpectVisible(page, page.getByText("8", { exact: true }));
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page
|
||||
.locator("div")
|
||||
.filter({ hasText: /^8KÜ705-FO⚙$/ })
|
||||
.getByRole("heading")
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page
|
||||
.locator("div")
|
||||
.filter({ hasText: /^8KÜ705-FO⚙$/ })
|
||||
.getByRole("button")
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page
|
||||
.locator(
|
||||
"div:nth-child(8) > .relative.bg-gray-300 > .relative.w-\\[7\\.075rem\\] > .flex.flex-col.mt-\\[0\\.625rem\\] > .flex.items-center.space-x-\\[0\\.25rem\\] > .flex.flex-col.items-start > span"
|
||||
)
|
||||
.first()
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.locator(
|
||||
"div:nth-child(8) > .relative.bg-gray-300 > .relative.w-\\[7\\.075rem\\] > .flex.flex-col.mt-\\[0\\.625rem\\] > .flex.items-center.space-x-\\[0\\.25rem\\] > .flex.flex-col.items-start > span:nth-child(2)"
|
||||
)
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.locator(
|
||||
"div:nth-child(8) > .relative.bg-gray-300 > .relative.w-\\[7\\.075rem\\] > .flex.flex-col.mt-\\[0\\.625rem\\] > .flex.items-center.space-x-\\[0\\.25rem\\] > .flex.flex-col.items-center > .w-\\[0\\.625rem\\].h-\\[0\\.625rem\\].bg-green-500"
|
||||
)
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.locator(
|
||||
"div:nth-child(8) > .relative.bg-gray-300 > .relative.w-\\[7\\.075rem\\] > .flex.flex-col.mt-\\[0\\.625rem\\] > .flex.items-center.space-x-\\[0\\.25rem\\] > .flex.flex-col.items-center > .w-\\[0\\.625rem\\].h-\\[0\\.625rem\\].rounded-full.bg-red-500"
|
||||
)
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(page, page.getByText("Isolationsfehler"));
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.locator(
|
||||
"div:nth-child(8) > .relative.bg-gray-300 > .relative.w-\\[7\\.075rem\\] > .relative.mt-\\[3\\.125rem\\] > .text-center > span:nth-child(2)"
|
||||
)
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.getByText(/^RSL: \d+,\d{3} kOhm$/).nth(3)
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(page, page.getByText("Kabel 8"));
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.locator(".bg-littwin-blue.text-white.text-\\[0\\.625rem\\]").first()
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
// ... (weitere Schritte können nach diesem Muster ergänzt werden)
|
||||
|
||||
// Beispiel für weitere Schritte aus dem Kommentar:
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.locator(".bg-littwin-blue.text-white.text-\\[0\\.625rem\\]").first()
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
await page
|
||||
.locator(".bg-littwin-blue.text-white.text-\\[0\\.625rem\\]")
|
||||
.first()
|
||||
.click();
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.getByRole("heading", { name: "Isolationswiderstand" })
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
await page.getByRole("heading", { name: "Isolationswiderstand" }).click();
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(page, page.getByText("KÜ 1"));
|
||||
await page.waitForTimeout(400);
|
||||
await page.getByText("KÜ 1").click();
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(page, page.getByText("Von"));
|
||||
await page.waitForTimeout(400);
|
||||
await page.getByText("Von").click();
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.locator("div").filter({ hasText: /^Von$/ }).getByRole("textbox")
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
await page
|
||||
.locator("div")
|
||||
.filter({ hasText: /^Von$/ })
|
||||
.getByRole("textbox")
|
||||
.click();
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(page, page.getByText("Bis"));
|
||||
await page.waitForTimeout(400);
|
||||
await page.getByText("Bis").click();
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.locator("div").filter({ hasText: /^Bis$/ }).getByRole("textbox")
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
await page
|
||||
.locator("div")
|
||||
.filter({ hasText: /^Bis$/ })
|
||||
.getByRole("textbox")
|
||||
.click();
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.getByRole("button", { name: "Alle Messwerte" })
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
await page.getByRole("button", { name: "Alle Messwerte" }).click();
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.getByRole("option", { name: "Stündliche Werte" })
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
await page.getByRole("option", { name: "Stündliche Werte" }).click();
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.getByRole("button", { name: "Stündliche Werte" })
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.getByRole("button", { name: "Daten laden" })
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(page, page.locator("canvas"));
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.getByRole("button", { name: "" })
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.getByRole("button", { name: "" })
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.getByRole("button", { name: "Messkurve" })
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
await page.getByRole("button", { name: "Messkurve" }).click();
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.getByRole("option", { name: "Meldungen" })
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
await page.getByRole("option", { name: "Meldungen" }).click();
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.getByRole("cell", { name: "Prio" })
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.getByRole("cell", { name: "Zeitstempel" })
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.getByRole("cell", { name: "Quelle" })
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.getByRole("cell", { name: "Meldung" })
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
await highlightAndExpectVisible(
|
||||
page,
|
||||
page.getByRole("cell", { name: "Status" })
|
||||
);
|
||||
await page.waitForTimeout(400);
|
||||
|
||||
// ...weitere Schritte können nach diesem Muster ergänzt werden
|
||||
}
|
||||
|
||||
//---------------------------------------------------------------------
|
||||
|
||||
export async function highlightAndExpectVisible(
|
||||
page: Page,
|
||||
locator: Locator,
|
||||
durationMs = 800
|
||||
) {
|
||||
// CSS nur einmal pro Page injizieren
|
||||
const alreadyInjected = await page.evaluate(
|
||||
() => (window as any).__pwForceCssInjected === true
|
||||
);
|
||||
|
||||
if (!alreadyInjected) {
|
||||
await page.addStyleTag({
|
||||
content: `
|
||||
.pw-force-outline {
|
||||
outline: 3px solid #ff1744 !important;
|
||||
outline-offset: 2px !important;
|
||||
box-shadow: 0 0 0 3px rgba(224,0,43,.35) !important;
|
||||
}
|
||||
`,
|
||||
});
|
||||
await page.evaluate(() => {
|
||||
(window as any).__pwForceCssInjected = true;
|
||||
});
|
||||
}
|
||||
|
||||
const els = await locator.elementHandles();
|
||||
for (const el of els) {
|
||||
await el.evaluate((node: unknown, ms: number) => {
|
||||
const n = node as HTMLElement;
|
||||
n.classList.add("pw-force-outline");
|
||||
window.setTimeout(() => n.classList.remove("pw-force-outline"), ms);
|
||||
}, durationMs);
|
||||
}
|
||||
|
||||
await expect(locator).toBeVisible();
|
||||
}
|
||||
Reference in New Issue
Block a user