SECHS SACHEN, UND KEINE DAVON WAR DAS, WONACH ICH GESUCHT HABE. 1. ZWEI NATIVE prompt() IN teamlage.js -- die letzten im Haus. Sie halten die ganze Seite an, sehen auf jedem Browser anders aus als der Rest und koennen nicht sagen, was BLEIBT, wenn man absagt. Genau das ist dort die Frage, die jemand vor dem Klicken hat. Jetzt derselbe Dialog wie an den 42 anderen Stellen. 2. UND DER GRUND, WARUM SIE NIEMAND GEFUNDEN HAT. pruef-nachfrage suchte mit `(?:^|[^.\w])(confirm|prompt)\s*\(`. Das `[^.\w]` sollte fremde Methoden ausschliessen -- `angebot .prompt()` ist die Installations-Aufforderung des Browsers und kein nativer Dialog. Nur trifft dieser Ausschluss ausgerechnet die HAEUFIGSTE Schreibweise: `window.prompt(` hat einen Punkt davor. Die Pruefung war gruen, waehrend zwei native prompt() dastanden. Genau das Muster, vor dem dieses Haus warnt: eine Pruefung, die laeuft, gruen ist und das Falsche prueft. Die Gegenprobe kennt jetzt beide Schreibweisen -- haette sie das vorher getan, waere es am selben Tag aufgefallen. 3. willkommen.html LUD nachfrage.js NICHT. Gefunden von der geschaerften Pruefung. kopf.js ruft `frageNach(` ohne Absicherung -- auf dieser einen Seite haette ABMELDEN einen Absturz ausgeloest. Die Seite ist vom 21.09., die Luecke also einen Tag alt. 4. ZWEI FEHLALARME IM HANDY-RUNDGANG ABGESTELLT. Er meldete bei JEDEM Lauf dieselben drei Befunde: `button.schnitt bis 481px`, die Rechtetafel `table bis 877px`, `a.k-pille 8x8`. Nachgemessen bei 390 px: Das Dokument ist exakt 390 px breit, NICHTS laeuft ueber -- beide stehen in einem Kasten mit `overflow-x: auto`, und der rollt absichtlich. Die Kalenderpunkte tragen `pointer-events: none`; der Tipp gehoert der Tageszelle. Eine Warnung, die immer kommt, ist keine Warnung mehr (Hausregel vom 03.09.). Beide Regeln sind SCHMAL: nur ausdrueckliches `overflow-x: auto|scroll` (nicht `hidden` -- dort ist der Inhalt wirklich weg), nur ausdrueckliches `pointer-events: none`. Die Gegenprobe hat jetzt vier Faelle statt zwei: zwei, die gemeldet werden MUESSEN, und zwei, die es NICHT duerfen. Eine engere Messung kann auch zu eng sein. 5. DER LETZTE ECHTE BEFUND: 404 BEI JEDEM MODI. Der Rundgang meldete "404 (Not Found)" ohne Adresse -- eine Pruefung, die einen Fehler findet, ihn aber nicht auffindbar macht, kostet mehr Zeit als sie spart. Sie nennt jetzt die Adresse, und damit war es in einer Minute klar: `/workspace/api/werdegang/liste`. Der Code BEHANDELTE den 404 richtig, der Browser protokolliert ihn trotzdem -- derselbe Fall wie am 19.09. bei /anruf/adressen. Jetzt sagt der Server in /api/ich, ob jemand Team Dogi fuehrt. EIGENES FELD, kein Stellvertreter: `darf_verteilen` sieht aehnlich aus, ist aber nicht dasselbe -- ein Manager darf verteilen und fuehrt Team Dogi nicht. Dabei EINE Wartestelle statt zwei: `window.wennIchDaBin()`. `window.__ich` kommt ueber das Netz; zwei Seiten hatten dafuer jeweils ein eigenes setInterval. Zwei Fassungen desselben Wartens altern unterschiedlich. 6. pruef-werdegang MASS AUF DER FALSCHEN ADRESSE. Drei Pruefungen waren dauerhaft rot (`data-ton=null`) -- an einer Seite, die in Ordnung ist. Sie oeffnete `127.0.0.1`, also die Adresse der AGENTUR; dort ist `person.haus` nicht "crew" und die Kachelliste eine andere. Nachgemessen: Alle vier Rollen HABEN die Kachel, sobald das Haus stimmt. Jetzt derselbe https-Vorbau wie in pruef-willkommen und pruef-zuteilung. Beinahe haette ich hier etwas "repariert", das nicht kaputt war: Meine erste Messung rief `bereicheFuer(p, "crew")` auf -- das Haus wird aber aus `person.haus` gelesen, nicht als Argument. Sie sagte "DogFather hat keine Kachel". Eine plausible Herleitung ersetzt keine Messung, und eine falsch aufgesetzte Messung auch nicht. GEMESSEN: pruef-handy-teamdogi 214 Seitenaufrufe, 108.564 Elemente, 4.126 Bedienelemente -- 0 Befunde. Alle vier Rollen, beide Breiten. Zum ersten Mal. pruef-werdegang 103/0 (war 100/3), pruef-nachfrage 51/0 (war 49), pruef-stelle 15/0, pruef-entwicklung 48/0, pruef-start-ansicht 153/0, pruef-wege-nach-draussen 67/0, pruef-tippziele 11/0, pruef-treff 80/0, pruef-willkommen 67/0, pruef-sackgassen 13/0. Co-Authored-By: Claude Opus 5 <[email protected]>
634 lines
29 KiB
JavaScript
634 lines
29 KiB
JavaScript
/* =====================================================================
|
||
pruef-nachfrage.mjs — Nichts verschwindet ohne Nachfrage.
|
||
|
||
Filipe, 19.09.2026: „Es darf vor allem keine Stellen geben, an denen
|
||
ein Benutzer etwas falsch machen kann, nur weil die Seite es nicht
|
||
verständlich genug erklärt." Und: „Fehler möglichst verhindern,
|
||
bevor sie entstehen."
|
||
|
||
---------------------------------------------------------------------
|
||
WAS DAS PROBLEM WAR
|
||
|
||
Das Haus hatte die richtige Bauweise — einen <dialog> statt
|
||
`confirm()` — und begründete sie in `aufgaben.html` sogar ausführlich.
|
||
Nur stand sie IN EINER SEITE. Gemessen am 19.09.2026: **30 Stellen**
|
||
in 16 Dateien griffen weiterhin zu `confirm()` oder `prompt()`.
|
||
|
||
Der Unterschied ist nicht Geschmack. `confirm('Wirklich löschen?')`
|
||
stellt die falsche Frage: Es fragt, ob man sicher ist, und nennt
|
||
nicht, WAS passiert, was BLEIBT und ob es ZURÜCK geht. Genau das
|
||
sind die drei Dinge, die man vor einem Löschen wissen will.
|
||
|
||
---------------------------------------------------------------------
|
||
VIER DINGE WERDEN GEPRÜFT
|
||
|
||
1. KEIN NATIVER DIALOG mehr in einer Seiten-Datei. Ausgenommen ist
|
||
allein der Notnagel in `nachfrage.js` selbst — für Browser ohne
|
||
<dialog>. (Ein Verbot ohne diese Ausnahme wäre falsch: Ein
|
||
iPhone vor Safari 15.4 bekäme sonst gar nichts angezeigt.)
|
||
|
||
2. ANGESCHLOSSEN — jede Seite, deren Skripte `frageNach` benutzen,
|
||
lädt auch `nachfrage.js`. Ohne die Datei wäre `frageNach` nicht
|
||
definiert, und aus einer Rückfrage würde ein Absturz: Der Knopf
|
||
täte stillschweigend nichts.
|
||
|
||
ACHTUNG, hier steckte beim Bauen schon eine Falle: Die erste
|
||
Fassung dieser Prüfung zählte `nachfrage.js` SELBST als Nutzer
|
||
(die Datei enthält das Wort natürlich) — damit war jede Seite
|
||
„Nutzer", die Prüfung immer grün und sie bewies nichts. Deshalb
|
||
ist die Datei unten ausdrücklich ausgenommen.
|
||
|
||
3. GESTALTET — `.dialog` wird in einer Datei gestaltet, die JEDE
|
||
Seite lädt. Vorher stand sie in `aufgaben.css`; auf `dateien.html`
|
||
wäre der Dialog ein weißer Systemkasten auf dunkler Seite
|
||
gewesen. Das ist keine Schönheitsfrage: Ein Kasten, der aussieht
|
||
wie eine Browser-Warnung, wird weggeklickt statt gelesen.
|
||
|
||
4. VOLLSTÄNDIG — jeder Aufruf hat einen `titel` und sagt, was
|
||
passiert (`was`). Ein Dialog ohne diese Angabe ist ein
|
||
`confirm()` mit mehr Zeilen Code.
|
||
|
||
Dazu GEGENPROBEN: Jede Prüfung muss beweisen, dass sie auch
|
||
„nicht in Ordnung" sagen kann.
|
||
|
||
AUFRUF: node server/pruef-nachfrage.mjs
|
||
Läuft in unter zwei Sekunden, ohne Server.
|
||
===================================================================== */
|
||
|
||
import { readFileSync, readdirSync } from "node:fs";
|
||
import { join, dirname } from "node:path";
|
||
import { fileURLToPath } from "node:url";
|
||
import { bestaetige, nachfrageText } from "./helfer-nachfrage.mjs";
|
||
|
||
const HIER = dirname(fileURLToPath(import.meta.url));
|
||
const WURZEL = join(HIER, "..");
|
||
const SEITEN_ORDNER = join(WURZEL, "workspace");
|
||
const JS_ORDNER = join(SEITEN_ORDNER, "assets", "js");
|
||
const CSS_ORDNER = join(SEITEN_ORDNER, "assets", "css");
|
||
|
||
/* Die eine Datei, die `confirm`/`prompt` benutzen DARF -- sie ist der
|
||
Notnagel fuer Browser ohne <dialog>. */
|
||
const DER_NOTNAGEL = "nachfrage.js";
|
||
|
||
let ok = 0, fehl = 0;
|
||
const pruef = (name, bedingung, zusatz = "") => {
|
||
if (bedingung) { ok++; console.log(` OK ${name}`); }
|
||
else { fehl++; console.log(` FEHL ${name}${zusatz ? "\n " + zusatz : ""}`); }
|
||
};
|
||
|
||
const lies = (p) => readFileSync(p, "utf8");
|
||
const seiten = readdirSync(SEITEN_ORDNER).filter((f) => f.endsWith(".html"));
|
||
const skripte = readdirSync(JS_ORDNER).filter((f) => f.endsWith(".js"));
|
||
|
||
console.log("\n=== Nachfragen: kein nativer Dialog, und keiner ohne Erklärung ===\n");
|
||
|
||
/* ---------------------------------------------------------------------
|
||
1. KEIN NATIVER DIALOG
|
||
------------------------------------------------------------------ */
|
||
|
||
/** Entfernt Kommentare, bevor gesucht wird. Ohne das zaehlt jeder
|
||
* Kommentar, der `confirm()` ERWAEHNT, als Fund -- und davon gibt es
|
||
* in diesem Haus absichtlich mehrere (die Begruendungen). */
|
||
function ohneKommentare(js) {
|
||
return js.replace(/\/\*[\s\S]*?\*\//g, "").replace(/(^|[^:])\/\/.*$/gm, "$1");
|
||
}
|
||
|
||
const nativ = [];
|
||
for (const f of skripte) {
|
||
if (f === DER_NOTNAGEL) continue;
|
||
const code = ohneKommentare(lies(join(JS_ORDNER, f)));
|
||
/* DAS MUSTER HATTE EINE LUECKE, UND ZWAR DIE GROESSTE MOEGLICHE
|
||
(gefunden am 22.09.2026).
|
||
|
||
Vorher stand hier `(?:^|[^.\w])(confirm|prompt)\s*\(`. Das
|
||
`[^.\w]` sollte fremde Methoden ausschliessen -- etwas wie
|
||
`angebot.prompt()` (so heisst die Installations-Aufforderung des
|
||
Browsers) ist kein nativer Dialog und darf nicht als Fund zaehlen.
|
||
|
||
Nur trifft dieser Ausschluss ausgerechnet die HAEUFIGSTE
|
||
Schreibweise: `window.prompt(` hat einen Punkt davor. Die Pruefung
|
||
war damit gruen, waehrend in teamlage.js ZWEI native prompt()
|
||
standen -- einer davon seit Wochen.
|
||
|
||
Genau das Muster, vor dem dieses Haus warnt: eine Pruefung, die
|
||
laeuft, gruen ist und das Falsche prueft. Gefunden hat es nicht
|
||
sie, sondern eine Suche von Hand.
|
||
|
||
Jetzt zwei Faelle statt einem: mit `window.` davor -- oder ganz
|
||
ohne Punkt. Alles andere (`irgendwas.prompt()`) bleibt aussen
|
||
vor, und das ist weiterhin richtig. */
|
||
for (const m of code.matchAll(/(?:^|[^.\w])(?:window\s*\.\s*)?(confirm|prompt)\s*\(/g)) {
|
||
const zeile = code.slice(0, m.index).split("\n").length;
|
||
nativ.push(`${f}:${zeile} → ${m[1]}()`);
|
||
}
|
||
}
|
||
pruef("keine Seite benutzt noch confirm() oder prompt()", nativ.length === 0,
|
||
nativ.slice(0, 8).join("\n "));
|
||
|
||
/* Und der Notnagel ist da -- sonst haetten Browser ohne <dialog> gar
|
||
nichts. Die ZAHL gehoert in die Bedingung, nicht nur in den Text. */
|
||
const notnagel = lies(join(JS_ORDNER, DER_NOTNAGEL));
|
||
pruef("der Notnagel für alte Browser ist vorhanden",
|
||
/HTMLDialogElement/.test(notnagel) && /window\.confirm\(/.test(notnagel));
|
||
|
||
/* ---------------------------------------------------------------------
|
||
2. ANGESCHLOSSEN
|
||
------------------------------------------------------------------ */
|
||
|
||
/** Welche Skripte rufen frageNach auf? OHNE die Datei, die es
|
||
* DEFINIERT -- sonst ist die Antwort immer „alle". */
|
||
const nutzer = new Set();
|
||
for (const f of skripte) {
|
||
if (f === DER_NOTNAGEL) continue;
|
||
if (/\bfrageNach\s*\(/.test(ohneKommentare(lies(join(JS_ORDNER, f))))) nutzer.add(f);
|
||
}
|
||
pruef("es gibt überhaupt Seiten, die nachfragen", nutzer.size > 0,
|
||
`gefunden: ${nutzer.size}`);
|
||
|
||
const ohneDatei = [], totesGewicht = [], fragendeSeiten = [];
|
||
let mitNutzung = 0;
|
||
for (const s of seiten) {
|
||
const html = lies(join(SEITEN_ORDNER, s));
|
||
const geladen = [...html.matchAll(/<script src="assets\/js\/([a-z0-9-]+\.js)/g)]
|
||
.map((m) => m[1]);
|
||
/* ZWEI GRUENDE, die Datei zu brauchen (20.09.2026):
|
||
fragen -- oder einen Dialog mit Eingabefeldern haben. Seit die
|
||
Verwurfwache existiert, bewacht `nachfrage.js` jeden solchen
|
||
Dialog von selbst, auch ohne einen einzigen `frageNach`-Aufruf
|
||
in der Seite. Ohne diesen zweiten Grund wuerde eine Seite mit
|
||
einem reinen Formular-Dialog hier als „totes Gewicht" gemeldet --
|
||
und jemand naehme die Datei heraus, die dort gerade arbeitet. */
|
||
const hatDialogMitFeld = [...html.matchAll(/<dialog[^>]*>[\s\S]*?<\/dialog>/g)]
|
||
.some((m) => /<(input|textarea|select)/.test(m[0]));
|
||
const kannFragen = geladen.some((g) => nutzer.has(g)) || hatDialogMitFeld;
|
||
const hatDatei = html.includes("assets/js/nachfrage.js");
|
||
if (kannFragen) { mitNutzung++; fragendeSeiten.push(s); if (!hatDatei) ohneDatei.push(s); }
|
||
else if (hatDatei) totesGewicht.push(s);
|
||
}
|
||
pruef("jede Seite, die nachfragt, lädt auch nachfrage.js",
|
||
mitNutzung > 0 && ohneDatei.length === 0,
|
||
`${mitNutzung} Seiten nutzen es, ohne Datei: ${ohneDatei.join(", ") || "keine"}`);
|
||
|
||
/* UND DIE GEGENRICHTUNG. Ohne sie waere „ueberall einbinden" die
|
||
bequeme Antwort -- und die Anmeldewand, die jeder Besucher als
|
||
erste laedt, truege 4,8 KB fuer einen Dialog, den sie nie zeigt.
|
||
Zwei Richtungen, eine Regel: Die Datei liegt genau dort, wo sie
|
||
gebraucht wird. */
|
||
pruef("und keine Seite lädt sie, ohne je nachzufragen",
|
||
totesGewicht.length === 0,
|
||
`unnötig geladen auf: ${totesGewicht.join(", ")}`);
|
||
|
||
/* ---------------------------------------------------------------------
|
||
3. GESTALTET, UND ZWAR ÜBERALL
|
||
------------------------------------------------------------------ */
|
||
|
||
/** In welchen CSS-Dateien wird `.dialog` gestaltet? */
|
||
const dialogCss = readdirSync(CSS_ORDNER).filter((f) => f.endsWith(".css"))
|
||
.filter((f) => /^\.dialog[\s,{:]/m.test(lies(join(CSS_ORDNER, f))));
|
||
|
||
/** Und welche davon laedt jede Seite, DIE NACHFRAGEN KANN? Abgeleitet,
|
||
* nicht behauptet -- eine Liste „module.css laedt ueberall" waere genau
|
||
* die abgeschriebene Liste, vor der die Hausregeln warnen.
|
||
*
|
||
* Gemessen wird gegen die fragenden Seiten, nicht gegen alle: Die zwei
|
||
* Anmeldewaende zeigen nie einen Dialog. Von ihnen die Dialog-
|
||
* Gestaltung zu verlangen hiesse, 12 KB auf die Seite zu legen, die
|
||
* jeder Besucher als erste laedt -- fuer nichts. */
|
||
const ueberall = new Set(dialogCss);
|
||
for (const s of fragendeSeiten) {
|
||
const html = lies(join(SEITEN_ORDNER, s));
|
||
const css = new Set([...html.matchAll(/href="assets\/css\/([a-z0-9-]+\.css)/g)]
|
||
.map((m) => m[1]));
|
||
for (const d of [...ueberall]) if (!css.has(d)) ueberall.delete(d);
|
||
}
|
||
pruef(".dialog wird dort gestaltet, wo jede fragende Seite es lädt",
|
||
ueberall.size > 0 && fragendeSeiten.length > 0,
|
||
`.dialog steht in: ${dialogCss.join(", ")} — von allen `
|
||
+ `${fragendeSeiten.length} fragenden Seiten geladen: `
|
||
+ `${[...ueberall].join(", ") || "KEINE"}`);
|
||
|
||
/* Die zwei eigenen Bauteile des Nachfrage-Dialogs gehoeren in dieselbe
|
||
Datei -- sonst waere der wichtigste Satz ("nicht rueckgaengig")
|
||
ungestaltet. */
|
||
const gemeinsam = [...ueberall][0];
|
||
const gCss = gemeinsam ? lies(join(CSS_ORDNER, gemeinsam)) : "";
|
||
pruef("auch die Warnzeile und die Fehlerzeile sind dort gestaltet",
|
||
/\.nachfrage__endgueltig/.test(gCss) && /\.nachfrage__fehler/.test(gCss));
|
||
|
||
/* Und sie traegt ihre Aussage nicht nur ueber Farbe. */
|
||
pruef("die Warnzeile hat ein Zeichen, nicht nur eine Farbe",
|
||
/\.nachfrage__endgueltig::before\s*{[^}]*content/.test(gCss),
|
||
"Farbe allein trägt keine Aussage — Rot-Grün-Schwäche, Kontrastmodus");
|
||
|
||
/* ---------------------------------------------------------------------
|
||
4. VOLLSTÄNDIG: jeder Aufruf sagt, was passiert
|
||
------------------------------------------------------------------ */
|
||
|
||
/** Schneidet den Objektliteral-Teil eines frageNach-Aufrufs heraus,
|
||
* klammergenau. Ein Muster „bis zur naechsten }" wuerde bei jedem
|
||
* verschachtelten Ausdruck danebengreifen. */
|
||
function aufrufe(js) {
|
||
const out = [];
|
||
for (const m of js.matchAll(/frageNach\s*\(\s*{/g)) {
|
||
let i = m.index + m[0].length - 1, tiefe = 0, j = i;
|
||
for (; j < js.length; j++) {
|
||
if (js[j] === "{") tiefe++;
|
||
else if (js[j] === "}") { tiefe--; if (tiefe === 0) { j++; break; } }
|
||
}
|
||
out.push(js.slice(i, j));
|
||
}
|
||
return out;
|
||
}
|
||
|
||
let gezaehlt = 0;
|
||
const ohneTitel = [], ohneWas = [];
|
||
for (const f of skripte) {
|
||
if (f === DER_NOTNAGEL) continue;
|
||
const code = ohneKommentare(lies(join(JS_ORDNER, f)));
|
||
for (const a of aufrufe(code)) {
|
||
gezaehlt++;
|
||
if (!/\btitel\s*:/.test(a)) ohneTitel.push(f);
|
||
if (!/\bwas\s*:/.test(a)) ohneWas.push(f);
|
||
}
|
||
}
|
||
/* DIE ZAHL GEHOERT IN DIE BEDINGUNG: Bei null Aufrufen waere
|
||
„alle haben einen Titel" trivialerweise wahr. */
|
||
pruef("jeder Aufruf hat einen Titel", gezaehlt > 0 && ohneTitel.length === 0,
|
||
`${gezaehlt} Aufrufe geprüft, ohne Titel: ${ohneTitel.join(", ") || "keiner"}`);
|
||
pruef("jeder Aufruf sagt, WAS passiert", gezaehlt > 0 && ohneWas.length === 0,
|
||
`ohne „was": ${ohneWas.join(", ") || "keiner"}`);
|
||
|
||
/* Und die gefaehrlichste Handlung im Haus -- eine Person loeschen --
|
||
verlangt das Abtippen des Namens. Das ist keine Schikane: Der
|
||
Loeschknopf sitzt neben dem Sperrknopf. */
|
||
pruef("eine Person löschen verlangt den Namen abgetippt",
|
||
/tippen:\s*v\.person\.name/.test(lies(join(JS_ORDNER, "personen.js"))));
|
||
|
||
/* ---------------------------------------------------------------------
|
||
DIE VERWURFWACHE — beide Schliesswege, und kein Dauerfeuer
|
||
------------------------------------------------------------------ */
|
||
const wache = notnagel;
|
||
pruef("die Verwurfwache faengt Esc ab (das `cancel`-Ereignis)",
|
||
/addEventListener\('cancel'/.test(wache),
|
||
"ohne sie liefe Esc durch -- der Browser ruft close() dabei NICHT auf");
|
||
pruef("und sie faengt auch close() ab (die Abbrechen-Knoepfe)",
|
||
/dlg\.close = function/.test(wache),
|
||
"ohne sie liefe der Knopf durch -- er loest kein `cancel` aus");
|
||
pruef("sie ersetzt close() nur AM DIALOG, nicht am Prototyp",
|
||
!/HTMLDialogElement\.prototype\.close\s*=/.test(wache),
|
||
"ein globaler Eingriff traefe den Nachfrage-Dialog selbst -- der ginge nie mehr zu");
|
||
pruef("sie fragt nur bei wirklicher Aenderung",
|
||
/const geaendert = \(\) =>/.test(wache) && /if \(!geaendert\(\)\)/.test(wache),
|
||
"eine Warnung, die immer kommt, ist keine Warnung mehr");
|
||
pruef("sie bewacht sich nicht selbst",
|
||
/dialog:not\(\.nachfrage\)/.test(wache),
|
||
"sonst fragte der Nachfrage-Dialog beim Schliessen nach sich selbst");
|
||
|
||
/* Und die Speicherwege sagen ihr Bescheid -- sonst fragte sie nach
|
||
jedem erfolgreichen Speichern. */
|
||
let speicherwege = 0;
|
||
for (const f of skripte) {
|
||
if (f === DER_NOTNAGEL) continue;
|
||
speicherwege += [...ohneKommentare(lies(join(JS_ORDNER, f)))
|
||
.matchAll(/\.vergessen\?\.\(\)/g)].length;
|
||
}
|
||
pruef("die Speicherwege melden der Wache, dass nichts mehr zu retten ist",
|
||
speicherwege >= 8, `${speicherwege} Stellen rufen vergessen()`);
|
||
|
||
/* ---------------------------------------------------------------------
|
||
DIE GEGENPROBEN — jede muss anschlagen
|
||
------------------------------------------------------------------ */
|
||
console.log("\n --- Gegenproben (jede MUSS anschlagen) ---");
|
||
|
||
/* DIE GEGENPROBE PRUEFT JETZT BEIDE SCHREIBWEISEN. Haette sie das
|
||
vorher getan, waere die Luecke im Muster am selben Tag aufgefallen,
|
||
an dem es geschrieben wurde. */
|
||
pruef("Gegenprobe: ein erfundenes window.prompt() würde gefunden",
|
||
/(?:^|[^.\w])(?:window\s*\.\s*)?(confirm|prompt)\s*\(/.test(
|
||
"const g = window.prompt('Warum nicht?');"));
|
||
pruef("Gegenprobe: eine fremde Methode NICHT (angebot.prompt())",
|
||
!/(?:^|[^.\w])(?:window\s*\.\s*)?(confirm|prompt)\s*\(/.test(
|
||
"angebot.prompt();"));
|
||
pruef("Gegenprobe: ein erfundenes confirm() würde gefunden",
|
||
/(?:^|[^.\w])(confirm|prompt)\s*\(/.test(
|
||
ohneKommentare("function x(){ if (!confirm('weg?')) return; }")));
|
||
|
||
pruef("Gegenprobe: ein confirm() im KOMMENTAR wird NICHT gemeldet",
|
||
!/(?:^|[^.\w])(confirm|prompt)\s*\(/.test(
|
||
ohneKommentare("/* frueher stand hier confirm('weg?') */")));
|
||
|
||
pruef("Gegenprobe: nachfrage.js selbst zählt nicht als Nutzer",
|
||
!nutzer.has(DER_NOTNAGEL),
|
||
'sonst wäre jede Seite trivialerweise Nutzer und die Prüfung grün ohne Inhalt');
|
||
|
||
pruef("Gegenprobe: die Gestaltung-Prüfung kann auch NEIN sagen",
|
||
(() => {
|
||
/* Eine erfundene Seite, die nachfragt, aber die Datei nicht laedt:
|
||
Die Schnittmenge muss dadurch leer werden. */
|
||
const probe = new Set(dialogCss);
|
||
for (const d of [...probe]) if (!new Set(["gibt-es-nicht.css"]).has(d)) probe.delete(d);
|
||
return probe.size === 0;
|
||
})());
|
||
|
||
pruef("Gegenprobe: ein Aufruf ohne Titel würde auffallen",
|
||
aufrufe("frageNach({ was: 'x' })").length === 1
|
||
&& !/\btitel\s*:/.test(aufrufe("frageNach({ was: 'x' })")[0]));
|
||
|
||
pruef("Gegenprobe: der Klammerzähler findet das Ende auch bei Verschachtelung",
|
||
aufrufe("frageNach({ titel: f({a:1}), was: 'x' }) ; danach")[0]
|
||
=== "{ titel: f({a:1}), was: 'x' }");
|
||
|
||
/* =====================================================================
|
||
UND JETZT AM ECHTEN BILDSCHIRM
|
||
|
||
Alles oben ist Textsuche. Sie beweist, dass der Aufruf dasteht --
|
||
nicht, dass der Dialog aufgeht, dass "Doch nicht" wirklich nichts
|
||
tut und dass das Abtippen wirklich sperrt.
|
||
|
||
Geprüft wird ausgerechnet der gefährlichste Handgriff im Haus: eine
|
||
Person löschen. `pruef-personen-loeschen` gibt es zwar, aber sie
|
||
kennt nur die Schnittstelle -- kein Browser, kein Knopf, kein
|
||
Dialog. Der Weg, den ein Mensch geht, war nie geprüft.
|
||
===================================================================== */
|
||
if (process.env.OHNE_BROWSER === "ja") {
|
||
console.log("\n (Browserteil übersprungen — OHNE_BROWSER=ja)");
|
||
} else {
|
||
const { mkdtempSync, rmSync } = await import("node:fs");
|
||
const { tmpdir } = await import("node:os");
|
||
const { eigenerPort } = await import("./helfer-port.mjs");
|
||
const { notbremse } = await import("./helfer-notbremse.mjs");
|
||
|
||
const ordner = mkdtempSync(join(tmpdir(), "ws-nachfrage-"));
|
||
process.env.WORKSPACE_DB = join(ordner, "workspace.db");
|
||
const PORT = await eigenerPort(import.meta, "die Nachfragepruefung");
|
||
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 });
|
||
};
|
||
await import("./index.js");
|
||
notbremse(240_000, "pruef-nachfrage");
|
||
await new Promise((r) => setTimeout(r, 1000));
|
||
const BASIS = `http://127.0.0.1:${PORT}`;
|
||
|
||
const { DatabaseSync } = await import("node:sqlite");
|
||
const { scryptSync, randomBytes } = await import("node:crypto");
|
||
await fetch(BASIS + "/workspace/api/anmelden", {
|
||
method: "POST", headers: { "Content-Type": "application/json" },
|
||
body: JSON.stringify({ rolle: "admin", code: "x" }) }).catch(() => {});
|
||
for (let i = 0; i < 60; i++) {
|
||
try {
|
||
const pb = new DatabaseSync(process.env.WORKSPACE_DB);
|
||
try { pb.prepare("SELECT 1 FROM personen LIMIT 1").get(); break; } finally { pb.close(); }
|
||
} catch { await new Promise((r) => setTimeout(r, 250)); }
|
||
}
|
||
const db = new DatabaseSync(process.env.WORKSPACE_DB);
|
||
const jetzt = new Date().toISOString();
|
||
const anlegen = (name, rolle, code) => {
|
||
const salt = randomBytes(16).toString("hex");
|
||
const h = scryptSync(code, salt, 64,
|
||
{ N: 32768, r: 8, p: 1, maxmem: 96 * 1024 * 1024 }).toString("hex");
|
||
db.prepare("INSERT INTO personen (name, rolle, code_hash, code_salt, code_n, aktiv, erstellt)"
|
||
+ " VALUES (?,?,?,?,?,1,?)").run(name, rolle, h, salt, 32768, jetzt);
|
||
};
|
||
anlegen("Filipe", "admin", "CODE-DOGI-0001");
|
||
anlegen("Testolina", "creator", "CODE-CREA-0001");
|
||
db.close();
|
||
|
||
const pw = await import("file:///C:/Users/qciga/Documents/Obelix/Analyse/node_modules/playwright/index.mjs");
|
||
const browser = await pw.chromium.launch();
|
||
const ctx = await browser.newContext({ viewport: { width: 1280, height: 900 } });
|
||
const seite = await ctx.newPage();
|
||
const abstuerze = [];
|
||
seite.on("pageerror", (f) => abstuerze.push(f.message));
|
||
|
||
await seite.goto(BASIS + "/workspace/", { waitUntil: "networkidle" });
|
||
await seite.click('.rolle[data-rolle="admin"]');
|
||
await seite.fill("#code", "CODE-DOGI-0001");
|
||
await seite.click("button[type=submit]");
|
||
await seite.waitForURL("**/start.html", { timeout: 25000 });
|
||
await seite.goto(BASIS + "/workspace/personen.html", { waitUntil: "networkidle" });
|
||
await seite.waitForTimeout(900);
|
||
|
||
console.log("\n --- Am echten Bildschirm: eine Person löschen ---");
|
||
|
||
const wieViele = () => seite.evaluate(() =>
|
||
[...document.querySelectorAll(".person")].length);
|
||
/* DEN ABSCHNITT AUFKLAPPEN. Die Rollen-Abschnitte sind
|
||
standardmäßig ZU -- nur der eigene ist offen. Das ist so gewollt
|
||
(eine Liste mit fünf offenen Abschnitten ist unlesbar), und eine
|
||
Prüfung, die das nicht weiß, misst eine leere Liste und hält das
|
||
für einen Befund. Genau das ist beim Bauen passiert. */
|
||
await seite.waitForSelector('.gruppe[data-rolle="creator"] .gruppe__kopf',
|
||
{ timeout: 15_000 });
|
||
await seite.click('.gruppe[data-rolle="creator"] .gruppe__kopf');
|
||
await seite.waitForFunction(
|
||
() => document.querySelectorAll(".person").length >= 2,
|
||
{ timeout: 15_000 }).catch(() => {});
|
||
const vorher = await wieViele();
|
||
const namen2 = await seite.evaluate(() =>
|
||
[...document.querySelectorAll(".person")]
|
||
.map((e) => e.textContent.trim().slice(0, 30)).join(" | "));
|
||
pruef("die Liste steht da", vorher >= 2, `${vorher} Personen: ${namen2}`);
|
||
|
||
const loeschKnopf = seite.locator(".person", { hasText: "Testolina" })
|
||
.locator("button", { hasText: "Löschen" }).first();
|
||
await loeschKnopf.click();
|
||
|
||
let dialogDa = true;
|
||
try { await seite.waitForSelector("dialog.nachfrage[open]", { timeout: 4000 }); }
|
||
catch { dialogDa = false; }
|
||
pruef("der Dialog geht auf", dialogDa);
|
||
|
||
if (dialogDa) {
|
||
const inhalt = await nachfrageText(seite);
|
||
pruef("er nennt den Namen im Titel", /Testolina/.test(inhalt.titel), inhalt.titel);
|
||
pruef("er sagt, dass es endgültig ist", inhalt.endgueltig);
|
||
pruef("er sagt, WAS passiert", inhalt.was.length > 10, inhalt.was);
|
||
pruef("und was BLEIBT", inhalt.bleibt.length > 10, inhalt.bleibt);
|
||
|
||
/* DER RIEGEL: Ein falsch abgetippter Name darf NICHTS loeschen. */
|
||
await seite.fill("#nachfrage-tipp", "Testolinaa");
|
||
await seite.click('dialog.nachfrage [data-teil="ja"]');
|
||
await seite.waitForTimeout(500);
|
||
const nochOffen = await seite.evaluate(() =>
|
||
!!document.querySelector("dialog.nachfrage[open]"));
|
||
pruef("ein falsch abgetippter Name schließt den Dialog NICHT", nochOffen);
|
||
const fehlertext = await seite.evaluate(() =>
|
||
document.querySelector('dialog.nachfrage [data-teil="fehler"]')?.textContent?.trim() || "");
|
||
pruef("und sagt, was erwartet wird", /Testolina/.test(fehlertext), fehlertext);
|
||
pruef("die Person ist noch da", await wieViele() === vorher);
|
||
|
||
/* Der Knopf daneben muss wirklich nichts tun. */
|
||
await seite.click('dialog.nachfrage [data-teil="nein"]');
|
||
await seite.waitForTimeout(400);
|
||
pruef("der Abbruchknopf schließt den Dialog",
|
||
!await seite.evaluate(() => !!document.querySelector("dialog.nachfrage[open]")));
|
||
pruef("und löscht nichts", await wieViele() === vorher);
|
||
|
||
/* Und jetzt richtig. */
|
||
await bestaetige(seite, () => loeschKnopf.click(), { tippen: "Testolina" });
|
||
await seite.waitForTimeout(1400);
|
||
const nachher = await wieViele();
|
||
pruef("mit richtig abgetipptem Namen wird gelöscht",
|
||
nachher === vorher - 1, `${vorher} → ${nachher}`);
|
||
}
|
||
|
||
/* Und Esc bricht ab -- auf einem Dialog OHNE Abtippen. */
|
||
await seite.goto(BASIS + "/workspace/start.html", { waitUntil: "networkidle" });
|
||
await seite.waitForTimeout(700);
|
||
await seite.click("#abmelden");
|
||
let abmeldeDialog = true;
|
||
try { await seite.waitForSelector("dialog.nachfrage[open]", { timeout: 4000 }); }
|
||
catch { abmeldeDialog = false; }
|
||
pruef("auch Abmelden fragt nach", abmeldeDialog);
|
||
if (abmeldeDialog) {
|
||
const t = await nachfrageText(seite);
|
||
pruef("und nennt den Grund: der Zugangscode", /Zugangscode/.test(t.was), t.was);
|
||
await seite.keyboard.press("Escape");
|
||
await seite.waitForTimeout(800);
|
||
pruef("Esc bricht ab – man bleibt angemeldet",
|
||
seite.url().includes("start.html"), seite.url());
|
||
}
|
||
|
||
/* ===================================================================
|
||
DIE VERWURFWACHE AM ECHTEN BILDSCHIRM (20.09.2026)
|
||
|
||
Alles oben ist Textsuche. Sie beweist, dass der Code dasteht --
|
||
nicht, dass Esc wirklich abgefangen wird, dass ein unberührter
|
||
Dialog still zugeht und dass „Verwerfen" wirklich verwirft.
|
||
|
||
Geprüft wird am größten Formular des Hauses: „Aufgabe bearbeiten",
|
||
zehn Felder. Wer dort tippt und mit dem Daumen den Rand trifft,
|
||
verlor bis heute alles, wortlos.
|
||
=================================================================== */
|
||
console.log("\n --- Die Verwurfwache am Bildschirm ---");
|
||
|
||
/* Eine Aufgabe, damit es etwas zu bearbeiten gibt. */
|
||
{
|
||
const dbz = new DatabaseSync(process.env.WORKSPACE_DB);
|
||
const wer = dbz.prepare("SELECT id FROM personen WHERE rolle = 'admin' LIMIT 1").get()?.id;
|
||
dbz.prepare("INSERT INTO aufgaben (titel, beschreibung, status, verantwortlich_id,"
|
||
+ " erstellt_von, erstellt) VALUES (?,?,?,?,?,?)")
|
||
.run("Zum Bearbeiten", "Ein Text, der nicht verlorengehen darf.",
|
||
"offen", wer, wer, new Date().toISOString());
|
||
dbz.close();
|
||
}
|
||
|
||
await seite.goto(BASIS + "/workspace/aufgaben.html", { waitUntil: "networkidle" });
|
||
await seite.waitForTimeout(900);
|
||
|
||
const auf = async () => {
|
||
await seite.click(".karte, .aufgabe, [data-id]", { timeout: 5000 }).catch(() => {});
|
||
await seite.waitForTimeout(500);
|
||
return seite.evaluate(() =>
|
||
!!document.getElementById("bearbeiten-dialog")?.open);
|
||
};
|
||
|
||
/* Erst über den Bearbeiten-Knopf an der Karte. */
|
||
let offen = await seite.evaluate(() => {
|
||
const k = [...document.querySelectorAll("button")]
|
||
.find((b) => /bearbeiten/i.test(b.textContent || "") || /bearbeiten/i.test(b.title || ""));
|
||
if (k) { k.click(); return true; }
|
||
return false;
|
||
});
|
||
await seite.waitForTimeout(700);
|
||
let istAuf = await seite.evaluate(() =>
|
||
!!document.getElementById("bearbeiten-dialog")?.open);
|
||
if (!istAuf) istAuf = await auf();
|
||
|
||
pruef("der Bearbeiten-Dialog geht auf", istAuf);
|
||
|
||
if (istAuf) {
|
||
/* 1. UNBERÜHRT -> still zu. Das ist der wichtigere Fall: Wer
|
||
nichts getippt hat, darf nichts gefragt werden. */
|
||
await seite.keyboard.press("Escape");
|
||
await seite.waitForTimeout(500);
|
||
const nachEsc = await seite.evaluate(() => ({
|
||
dialogZu: !document.getElementById("bearbeiten-dialog")?.open,
|
||
gefragt: !!document.querySelector("dialog.nachfrage[open]"),
|
||
}));
|
||
pruef("unberührt geht er ohne Nachfrage zu", nachEsc.dialogZu && !nachEsc.gefragt,
|
||
`zu: ${nachEsc.dialogZu}, gefragt: ${nachEsc.gefragt}`);
|
||
|
||
/* 2. GETIPPT -> Esc fragt nach. */
|
||
await seite.evaluate(() => {
|
||
const k = [...document.querySelectorAll("button")]
|
||
.find((b) => /bearbeiten/i.test(b.textContent || "") || /bearbeiten/i.test(b.title || ""));
|
||
k?.click();
|
||
});
|
||
await seite.waitForTimeout(600);
|
||
await seite.fill("#b-titel", "Etwas ganz anderes");
|
||
await seite.keyboard.press("Escape");
|
||
await seite.waitForTimeout(600);
|
||
const nachTippen = await seite.evaluate(() => ({
|
||
nochOffen: !!document.getElementById("bearbeiten-dialog")?.open,
|
||
gefragt: !!document.querySelector("dialog.nachfrage[open]"),
|
||
text: document.querySelector('dialog.nachfrage [data-teil="was"]')?.textContent || "",
|
||
}));
|
||
pruef("nach einer Änderung fragt Esc nach", nachTippen.gefragt,
|
||
`gefragt: ${nachTippen.gefragt}`);
|
||
pruef("und der Dialog bleibt solange offen", nachTippen.nochOffen);
|
||
pruef("die Frage sagt, was verloren geht",
|
||
/verloren/i.test(nachTippen.text), nachTippen.text);
|
||
|
||
/* 3. „Weiter bearbeiten" -> der Text steht noch da. */
|
||
await seite.click('dialog.nachfrage [data-teil="nein"]');
|
||
await seite.waitForTimeout(500);
|
||
const nachWeiter = await seite.evaluate(() => ({
|
||
nochOffen: !!document.getElementById("bearbeiten-dialog")?.open,
|
||
titel: document.getElementById("b-titel")?.value || "",
|
||
}));
|
||
pruef("Weiter bearbeiten laesst den Dialog offen", nachWeiter.nochOffen);
|
||
pruef("und der getippte Text steht noch da",
|
||
nachWeiter.titel === "Etwas ganz anderes", `„${nachWeiter.titel}"`);
|
||
|
||
/* 4. DER KNOPF-WEG -- und er muss JEDES MAL fragen.
|
||
----------------------------------------------------------------
|
||
NICHT noch einmal Esc. Gemessen am 20.09.2026: Ein ZWEITES Esc
|
||
hintereinander schliesst den Dialog, egal was die Seite tut.
|
||
Das ist Chromiums „close watcher": Eine Seite darf den Nutzer
|
||
nicht mit Esc einsperren. Die Regel ist richtig, und dagegen
|
||
anzubauen waere falsch -- also wird sie hier festgehalten statt
|
||
umgangen.
|
||
|
||
Der Knopf unterliegt ihr nicht. Er ist auch der Weg, den man am
|
||
Handy nimmt, wo es kein Esc gibt. */
|
||
await seite.click("#b-abbrechen");
|
||
await seite.waitForTimeout(600);
|
||
const nachKnopf = await seite.evaluate(() => ({
|
||
nochOffen: !!document.getElementById("bearbeiten-dialog")?.open,
|
||
gefragt: !!document.querySelector("dialog.nachfrage[open]"),
|
||
}));
|
||
pruef("auch der Abbrechen-Knopf fragt nach",
|
||
nachKnopf.gefragt && nachKnopf.nochOffen,
|
||
`gefragt: ${nachKnopf.gefragt}, noch offen: ${nachKnopf.nochOffen}`);
|
||
|
||
await seite.click('dialog.nachfrage [data-teil="ja"]', { timeout: 6000 });
|
||
await seite.waitForTimeout(700);
|
||
const nachVerwerfen = await seite.evaluate(() =>
|
||
!document.getElementById("bearbeiten-dialog")?.open);
|
||
pruef('Verwerfen schliesst den Dialog wirklich', nachVerwerfen);
|
||
|
||
/* Und danach ist nichts uebernommen worden -- verwerfen heisst
|
||
verwerfen, nicht speichern. */
|
||
const inListe = await seite.evaluate(() =>
|
||
document.body.textContent.includes("Etwas ganz anderes"));
|
||
pruef("und der verworfene Text steht nirgends in der Liste", !inListe);
|
||
}
|
||
|
||
pruef("keine Abstürze im Browser", abstuerze.length === 0, abstuerze[0] || "");
|
||
|
||
await browser.close();
|
||
try { rmSync(ordner, { recursive: true, force: true }); } catch { /* egal */ }
|
||
}
|
||
|
||
console.log(`\n ${ok} bestanden, ${fehl} fehlgeschlagen`);
|
||
console.log(` (${gezaehlt} Rückfragen in ${nutzer.size} Dateien, `
|
||
+ `${mitNutzung} Seiten)\n`);
|
||
process.exit(fehl ? 1 : 0);
|