Ismail/CPLv4.0
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

playwright: analoge Eingänge Test erfolgreich

Browse Source
This commit is contained in:
ISA
2025-08-14 14:05:21 +02:00
parent fa92004d94
commit 08370cf898
6 changed files with 127 additions and 154 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
.env.development
View File

@@ -6,6 +6,6 @@ NEXT_PUBLIC_USE_MOCK_BACKEND_LOOP_START=false
NEXT_PUBLIC_EXPORT_STATIC=false
NEXT_PUBLIC_USE_CGI=false
# App-Versionsnummer
NEXT_PUBLIC_APP_VERSION=1.6.720
NEXT_PUBLIC_APP_VERSION=1.6.721
NEXT_PUBLIC_CPL_MODE=json # json (Entwicklungsumgebung) oder jsSimulatedProd (CPL ->CGI-Interface-Simulator) oder production (CPL-> CGI-Interface Platzhalter)

2
.env.production
View File

@@ -5,5 +5,5 @@ NEXT_PUBLIC_CPL_API_PATH=/CPL
NEXT_PUBLIC_EXPORT_STATIC=true
NEXT_PUBLIC_USE_CGI=true
# App-Versionsnummer
NEXT_PUBLIC_APP_VERSION=1.6.720
NEXT_PUBLIC_APP_VERSION=1.6.721
NEXT_PUBLIC_CPL_MODE=production

5
CHANGELOG.md
View File

@@ -1,3 +1,8 @@
## [1.6.721] – 2025-08-14
- Playwright : ausgewählte Element rot färben
---
## [1.6.720] – 2025-08-14
- doc: comment in test for analog inputs

4
package-lock.json generated
View File

@@ -1,12 +1,12 @@
{
"name": "cpl-v4",
"version": "1.6.720",
"version": "1.6.721",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "cpl-v4",
"version": "1.6.720",
"version": "1.6.721",
"dependencies": {
"@fontsource/roboto": "^5.1.0",
"@headlessui/react": "^2.2.4",

2
package.json
View File

@@ -1,6 +1,6 @@
{
"name": "cpl-v4",
"version": "1.6.720",
"version": "1.6.721",
"private": true,
"scripts": {
"dev": "next dev",

266
playwright/tests/analogInputs.spec.ts
View File

@@ -22,83 +22,16 @@ async function forceHighlight(page: Page, locator: Locator, durationMs = 800) {
}
}
async function forceHighlightRow(
// Expect helper: highlight element while asserting it's visible
async function expectVisibleWithHighlight(
page: Page,
rowLocator: Locator,
locator: Locator,
durationMs = 800
) {
await ensureForceCss(page);
const rows = await rowLocator.elementHandles();
for (const row of rows) {
await row.evaluate((r: unknown, ms: number) => {
const root = r as HTMLElement;
const all = [
root,
...Array.from(root.querySelectorAll<HTMLElement>("*")),
];
all.forEach((el) => el.classList.add("pw-force-outline"));
window.setTimeout(
() => all.forEach((el) => el.classList.remove("pw-force-outline")),
ms
);
}, durationMs);
}
await forceHighlight(page, locator, durationMs);
await expect(locator).toBeVisible();
}
async function installLocalHighlighter(page: import("@playwright/test").Page) {
await page.addInitScript(() => {
type PWWindow = Window & { __pw_local_highlighter__?: boolean };
const w = window as unknown as PWWindow;
if (w.__pw_local_highlighter__) return;
w.__pw_local_highlighter__ = true;
const style = document.createElement("style");
style.innerHTML = `
.__pw-highlight__ { outline: 3px solid #ff1744 !important; outline-offset: 2px !important; box-shadow: 0 0 0 2px rgba(255,23,68,.25) !important; }
.__pw-highlight-click__ { outline: 4px solid #e0002b !important; outline-offset: 2px !important; box-shadow: 0 0 0 3px rgba(224,0,43,.35) !important; }
.__pw-highlight-row__ * { outline: 2px dashed rgba(255,23,68,.8) !important; outline-offset: 1px !important; }
`;
document.head.appendChild(style);
let lastEl: Element | null = null;
let lastRow: Element | null = null;
let clickTimeout: number | undefined;
function mark(el: EventTarget | null) {
if (!(el instanceof Element)) return;
if (lastEl && lastEl !== el) lastEl.classList.remove("__pw-highlight__");
lastEl = el;
lastEl.classList.add("__pw-highlight__");
const row = (el.closest &&
(el.closest("tr") || el.closest('[role="row"]'))) as Element | null;
if (lastRow && lastRow !== row)
lastRow.classList.remove("__pw-highlight-row__");
if (row) {
row.classList.add("__pw-highlight-row__");
lastRow = row;
}
}
window.addEventListener("mouseover", (e) => mark(e.target), true);
window.addEventListener("focus", (e) => mark(e.target), true);
window.addEventListener(
"click",
(e) => {
mark(e.target);
if (lastEl instanceof Element) {
lastEl.classList.add("__pw-highlight-click__");
if (clickTimeout) window.clearTimeout(clickTimeout);
const el = lastEl;
clickTimeout = window.setTimeout(
() => el.classList.remove("__pw-highlight-click__"),
600
);
}
},
true
);
});
}
/*
import { test, expect } from "../fixtures";
npx playwright codegen http://localhost:3000/analogInputs --target=ts -o tests/e2e/analog-inputs.spec.ts
@@ -117,130 +50,147 @@ npm run test:e2e:ui -- tests/e2e/analog-inputs.spec.ts
test.slow();
test("test", async ({ page }) => {
await installLocalHighlighter(page);
await page.goto("/analogInputs");
await expect(
page.getByRole("heading", { name: "Messwerteingänge" }).nth(1)
).toBeVisible();
await forceHighlight(
await expectVisibleWithHighlight(
page,
page.getByRole("heading", { name: "Messwerteingänge" }).nth(1)
);
await expect(page.getByRole("cell", { name: "Eingang" })).toBeVisible();
await forceHighlight(page, page.getByRole("cell", { name: "Eingang" }));
await expectVisibleWithHighlight(
page,
page.getByRole("cell", { name: "Eingang" })
);
await expect(page.getByRole("cell", { name: "Messwert" })).toBeVisible();
await forceHighlight(page, page.getByRole("cell", { name: "Messwert" }));
await expectVisibleWithHighlight(
page,
page.getByRole("cell", { name: "Messwert" })
);
await expect(page.getByRole("cell", { name: "Einheit" })).toBeVisible();
await forceHighlight(page, page.getByRole("cell", { name: "Einheit" }));
await expectVisibleWithHighlight(
page,
page.getByRole("cell", { name: "Einheit" })
);
await expect(page.getByRole("cell", { name: "Bezeichnung" })).toBeVisible();
await forceHighlight(page, page.getByRole("cell", { name: "Bezeichnung" }));
await expectVisibleWithHighlight(
page,
page.getByRole("cell", { name: "Bezeichnung" })
);
await expect(page.getByRole("cell", { name: "Einstellungen" })).toBeVisible();
await forceHighlight(page, page.getByRole("cell", { name: "Einstellungen" }));
await expectVisibleWithHighlight(
page,
page.getByRole("cell", { name: "Einstellungen" })
);
await expect(
page.getByRole("cell", { name: "Messkurve", exact: true })
).toBeVisible();
await forceHighlight(
await expectVisibleWithHighlight(
page,
page.getByRole("cell", { name: "Messkurve", exact: true })
);
await expect(page.getByText("1", { exact: true })).toBeVisible();
await expectVisibleWithHighlight(page, page.getByText("1", { exact: true }));
await expect(page.getByText("2", { exact: true })).toBeVisible();
await expectVisibleWithHighlight(page, page.getByText("2", { exact: true }));
await expect(page.getByText("3", { exact: true })).toBeVisible();
await expectVisibleWithHighlight(page, page.getByText("3", { exact: true }));
await expect(
await expectVisibleWithHighlight(
page,
page.getByRole("cell", { name: "4", exact: true }).locator("path")
).toBeVisible();
);
await expect(
await expectVisibleWithHighlight(
page,
page.getByRole("cell", { name: "5", exact: true })
).toBeVisible();
);
await expect(page.getByText("6", { exact: true })).toBeVisible();
await expectVisibleWithHighlight(page, page.getByText("6", { exact: true }));
await expect(
await expectVisibleWithHighlight(
page,
page.getByRole("cell", { name: "7", exact: true })
).toBeVisible();
);
await page.waitForTimeout(3000);
await expect(
await expectVisibleWithHighlight(
page,
page.getByRole("cell", { name: "8", exact: true })
).toBeVisible();
);
await page.waitForTimeout(3000);
await expect(page.locator(".border.p-2.text-center").first()).toBeVisible();
await expectVisibleWithHighlight(
page,
page.locator(".border.p-2.text-center").first()
);
// Markiere die gesamte erste Datenzeile (Row mit "AE 1" falls vorhanden)
const rowAE1 = page.getByRole("row", { name: /\bAE\s*1\b/ });
await forceHighlightRow(page, rowAE1);
await page.waitForTimeout(3000);
await expect(
await expectVisibleWithHighlight(
page,
page
.getByRole("row", { name: "2 5.67 °C Temperatur" })
.getByRole("button")
.first()
).toBeVisible();
);
await page.waitForTimeout(3000);
await expect(page.locator("tr:nth-child(3) > td:nth-child(5)")).toBeVisible();
await expectVisibleWithHighlight(
page,
page.locator("tr:nth-child(3) > td:nth-child(5)")
);
await page.waitForTimeout(3000);
await expect(
await expectVisibleWithHighlight(
page,
page
.getByRole("row", { name: "0.01 V AE 4 Messkurve anzeigen" })
.getByRole("button")
.first()
).toBeVisible();
);
await page.waitForTimeout(3000);
await expect(
await expectVisibleWithHighlight(
page,
page
.getByRole("row", { name: "8 -0.00 mA AE 8 Messkurve" })
.getByLabel("Messkurve anzeigen")
).toBeVisible();
);
await page.waitForTimeout(3000);
await page.getByRole("cell", { name: "1", exact: true }).click();
await page.locator(".border.p-2.text-center").first().click();
await expect(
await expectVisibleWithHighlight(
page,
page.getByRole("heading", { name: "Einstellungen Messwerteingang" })
).toBeVisible();
);
await forceHighlight(page, page.getByRole("dialog"));
await expect(page.getByText("Bezeichnung:")).toBeVisible();
await expectVisibleWithHighlight(page, page.getByText("Bezeichnung:"));
await expectVisibleWithHighlight(page, page.getByText("Offset:"));
await expectVisibleWithHighlight(page, page.getByText("Faktor:"));
await expectVisibleWithHighlight(page, page.getByText("Einheit:"));
await expectVisibleWithHighlight(page, page.getByText("Speicherintervall:"));
await expect(page.getByText("Offset:")).toBeVisible();
await expect(page.getByText("Faktor:")).toBeVisible();
await expect(page.getByText("Einheit:")).toBeVisible();
await expect(page.getByText("Speicherintervall:")).toBeVisible();
await expect(page.getByRole("button", { name: "Speichern" })).toBeVisible();
await expectVisibleWithHighlight(
page,
page.getByRole("button", { name: "Speichern" })
);
await page.waitForTimeout(3000);
await expect(
await expectVisibleWithHighlight(
page,
page.getByRole("button", { name: "Modal schließen" })
).toBeVisible();
);
await page.waitForTimeout(3000);
await expect(
await expectVisibleWithHighlight(
page,
page.getByText(
"Einstellungen Messwerteingang 1Bezeichnung:Offset:Faktor:Einheit:"
)
).toBeVisible();
);
await page.waitForTimeout(3000);
await page.getByRole("button", { name: "Modal schließen" }).click();
@@ -250,46 +200,60 @@ test("test", async ({ page }) => {
.getByLabel("Messkurve anzeigen")
.click();
await expect(
await expectVisibleWithHighlight(
page,
page.getByText(
"Messkurve Messwerteingang 1Eingang 1VonBisAlle MesswerteDaten laden"
)
).toBeVisible();
);
await expect(
await expectVisibleWithHighlight(
page,
page.getByRole("heading", { name: "Messkurve Messwerteingang" })
).toBeVisible();
);
await forceHighlight(page, page.getByRole("dialog"));
await forceHighlight(page, page.locator("canvas"));
await expect(page.getByText("Eingang 1VonBisAlle")).toBeVisible();
await expectVisibleWithHighlight(page, page.getByText("Eingang 1VonBisAlle"));
await expect(page.getByRole("button", { name: "Daten laden" })).toBeVisible();
await expectVisibleWithHighlight(
page,
page.getByRole("button", { name: "Daten laden" })
);
await expect(
await expectVisibleWithHighlight(
page,
page.getByRole("button", { name: "Alle Messwerte " })
).toBeVisible();
);
await expect(page.getByText("Von")).toBeVisible();
await expectVisibleWithHighlight(page, page.getByText("Von"));
await expect(page.getByText("Bis")).toBeVisible();
await expectVisibleWithHighlight(page, page.getByText("Bis"));
await expect(page.locator("div").filter({ hasText: /^Von$/ })).toBeVisible();
await expectVisibleWithHighlight(
page,
page.locator("div").filter({ hasText: /^Von$/ })
);
await expect(
await expectVisibleWithHighlight(
page,
page.locator("div").filter({ hasText: /^Von$/ }).getByRole("textbox")
).toBeVisible();
);
await page.waitForTimeout(3000);
await expect(page.locator("div").filter({ hasText: /^Bis$/ })).toBeVisible();
await expectVisibleWithHighlight(
page,
page.locator("div").filter({ hasText: /^Bis$/ })
);
await page.waitForTimeout(3000);
await expect(
await expectVisibleWithHighlight(
page,
page.locator("div").filter({ hasText: /^Bis$/ }).getByRole("textbox")
).toBeVisible();
);
await page.waitForTimeout(3000);
await expect(page.getByRole("img")).toBeVisible();
await expectVisibleWithHighlight(page, page.getByRole("img"));
await page.waitForTimeout(3000);
await page.getByRole("button", { name: "Alle Messwerte " }).click();
@@ -308,11 +272,15 @@ test("test", async ({ page }) => {
await page.getByRole("button", { name: "Exit fullscreen" }).click();
await expect(page.getByRole("button", { name: "Fullscreen" })).toBeVisible();
await expectVisibleWithHighlight(
page,
page.getByRole("button", { name: "Fullscreen" })
);
await expect(
await expectVisibleWithHighlight(
page,
page.getByRole("button", { name: "Modal schließen" })
).toBeVisible();
);
await page.waitForTimeout(3000);
await page.getByRole("button", { name: "Modal schließen" }).click();