playwright: analge Eingänge mit highlight color test erfoögreich

2025-08-14 14:23:00 +02:00
parent 08370cf898
commit 71dd37bb0e
6 changed files with 72 additions and 71 deletions
--- a/.env.development
+++ b/.env.development
@@ -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.721
+NEXT_PUBLIC_APP_VERSION=1.6.722
 NEXT_PUBLIC_CPL_MODE=json   # json (Entwicklungsumgebung) oder jsSimulatedProd (CPL ->CGI-Interface-Simulator) oder production (CPL-> CGI-Interface Platzhalter)

--- a/.env.production
+++ b/.env.production
@@ -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.721
+NEXT_PUBLIC_APP_VERSION=1.6.722
 NEXT_PUBLIC_CPL_MODE=production
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,8 @@
+## [1.6.722] – 2025-08-14
+
+- playwright: analoge Eingänge Test erfolgreich
+
+---
 ## [1.6.721] – 2025-08-14

 - Playwright : ausgewählte Element rot färben
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
  "name": "cpl-v4",
-  "version": "1.6.721",
+  "version": "1.6.722",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
    "": {
      "name": "cpl-v4",
-      "version": "1.6.721",
+      "version": "1.6.722",
      "dependencies": {
        "@fontsource/roboto": "^5.1.0",
        "@headlessui/react": "^2.2.4",
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "cpl-v4",
-  "version": "1.6.721",
+  "version": "1.6.722",
  "private": true,
  "scripts": {
    "dev": "next dev",
--- a/playwright/tests/analogInputs.spec.ts
+++ b/playwright/tests/analogInputs.spec.ts
@@ -1,17 +1,23 @@
 import { test, expect } from "../fixtures";
 import type { Locator, Page } from "@playwright/test";

-// Force-highlighting helpers (explicit red outline via class)
-async function ensureForceCss(page: Page) {
-  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; }
-    `,
-  });
-}
-
-async function forceHighlight(page: Page, locator: Locator, durationMs = 800) {
-  await ensureForceCss(page);
+// Kombinierte Helper-Funktion: injiziert CSS (nur einmal), hebt hervor und prüft Sichtbarkeit
+async function highlightAndExpectVisible(
+  page: Page,
+  locator: Locator,
+  durationMs = 800
+) {
+  // CSS nur einmal pro Page injizieren
+  if (!(await page.evaluate(() => (window as any).__pwForceCssInjected))) {
+    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) => {
@@ -20,15 +26,6 @@ async function forceHighlight(page: Page, locator: Locator, durationMs = 800) {
      window.setTimeout(() => n.classList.remove("pw-force-outline"), ms);
    }, durationMs);
  }
-}
-
-// Expect helper: highlight element while asserting it's visible
-async function expectVisibleWithHighlight(
-  page: Page,
-  locator: Locator,
-  durationMs = 800
-) {
-  await forceHighlight(page, locator, durationMs);
  await expect(locator).toBeVisible();
 }

@@ -52,72 +49,72 @@ test.slow();
 test("test", async ({ page }) => {
  await page.goto("/analogInputs");

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.getByRole("heading", { name: "Messwerteingänge" }).nth(1)
  );

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.getByRole("cell", { name: "Eingang" })
  );

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.getByRole("cell", { name: "Messwert" })
  );

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.getByRole("cell", { name: "Einheit" })
  );

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.getByRole("cell", { name: "Bezeichnung" })
  );

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.getByRole("cell", { name: "Einstellungen" })
  );

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.getByRole("cell", { name: "Messkurve", exact: true })
  );

-  await expectVisibleWithHighlight(page, page.getByText("1", { exact: true }));
+  await highlightAndExpectVisible(page, page.getByText("1", { exact: true }));

-  await expectVisibleWithHighlight(page, page.getByText("2", { exact: true }));
+  await highlightAndExpectVisible(page, page.getByText("2", { exact: true }));

-  await expectVisibleWithHighlight(page, page.getByText("3", { exact: true }));
+  await highlightAndExpectVisible(page, page.getByText("3", { exact: true }));

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.getByRole("cell", { name: "4", exact: true }).locator("path")
  );

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.getByRole("cell", { name: "5", exact: true })
  );

-  await expectVisibleWithHighlight(page, page.getByText("6", { exact: true }));
+  await highlightAndExpectVisible(page, page.getByText("6", { exact: true }));

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.getByRole("cell", { name: "7", exact: true })
  );
  await page.waitForTimeout(3000);

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.getByRole("cell", { name: "8", exact: true })
  );
  await page.waitForTimeout(3000);

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.locator(".border.p-2.text-center").first()
  );
@@ -125,7 +122,7 @@ test("test", async ({ page }) => {

  await page.waitForTimeout(3000);

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page
      .getByRole("row", { name: "2 5.67 °C Temperatur" })
@@ -134,13 +131,13 @@ test("test", async ({ page }) => {
  );
  await page.waitForTimeout(3000);

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.locator("tr:nth-child(3) > td:nth-child(5)")
  );
  await page.waitForTimeout(3000);

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page
      .getByRole("row", { name: "0.01 V AE 4 Messkurve anzeigen" })
@@ -149,7 +146,7 @@ test("test", async ({ page }) => {
  );
  await page.waitForTimeout(3000);

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page
      .getByRole("row", { name: "8 -0.00 mA AE 8 Messkurve" })
@@ -161,31 +158,30 @@ test("test", async ({ page }) => {

  await page.locator(".border.p-2.text-center").first().click();

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.getByRole("heading", { name: "Einstellungen Messwerteingang" })
  );
-  await forceHighlight(page, page.getByRole("dialog"));

-  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 highlightAndExpectVisible(page, page.getByText("Bezeichnung:"));
+  await highlightAndExpectVisible(page, page.getByText("Offset:"));
+  await highlightAndExpectVisible(page, page.getByText("Faktor:"));
+  await highlightAndExpectVisible(page, page.getByText("Einheit:"));
+  await highlightAndExpectVisible(page, page.getByText("Speicherintervall:"));

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.getByRole("button", { name: "Speichern" })
  );
  await page.waitForTimeout(3000);

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.getByRole("button", { name: "Modal schließen" })
  );
  await page.waitForTimeout(3000);

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.getByText(
      "Einstellungen Messwerteingang 1Bezeichnung:Offset:Faktor:Einheit:"
@@ -200,60 +196,60 @@ test("test", async ({ page }) => {
    .getByLabel("Messkurve anzeigen")
    .click();

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.getByText(
      "Messkurve Messwerteingang 1Eingang 1VonBisAlle MesswerteDaten laden"
    )
  );

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.getByRole("heading", { name: "Messkurve Messwerteingang" })
  );
-  await forceHighlight(page, page.getByRole("dialog"));
-  await forceHighlight(page, page.locator("canvas"));

-  await expectVisibleWithHighlight(page, page.getByText("Eingang 1VonBisAlle"));
+  await highlightAndExpectVisible(page, page.locator("canvas"));

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(page, page.getByText("Eingang 1VonBisAlle"));
+
+  await highlightAndExpectVisible(
    page,
    page.getByRole("button", { name: "Daten laden" })
  );

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.getByRole("button", { name: "Alle Messwerte " })
  );

-  await expectVisibleWithHighlight(page, page.getByText("Von"));
+  await highlightAndExpectVisible(page, page.getByText("Von"));

-  await expectVisibleWithHighlight(page, page.getByText("Bis"));
+  await highlightAndExpectVisible(page, page.getByText("Bis"));

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.locator("div").filter({ hasText: /^Von$/ })
  );

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.locator("div").filter({ hasText: /^Von$/ }).getByRole("textbox")
  );
  await page.waitForTimeout(3000);

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.locator("div").filter({ hasText: /^Bis$/ })
  );
  await page.waitForTimeout(3000);

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.locator("div").filter({ hasText: /^Bis$/ }).getByRole("textbox")
  );
  await page.waitForTimeout(3000);

-  await expectVisibleWithHighlight(page, page.getByRole("img"));
+  await highlightAndExpectVisible(page, page.getByRole("img"));
  await page.waitForTimeout(3000);

  await page.getByRole("button", { name: "Alle Messwerte " }).click();
@@ -272,12 +268,12 @@ test("test", async ({ page }) => {

  await page.getByRole("button", { name: "Exit fullscreen" }).click();

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.getByRole("button", { name: "Fullscreen" })
  );

-  await expectVisibleWithHighlight(
+  await highlightAndExpectVisible(
    page,
    page.getByRole("button", { name: "Modal schließen" })
  );