Nachtrag zu cebdd88e. Ein Bildschirmfoto der fertigen Seite hat drei
Dinge gezeigt, die keine Pruefung sehen konnte.
1. DIE KACHEL WAR IMMER NOCH ORANGE.
Filipe: "die hauptfarbe der kachel soll auch babyblau sein mit bissl
lila." Die Seite trug zwar `--akzent: #a8d8ff`, aber der Kopf faerbt
sich ueber `--ton` -- und der stand am body auf Ton 44, dem Orange
vom 24.09. Die Variable war gesetzt und wirkungslos.
Ton 44 ist jetzt #a8d8ff. WEIL DIE FARBE DIESMAL AUS EINEM WUNSCH
kam und nicht aus einer Rechnung, wurde sie nachgemessen:
Kontrast gegen den dunklen Grund 12,46:1 (Hausgrenze 4,5)
Abstand zur naechsten Kachelfarbe 0,1125 (Ton 15)
Engstes Paar im Haus ohnehin 0,0154
-> 7,3-fach weiter weg als das schwaechste Glied
Babyblau haelt die Buntheitsgrenze (0,12) NICHT und kann sie nicht
halten -- das liegt am Wort. Nachgemessen mit einer Suche ueber den
ganzen Blaubereich: Es gibt KEINE Farbe, die gleichzeitig babyblau
aussieht, Buntheit >= 0,12 und Abstand >= 0,09 schafft; der beste
Kandidat kommt auf 0,075 Abstand. Der Blaubereich ist von sechs
Toenen besetzt.
DIE GRENZE WURDE DESHALB NICHT GESENKT, sondern BENANNT ausgenommen
(`blassErlaubt` in pruef-kachelfarben). Eine gesenkte Grenze gaelte
fuer alle 45 Toene; eine benannte gilt fuer eine und steht mit
ihrem Grund da. Und sie kostet etwas: Wer blass sein darf, muss
beim Abstand >= 0,10 halten -- gemessen, nicht versprochen, mit
Gegenprobe.
NEBENBEI ZWEI ALTE ROTE BEHOBEN: Die Prüfung war seit dem 24.09.
rot (engstes Paar 0,0862 zwischen Ton 41 und 45, und zwei Farben in
der Regenbogenkachel stimmten nicht mehr). Ton 45 neu gerechnet
(0,0914) und die Kachel nachgezogen. 22 -> 26 Pruefungen, 0 Fehler.
2. DIE LEITUNG SAH DIE KNOEPFE DES MELDERS.
Der Server lehnte sie richtig mit 404 ab -- die Karte bot sie ihr
trotzdem an. `darf_bestaetigen` war eine Aussage ueber die MELDUNG
statt ueber den BETRACHTER. Zwei Knoepfe, die nur eine Fehlermeldung
koennen, sind schlimmer als gar keine.
Jetzt fragen Route UND Anzeige dieselbe Funktion `darfBestaetigen`.
Es ist ausdruecklich "ist der Melder" und nicht "ist nicht Leitung":
Die Leitung darf ihre EIGENE Meldung bestaetigen, nur keine fremde.
Und die Leitung sieht bei "wartet" jetzt, wer dran ist -- "Liegt bei
Miss" mit ruhig atmendem Punkt, dazu "Noch etwas nachschicken ..."
statt "Behoben - nachfragen ...". Sie hat ja schon nachgefragt.
3. NACHLEGEN HAETTE DEN VERLAUF VERDOPPELT.
Antwortet die Leitung ein zweites Mal, waehrend die Meldung beim
Melder liegt, entstand eine ZWEITE Zeile "Runde 1" -- und sein
spaeteres Urteil haette beide gleichzeitig beschriftet. Jetzt
ersetzt ON CONFLICT die Antwort in derselben Runde.
DER EIGENTLICHE FUND STECKTE IM INDEX: `CREATE UNIQUE INDEX IF NOT
EXISTS` unter dem alten Namen tut auf dem Server NICHTS -- dort gibt
es den Namen schon, als gewoehnlichen Index, und IF NOT EXISTS
sieht nur den Namen, nicht die Bauart. Der Index waere nie eindeutig
geworden, ON CONFLICT haette kein Ziel gefunden, und das Nachlegen
waere abgebrochen -- genau dort, wo lokal alles gruen ist, weil jede
Pruefung ihre Datenbank frisch anlegt. Gefunden beim Durchspielen
auf einer KOPIE der echten Datenbank. Der alte Index wird jetzt
ausdruecklich weggenommen, der neue heisst anders.
GEMESSEN:
- pruef-support 59 -> 63 Pruefungen, 0 Fehler (darunter: die Leitung
bekommt die Knoepfe NICHT, und Nachlegen laesst EINE Runde stehen).
- Die Index-Umstellung auf einer Kopie der echten Datenbank
durchgespielt: alter Index weg, neuer eindeutig, ON CONFLICT trifft.
- pruef-kachelfarben 26/0, pruef-css-klassen, pruef-deutsche-texte: gruen.
- server/mess-support-runde.mjs (neu) macht vier Bilder: Leitung,
Melder, Melder auf dem Handy, und den Verlauf nach zwei Runden.
Es misst den "wer ist dran"-Hinweis ausdruecklich mit -- der war
einmal stumm ausgefallen (before() auf einem Element ohne
Elternknoten tut nichts, ohne Fehlermeldung).
Co-Authored-By: Claude Opus 5 <[email protected]>
216 lines
10 KiB
JavaScript
216 lines
10 KiB
JavaScript
/* =====================================================================
|
||
WIE DER SUPPORT JETZT AUSSIEHT UND SICH ANFUEHLT (25.09.2026)
|
||
|
||
Filipe, zwei Wuensche an einem Abend:
|
||
„ich will dass die leute die mir was geschickt haben im support,
|
||
auch meine notiz bekommen wenn ich fertig bin ... und erst wenn
|
||
es funktioniert gedrueckt wird, will ich dass alles richtig
|
||
fertig ist."
|
||
„ich will dass du bitte diese kachel viel geiler viel
|
||
profissioneller machst, die soll koomplett anders aussehen und
|
||
strukturiert sein ... die hauptfarbe der kachel soll auch
|
||
babyblau sein mit bissl lila."
|
||
|
||
SIE PRUEFT NICHTS und meldet keinen Fehlschlag -- sie macht Bilder,
|
||
auf denen man nachsehen kann. Deshalb `mess-` und nicht `pruef-`.
|
||
Gemessen wird die Wahrheit in `pruef-support.mjs` (58 Pruefungen);
|
||
hier geht es um das, was man nur SIEHT.
|
||
|
||
VIER BILDER, weil die Sache vier Seiten hat:
|
||
1. Die Leitung sieht die Meldung und ihren Knopf.
|
||
2. Der Melder sieht die Notiz und seine zwei Knoepfe -- der Kern
|
||
des ganzen Umbaus.
|
||
3. Derselbe Blick auf dem Handy, 412 px. Das ist die Breite, auf
|
||
der die Modis tatsaechlich arbeiten.
|
||
4. Nach zwei Runden: der Verlauf mit beiden Urteilen. Genau der
|
||
Fall, den Filipe gemeint hat („manchmal ... nicht sofort
|
||
perfekt").
|
||
|
||
EIGENE WEGWERF-DATENBANK in einem `mktemp`-Ordner: Es entstehen
|
||
echte Meldungen. In einem laufenden System waeren das Testdaten,
|
||
und die sind verboten.
|
||
|
||
Aufrufen mit: node server/mess-support-runde.mjs
|
||
===================================================================== */
|
||
import { mkdtempSync, rmSync, readFileSync } from "node:fs";
|
||
import { tmpdir } from "node:os";
|
||
import { join } from "node:path";
|
||
import { execFileSync } from "node:child_process";
|
||
import { request as httpAnfrage } from "node:http";
|
||
import { createServer as httpsServer } from "node:https";
|
||
|
||
const PORT = 5411, HP = 5412;
|
||
const CREW = "crew.dogfather-universe.com";
|
||
const ordner = mkdtempSync(join(tmpdir(), "ws-supportrunde-"));
|
||
process.env.WORKSPACE_DB = join(ordner, "workspace.db");
|
||
process.env.PORT = String(PORT);
|
||
process.env.SITE_ACCESS_SECRET = "lokaler-test";
|
||
process.env.SITE_PUBLIC_LAUNCH_AT = "2020-01-01T00:00:00+01:00";
|
||
|
||
const express = (await import("express")).default;
|
||
const ec = express.response.cookie;
|
||
express.response.cookie = function (n, w, o) {
|
||
return ec.call(this, n, w, { ...(o || {}), secure: false });
|
||
};
|
||
import { notbremse } from "./helfer-notbremse.mjs";
|
||
await import("./index.js");
|
||
notbremse(240_000, "mess-support-runde");
|
||
await new Promise((r) => setTimeout(r, 900));
|
||
process.on("uncaughtException", (f) => { console.error("ABSTURZ:", f); process.exit(7); });
|
||
process.on("unhandledRejection", (f) => { console.error("ABSTURZ (Versprechen):", f); process.exit(7); });
|
||
|
||
const { DatabaseSync } = await import("node:sqlite");
|
||
const { scryptSync, randomBytes, createHmac } = await import("node:crypto");
|
||
const d = new DatabaseSync(process.env.WORKSPACE_DB);
|
||
const jetzt = new Date().toISOString();
|
||
const sch = randomBytes(32).toString("hex");
|
||
d.prepare("INSERT INTO einstellungen (schluessel, wert, geaendert, von)"
|
||
+ " VALUES (?,?,?,NULL) ON CONFLICT(schluessel) DO NOTHING")
|
||
.run("code_kennung_schluessel", sch, jetzt);
|
||
const anlegen = (name, rolle, code) => {
|
||
const s = randomBytes(16).toString("hex");
|
||
const h = scryptSync(code, s, 64,
|
||
{ N: 32768, r: 8, p: 1, maxmem: 96 * 1024 * 1024 }).toString("hex");
|
||
return d.prepare("INSERT INTO personen"
|
||
+ " (name, rolle, code_hash, code_salt, code_n, code_kennung, aktiv, erstellt)"
|
||
+ " VALUES (?,?,?,?,?,?,1,?) RETURNING id")
|
||
.get(name, rolle, h, s, 32768,
|
||
createHmac("sha256", sch).update(code).digest("hex"), jetzt).id;
|
||
};
|
||
anlegen("Filipe", "admin", "CODE-DOGI-0001");
|
||
const idHand = anlegen("Rechte Hand", "hand", "CODE-HAND-0001");
|
||
const idModi = anlegen("Miss", "modi", "CODE-MODI-0001");
|
||
const idM2 = anlegen("Marina", "modi", "CODE-MODI-0002");
|
||
|
||
/* `von_name` GEHOERT DAZU -- die echte Melderoute schreibt ihn mit.
|
||
Ohne ihn saehe die Leitung „Liegt beim Melder" statt „Liegt bei
|
||
Miss", und das Bild zeigte einen Fall, den es im Betrieb nicht
|
||
gibt. Eine Messung mit zu wenig Daten misst die falsche Seite. */
|
||
const meldung = (person, name, text, seite, stand) => d.prepare(`INSERT INTO support_meldungen
|
||
(person_id, von_name, von_rolle, text, seite, stand, erstellt, geaendert)
|
||
VALUES (?,?,?,?,?,?,?,?) RETURNING id`)
|
||
.get(person, name, "modi", text, seite, stand, jetzt, jetzt).id;
|
||
|
||
const offen = meldung(idM2, "Marina",
|
||
"Der Kalender springt beim Wischen manchmal zwei Monate weiter.",
|
||
"/workspace/kalender.html", "neu");
|
||
const dran = meldung(idModi, "Miss",
|
||
"Ich konnte da wieder nicht zurück gehen, musste die App schließen "
|
||
+ "damit ich wieder auf die Hauptseite kam.",
|
||
"/workspace/support.html", "in_arbeit");
|
||
d.close();
|
||
|
||
const anfrage = (pfad, art, koerper, keks) => new Promise((fertig, schief) => {
|
||
const a = httpAnfrage({
|
||
host: "127.0.0.1", port: PORT, path: pfad, method: art,
|
||
headers: {
|
||
Host: CREW, "Content-Type": "application/json",
|
||
...(keks ? { Cookie: keks } : {}),
|
||
},
|
||
}, (r) => {
|
||
let t = ""; r.on("data", (x) => { t += x; });
|
||
r.on("end", () => fertig({ code: r.statusCode, kopf: r.headers, text: t }));
|
||
});
|
||
a.on("error", schief);
|
||
if (koerper) a.write(JSON.stringify(koerper));
|
||
a.end();
|
||
});
|
||
const anmelden = async (rolle, code) => {
|
||
const an = await anfrage("/workspace/api/anmelden", "POST", { rolle, code });
|
||
if (an.code !== 200) { console.log(`ABBRUCH: Anmeldung ${rolle} ${an.code}`); process.exit(2); }
|
||
return (an.kopf["set-cookie"] || []).map((x) => x.split(";")[0]).join("; ");
|
||
};
|
||
const kHand = await anmelden("hand", "CODE-HAND-0001");
|
||
const kModi = await anmelden("modi", "CODE-MODI-0001");
|
||
|
||
/* --- Runde 1: die Leitung sagt „behoben" ---------------------------- */
|
||
await anfrage(`/workspace/api/support/${dran}`, "PATCH",
|
||
{ stand: "erledigt", antwort: "Der Zurück-Knopf ist wieder da – "
|
||
+ "er war hinter der Kopfleiste verschwunden." }, kHand);
|
||
|
||
const schl = join(ordner, "b.key"), zert = join(ordner, "b.crt");
|
||
execFileSync("openssl", ["req", "-x509", "-newkey", "rsa:2048", "-nodes", "-keyout", schl,
|
||
"-out", zert, "-days", "2", "-subj", `/CN=${CREW}`, "-addext", `subjectAltName=DNS:${CREW}`],
|
||
{ stdio: "ignore" });
|
||
const vorbau = httpsServer({ key: readFileSync(schl), cert: readFileSync(zert) },
|
||
(von, nach) => {
|
||
const w = httpAnfrage({
|
||
host: "127.0.0.1", port: PORT, path: von.url, method: von.method,
|
||
headers: { ...von.headers, host: `${CREW}:${HP}` },
|
||
}, (a) => { nach.writeHead(a.statusCode || 502, a.headers); a.pipe(nach); });
|
||
von.pipe(w);
|
||
});
|
||
await new Promise((r) => vorbau.listen(HP, "127.0.0.1", r));
|
||
|
||
const pw = await import(
|
||
"file:///C:/Users/qciga/Documents/Obelix/Analyse/node_modules/playwright/index.mjs");
|
||
const browser = await pw.chromium.launch({
|
||
args: [`--host-resolver-rules=MAP ${CREW} 127.0.0.1`, "--ignore-certificate-errors"],
|
||
});
|
||
|
||
async function blicken(name, keks, breite, hoehe) {
|
||
const kontext = await browser.newContext({ viewport: { width: breite, height: hoehe } });
|
||
await kontext.addCookies(keks.split("; ").map((k) => {
|
||
const [n, ...r] = k.split("=");
|
||
return { name: n, value: r.join("="), domain: CREW, path: "/" };
|
||
}));
|
||
const seite = await kontext.newPage();
|
||
const konsole = [];
|
||
seite.on("console", (e) => {
|
||
if (e.type() === "error" && !/favicon|ERR_CERT|net::ERR/i.test(e.text())) {
|
||
konsole.push(e.text().slice(0, 140));
|
||
}
|
||
});
|
||
await seite.goto(`https://${CREW}:${HP}/workspace/support.html`, { waitUntil: "networkidle" });
|
||
await seite.waitForTimeout(1400);
|
||
const blick = await seite.evaluate(() => {
|
||
const karten = [...document.querySelectorAll(".s-karte")];
|
||
const knopf = (k) => [...k.querySelectorAll(".s-karte__tun button")]
|
||
.map((b) => b.textContent.trim()).join(" | ");
|
||
return {
|
||
karten: karten.length,
|
||
staende: karten.map((k) => k.querySelector(".s-karte__stand")?.textContent.trim())
|
||
.join(" / "),
|
||
knoepfe: karten.map(knopf).filter(Boolean).join(" // ") || "-",
|
||
/* Der Hinweis „wer ist dran" wird MITGEMESSEN -- er ist einmal
|
||
stumm ausgefallen (before() auf einem heimatlosen Element),
|
||
und im Bild sah das aus wie Absicht. */
|
||
wartet: [...document.querySelectorAll(".s-karte__wartet")]
|
||
.map((w) => w.textContent.trim()).join(" | ") || "-",
|
||
runden: document.querySelectorAll(".s-runde").length,
|
||
urteile: [...document.querySelectorAll(".s-runde__urteil")]
|
||
.map((u) => u.dataset.urteil).join(", ") || "-",
|
||
akzent: getComputedStyle(document.querySelector(".inhalt")).getPropertyValue("--akzent").trim(),
|
||
felder: document.querySelectorAll(".s-bilanz__feld").length,
|
||
};
|
||
});
|
||
console.log(`\n=== ${name} (${breite} x ${hoehe}) ===`);
|
||
for (const [k, v] of Object.entries(blick)) console.log(` ${k.padEnd(10)} ${v}`);
|
||
if (konsole.length) console.log(" FEHLER IN DER KONSOLE:", konsole);
|
||
const datei = `server/mess-support-${name}.png`;
|
||
await seite.screenshot({ path: datei, fullPage: false }).catch(() => {});
|
||
console.log(` Bild: ${datei}`);
|
||
await kontext.close();
|
||
}
|
||
|
||
try {
|
||
await blicken("leitung-pc", kHand, 1280, 1000);
|
||
await blicken("melder-pc", kModi, 1280, 1000);
|
||
await blicken("melder-handy", kModi, 412, 915);
|
||
|
||
/* --- Runde 2: „noch nicht", dann behoben, dann bestaetigt --------- */
|
||
await anfrage(`/workspace/api/support/${dran}/rueckmeldung`, "POST",
|
||
{ geht: false, text: "Der Knopf ja – aber jetzt springt die Seite nach oben." }, kModi);
|
||
await anfrage(`/workspace/api/support/${dran}`, "PATCH",
|
||
{ stand: "erledigt", antwort: "Das Springen kam vom Nachladen. Ist raus." }, kHand);
|
||
await blicken("melder-runde2", kModi, 1280, 1000);
|
||
|
||
console.log(`\n(Die offene Meldung #${offen} bleibt unangetastet stehen –`
|
||
+ " so sieht man beide Sorten nebeneinander.)");
|
||
} finally {
|
||
await browser.close();
|
||
vorbau.close();
|
||
try { rmSync(ordner, { recursive: true, force: true }); } catch { /* egal */ }
|
||
process.exit(0);
|
||
}
|