DogFatherGit/dogfather-universe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Drei Fehlalarme, die auf echte Stellen zeigten -- und keiner war ein Fehler

Browse Source 
Weiter am Rundumcheck. Diese Runde hat KEINE Zeile am Programm
geaendert: Alle drei Befunde kamen aus den Pruefungen selbst. Das ist
kein Trost, sondern die unangenehmere Sorte -- ein Fehlalarm nennt eine
echte Stelle und eine plausible Zahl, und man sucht danach am richtigen
Code.

1. EIN FARBFORMAT, DAS DIE MESSUNG NICHT KANNTE.

   `pruef-neue-seiten` meldete auf treff-regeln.html einen Kontrast von
   1,07 -- praktisch unsichtbarer Text. Nachgemessen an Ort und Stelle:
   dunkler Text auf HELLBLAUER Flaeche, rund 10:1.

   Chromium gibt eine Farbe, die aus `color-mix()` entstanden ist, als
   `color(srgb 0.37 0.78 0.97)` zurueck -- Werte von 0 bis 1, keine
   Kommas. Die Messung las nur `rgba?(...)`, fand die Flaeche des
   Sprunglinks nicht, ging zum fast schwarzen Elternteil weiter und
   rechnete dunkel gegen dunkel. Im Haus ist `color-mix` ueberall.

   Der Farbleser kennt jetzt beide Formate und faehrt vier Proben mit
   (rgb, rgba, color(srgb), color(srgb / alpha)) -- dazu eine fuenfte,
   die beweist, dass er bei Unbekanntem NICHTS liefert. Ein Leser, der
   im Zweifel Schwarz zurueckgibt, waere schlimmer als der alte: Er
   wuerde nie wieder auffallen.

2. EINE SEITE, DIE ZU KURZ WAR, UM "GEFUELLT" ZU HEISSEN.

   Dieselbe Pruefung verlangte von jeder Seite mehr als 400 Zeichen
   Text. entwicklung.html hat 350 -- seit dem Umbau, bei dem aus
   achtzehn Zahlenkaesten zwei Personenkacheln mit einem Ring wurden.
   Die Seite sagt seither mehr und braucht weniger Worte; die Pruefung
   bestrafte damit genau die Verbesserung.

   Jede Seite darf jetzt sagen, woran man sieht, dass sie da ist: eine
   Zeichenzahl, wo Text die Sache ist -- ein MERKMAL (".e-person",
   mindestens zwei), wo Struktur die Sache ist. Eine Zahl kann beides
   nicht unterscheiden.

3. EIN ABSCHNITT, DER SPAETER KAM ALS DIE MESSUNG.

   "Die rechte Hand sieht ihre eigene Karte" war rot -- versteckt,
   obwohl der Server `hat_karte: true` sagte. Von Hand nachgesehen
   stand sie da. Die Entwicklungsseite laedt nacheinander (Aufgaben,
   Vorlagenbrett, eigene Karte), und zwischen zwei Schritten kann es
   laenger als 600 ms still sein -- die Ruheregel der Pruefung hielt
   das fuer "fertig". Jetzt wartet sie zusaetzlich auf den einen
   Abschnitt, der sich selbst aufdeckt, hoechstens zwei Sekunden.
   Nebenwirkung: Der Vergleich "zwei verschiedene Bildschirme" misst
   jetzt 632 gegen 1191 Zeichen statt 350 gegen 350.

   109 Pruefungen, 0 Fehler (vorher 8).

4. UND EINE FESTE ZAHL, DIE MIT DER SEITE GEWACHSEN IST.

   `pruef-buehne` erlaubte hoechstens ZWEI Texte, um die herum kein
   freier Untergrund zu finden ist. treff-regeln.html hat inzwischen
   40 Textstuecke, drei davon stehen dicht -- 7,5 %. Die Sorge dahinter
   bleibt richtig (eine Pruefung, die kaum hingesehen hat, darf nicht
   "bestanden" sagen), aber das ist eine Frage des ANTEILS: zwei von
   vier waere schlimm, drei von vierzig ist es nicht. Jetzt: zwei
   immer erlaubt, darueber ein Zehntel -- und die Meldung nennt die
   Textanfaenge, damit man in einer Sekunde sieht, worum es geht.

ZWEI NEUE WERKZEUGE, beide aus der Not dieser Runde entstanden:
  mess-farbe-am-text.mjs  -- liest die Farben an Ort und Stelle aus und
                             geht die Elternkette hoch bis zur ersten
                             deckenden Flaeche
  mess-seiteninhalt.mjs   -- zeigt, was auf einer Seite wirklich steht,
                             mit ROLLE=hand auch mit fremden Augen

GEMESSEN: pruef-neue-seiten 109/0, pruef-buehne alles in Ordnung.

Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
DogFatherGit
2026-09-25 12:48:16 +02:00
co-authored by Claude Opus 5
parent e7cd1984d8
commit f7276172d0
4 changed files with 435 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
server/pruef-neue-seiten.mjs
+155 -19
View File
@@ -209,16 +209,54 @@ const KONTRAST = `(() => {
return 0.2126 * f(r) + 0.7152 * f(g) + 0.0722 * f(b);
};
const misch = (v, h) => v.map((x, i) => x * v[3] + h[i] * (1 - v[3]));
/* ==== ZWEI FARBFORMATE, NICHT EINS (25.09.2026) ==================
Hier stand nur \`rgba?(...)\`. Chromium gibt eine Farbe, die aus
\`color-mix()\` entstanden ist, aber als \`color(srgb 0.37 0.78
0.97)\` zurueck -- mit Werten von 0 bis 1 statt 0 bis 255 und
ohne Kommas. Im Haus ist \`color-mix\` ueberall im Einsatz.
WAS DAS ANGERICHTET HAT: Der Sprunglink auf treff-regeln.html
traegt eine hellblaue Flaeche und dunklen Text -- ein Kontrast von
rund 10:1. Die Messung konnte seine Flaeche nicht lesen, ging zum
Elternteil weiter (fast schwarz) und rechnete dunklen Text gegen
dunklen Grund: 1,07. Ein Befund, der wie ein blinder Text aussah
und keiner war.
Das ist die unangenehmste Sorte Fehlalarm: Er zeigt auf eine
echte Stelle, nennt eine plausible Zahl -- und schickt einen in
ein CSS, an dem nichts ist. Gefunden habe ich es, indem ich die
Farben an Ort und Stelle ausgelesen habe, statt der Meldung zu
glauben.
DIE GEGENPROBE STEHT UNTEN: Ein erfundenes \`color(srgb ...)\`
muss als Farbe erkannt werden, und ein unbekanntes Format muss
weiterhin NICHTS liefern -- sonst faengt die Messung an, Werte zu
erfinden. */
const farbe = (f) => {
const m = f.match(/rgba?\\(([^)]+)\\)/);
if (m) {
const t = m[1].split(",").map(Number);
return [t[0], t[1], t[2], t.length > 3 ? t[3] : 1];
}
/* color(srgb r g b / a) -- Anteile von 0 bis 1, durch Leerzeichen
getrennt, das Alpha hinter einem Schraegstrich. */
const c = f.match(/color\\(\\s*srgb\\s+([^)]+)\\)/);
if (c) {
const roh = c[1].split("/");
const t = roh[0].trim().split(/\\s+/).map(Number);
const a = roh.length > 1 ? Number(roh[1]) : 1;
if (t.length >= 3 && t.every((x) => Number.isFinite(x))) {
return [t[0] * 255, t[1] * 255, t[2] * 255, Number.isFinite(a) ? a : 1];
}
}
return null;
};
const grund = (e) => {
let n = e;
while (n && n !== document.documentElement) {
const f = getComputedStyle(n).backgroundColor;
const m = f.match(/rgba?\\(([^)]+)\\)/);
if (m) {
const t = m[1].split(",").map(Number);
const a = t.length > 3 ? t[3] : 1;
if (a > 0.92) return [t[0], t[1], t[2], 1];
}
const t = farbe(getComputedStyle(n).backgroundColor);
if (t && t[3] > 0.92) return [t[0], t[1], t[2], 1];
n = n.parentElement;
}
return null;
@@ -245,9 +283,8 @@ const KONTRAST = `(() => {
if (k.width < 4 || k.height < 4) continue;
const s = getComputedStyle(e);
if (s.visibility === "hidden" || s.display === "none" || Number(s.opacity) < 0.2) continue;
const m = s.color.match(/rgba?\\(([^)]+)\\)/);
if (!m) continue;
const v = m[1].split(",").map(Number);
const v = farbe(s.color);
if (!v) continue;
/* DRITTER AUSGANG: konnte nicht nachsehen.
Findet sich über diesem Text keine deckende Fläche, dann liegt er
@@ -259,7 +296,7 @@ const KONTRAST = `(() => {
hinter den Zeilen standen. */
const hinten = grund(e);
if (!hinten) { geraten.push(t.slice(0, 34)); continue; }
const vorn = misch([v[0], v[1], v[2], v.length > 3 ? v[3] : 1], hinten);
const vorn = misch(v, hinten);
const l1 = leuchte(...vorn), l2 = leuchte(...hinten);
const k2 = (Math.max(l1, l2) + 0.05) / (Math.min(l1, l2) + 0.05);
gemessen++;
@@ -267,7 +304,16 @@ const KONTRAST = `(() => {
|| (parseFloat(s.fontSize) >= 18.66 && Number(s.fontWeight) >= 700);
if (k2 < (gross ? 3 : 4.5)) schlecht.push(t.slice(0, 34) + " (" + k2.toFixed(2) + ")");
}
return { gemessen, schlecht, geraten };
/* GEGENPROBE IM MESSPUNKT SELBST -- sie kostet nichts und beweist,
dass der Leser beide Formate kann und nicht raet. */
const probe = {
rgb: farbe("rgb(10, 18, 30)"),
rgba: farbe("rgba(255, 255, 255, 0.5)"),
srgb: farbe("color(srgb 0.367529 0.782588 0.967059)"),
srgbAlpha: farbe("color(srgb 1 0 0 / 0.25)"),
unsinn: farbe("wasauchimmer"),
};
return { gemessen, schlecht, geraten, probe };
})()`;
/* WAS ABSICHTLICH ÜBEREINANDERLIEGT, IST KEIN FEHLER (11.09.2026).
@@ -364,7 +410,7 @@ const UEBERBREIT = `(() => {
Das ist kein Umgehen einer Sicherung: Angemeldet wird ueber denselben
Weg wie sonst (/api/anmelden), nur die Maske bleibt aussen vor. Was
die Seite danach zeigt, entscheidet weiterhin der Server. */
async function ansehen(name, pfad, code, breite, hoehe, keks = null) {
async function ansehen(name, pfad, code, breite, hoehe, keks = null, merkmal = null) {
const kontext = await browser.newContext({ viewport: { width: breite, height: hoehe } });
const seite = await kontext.newPage();
const konsole = [];
@@ -407,6 +453,29 @@ async function ansehen(name, pfad, code, breite, hoehe, keks = null) {
return (window.__ruhig || 0) >= 3;
}, null, { timeout: 12000, polling: 200 }).catch(() => {});
/* ==== UND NOCH AUF DEN LETZTEN ABSCHNITT (25.09.2026) ===========
Die Ruheregel darueber ist richtig und reicht hier nicht: Die
Entwicklungsseite laedt NACHEINANDER -- Aufgaben, Vorlagenbrett,
eigene Karte. Zwischen zwei dieser Schritte kann es laenger als
600 ms still sein, und dann gilt die Seite als fertig, waehrend
der letzte Abschnitt noch unterwegs ist.
Gemeldet wurde dadurch: „die rechte Hand sieht ihre eigene Karte"
-- versteckt, obwohl der Server `hat_karte: true` sagte. Von Hand
nachgesehen steht sie da („DEINE KARTE / Noch nichts fertig ...").
Also wieder die Sorte Fehlalarm, die einen am richtigen Code
suchen laesst.
GEWARTET WIRD NUR, WENN ES ETWAS ZU WARTEN GIBT: Seiten ohne
`#karte-block` laufen sofort weiter; DogFather hat keine Karte,
dort bleibt der Block zu Recht zu, und die Frist von zwei
Sekunden ist die Notbremse, kein Taktgeber. */
await seite.waitForFunction(() => {
const e = document.getElementById("karte-block");
return !e || !e.hidden;
}, null, { timeout: 2000, polling: 100 }).catch(() => {});
const text = await seite.evaluate(() => (document.querySelector("main")?.innerText || "").trim());
const punkte = await seite.evaluate(() => (document.querySelector("main")?.innerText || "")
.split("\\n").filter((z) => z.trim() === "…").length);
@@ -427,9 +496,20 @@ async function ansehen(name, pfad, code, breite, hoehe, keks = null) {
} catch (f) { antwort = { status: -1, fehler: String(f) }; }
return { da: true, versteckt: e.hidden, antwort };
});
/* Wie oft steht das Merkmal auf der Seite, das sie ausmacht? Null,
wenn keins genannt ist -- dann zaehlt die Zeichenzahl.
VOR dem Schliessen. Im ersten Anlauf stand diese Zeile darunter,
und die Meldung lautete „Target page, context or browser has been
closed" -- eine Frage an eine Seite, die es nicht mehr gibt. */
const merkmale = merkmal
? await seite.evaluate((m) => document.querySelectorAll(m).length, merkmal)
: 0;
await seite.screenshot({ path: join(BILDER, `${name}-${breite}.png`), fullPage: true });
await kontext.close();
return { text, punkte, kontrast, ueberlapp, breit, konsole, karte };
return { text, punkte, kontrast, ueberlapp, breit, konsole, karte, merkmale };
}
const gesehen = {}; // was auf jedem Bildschirm tatsaechlich stand
@@ -438,7 +518,28 @@ const anm3 = await roh("/workspace/api/anmelden", {}, { rolle: "hand", code: "CO
const kHand = [].concat(anm3.kopf?.["set-cookie"] || []).map((c) => c.split(";")[0]).join("; ");
ok(!!kHand, "die rechte Hand ist angemeldet -- ohne sie bliebe ihre eigene Karte ungesehen");
for (const [name, pfad, keks] of [
/* ==== "GEFUELLT" IST KEINE ZEICHENZAHL (25.09.2026) =================
Hier wurde fuer jede Seite `text.length > 400` verlangt. Das ist
eine sinnvolle Faustregel fuer eine TEXTSEITE -- und eine Falle fuer
jede andere.
entwicklung.html ist am 24./25.09. umgebaut worden: Aus achtzehn
Zahlenkaesten wurden zwei Personenkacheln mit einem Ring. Die Seite
sagt seither MEHR und braucht dafuer WENIGER Worte -- 350 Zeichen.
Die Pruefung wurde rot und bestrafte damit genau die Verbesserung,
die Filipe bestellt hatte.
NACHGESEHEN STATT GEGLAUBT: Auf der Seite stehen beide
Personenkacheln mit Namen, Rolle, Ring und Stand, dazu vier
Abschnitte. Sie ist voll. Nur eben kurz.
DESHALB DARF JEDE SEITE SAGEN, WORAN MAN SIEHT, DASS SIE DA IST:
eine Zeichenzahl, wo Text die Sache ist -- ein MERKMAL, wo Struktur
die Sache ist. Wer die Seite umbaut, zieht das Merkmal mit; wer sie
leerlaufen laesst, wird rot. Eine Zahl kann beides nicht
unterscheiden. */
for (const [name, pfad, keks, wieVoll] of [
["regeln", "treff-regeln.html"],
["rechte", "rechte.html"],
["moderation", "treff-moderation.html"],
@@ -446,22 +547,32 @@ for (const [name, pfad, keks] of [
pruef-nachwuchs: Dort wird gemessen, was der Server ANTWORTET,
hier, was auf dem Bildschirm LANDET. Beides ist noetig, und beides
findet andere Fehler. */
["entwicklung", "entwicklung.html"],
/* Zwei Personenkacheln, nicht 400 Zeichen: Die Seite ist eine
Uebersicht ueber Menschen, kein Aufsatz. */
["entwicklung", "entwicklung.html", null, { merkmal: ".e-person", mindestens: 2 }],
["talente", "talente.html"],
/* UND EINMAL DIESELBE SEITE MIT ANDEREN AUGEN. "Deine Karte" gibt es
nur fuer die, ueber die geurteilt wird -- DogFather sieht sie nie.
Ohne diese Zeile waere der ganze Abschnitt nie auf einem Bildschirm
gewesen. */
["entwicklung-hand", "entwicklung.html", kHand],
["entwicklung-hand", "entwicklung.html", kHand,
{ merkmal: ".e-person", mindestens: 1 }],
]) {
melde("");
melde(`=== ${pfad} ===`);
for (const [breite, hoehe] of [[1440, 1000], [390, 844]]) {
const r = await ansehen(name, pfad, "CODE-DOGI-0001", breite, hoehe, keks);
const r = await ansehen(name, pfad, "CODE-DOGI-0001", breite, hoehe, keks,
wieVoll?.merkmal || null);
if (breite === 1440) { gesehen[name] = r.text; gesehen[name + ":karte"] = r.karte; }
const wo = `${breite} px`;
ok(r.text.length > 400, `${wo}: die Seite ist gefüllt (${r.text.length} Zeichen)`);
if (wieVoll?.merkmal) {
ok(r.merkmale >= wieVoll.mindestens,
`${wo}: die Seite ist gefüllt (${r.merkmale}x ${wieVoll.merkmal}, `
+ `mindestens ${wieVoll.mindestens}; ${r.text.length} Zeichen)`);
} else {
ok(r.text.length > 400, `${wo}: die Seite ist gefüllt (${r.text.length} Zeichen)`);
}
/* DER PLATZHALTER IST DER EIGENTLICHE PUNKT. Bleibt "…" stehen, hat
der Abruf der Zahlen nicht funktioniert -- und der Regeltext
verspricht dann gar nichts statt etwas Falsches. Sichtbar wäre
@@ -489,6 +600,31 @@ for (const [name, pfad, keks] of [
ok(r.kontrast.gemessen > 0 && r.kontrast.schlecht.length === 0,
`${wo}: ${r.kontrast.gemessen} Textstücke, alle lesbar`
+ (r.kontrast.schlecht.length ? " -- ZU DUNKEL: " + r.kontrast.schlecht.slice(0, 3).join(" | ") : ""));
/* ==== KANN DER FARBLESER, WAS ER SOLL? (25.09.2026) ===========
Eine Messung, deren Werkzeug stumpf ist, meldet nicht „weiss
nicht", sondern eine Zahl -- und die sieht aus wie ein Befund.
Genau das ist mit `color(srgb ...)` passiert: dunkler Text auf
hellblauer Flaeche wurde als 1,07 gemeldet, weil die Flaeche
nicht gelesen werden konnte und die Messung beim fast schwarzen
Elternteil landete.
Die vier Proben laufen bei JEDER Seite mit; sie kosten nichts
und wuerden sofort rot, wenn jemand den Leser vereinfacht. Die
letzte ist die wichtigste: Ein unbekanntes Format muss NICHTS
liefern. Ein Leser, der im Zweifel Schwarz zurueckgibt, waere
schlimmer als der alte -- er wuerde nie wieder auffallen. */
const pr = r.kontrast.probe || {};
const gleich = (a, b) => Array.isArray(a) && a.length === 4
&& a.every((x, i) => Math.abs(x - b[i]) < 0.6);
ok(gleich(pr.rgb, [10, 18, 30, 1])
&& gleich(pr.rgba, [255, 255, 255, 0.5])
&& gleich(pr.srgb, [93.7, 199.6, 246.6, 1])
&& gleich(pr.srgbAlpha, [255, 0, 0, 0.25])
&& pr.unsinn === null,
`${wo}: der Farbleser kennt rgb, rgba, color(srgb) und sagt sonst nichts`
+ ` (${JSON.stringify(pr.srgb)})`);
/* Und die Frage davor: Konnte überhaupt gemessen werden? Text, der
auf der Bühne liegt, hat keinen berechenbaren Kontrast -- die
Zeile darüber wäre für ihn grün geblieben, ohne ihn anzusehen. */