diff --git a/server/pruef-kopf-messen.mjs b/server/pruef-kopf-messen.mjs index f37551e7..b10fe4e3 100644 --- a/server/pruef-kopf-messen.mjs +++ b/server/pruef-kopf-messen.mjs @@ -129,7 +129,17 @@ async function leisteFertig(seite, frist = 9000) { Kontrollseite von frueher PLUS die zwei, die zusaetzliche Gestaltungsdateien laden -- dort entstehen Konflikte, nirgends sonst. */ -const SEITEN = ["uebersicht.html", "teilen.html", "bewerben.html"]; +/* DREI KAMEN AM 23.09.2026 DAZU. Auf ihnen wanderte die Kopfleiste + beim Scrollen aus dem Bild, auf den drei darueber nicht -- der + Unterschied war ein Farbton, den kopf.js erst nach dem Laden setzt. + Wer nur die alten drei misst, sieht so etwas nie. + + aufgaben.html und wissen.html tragen einen Ton, chat.html ebenso; + entwicklung.html steht als Gegenprobe dabei (kein Ton) -- sonst + hiesse "alle kleben" nur, dass die Regel fuer den einen Fall + stimmt. */ +const SEITEN = ["uebersicht.html", "teilen.html", "bewerben.html", + "aufgaben.html", "wissen.html", "entwicklung.html"]; /* UND EINE BREITE ANSICHT (17.09.2026). @@ -191,6 +201,59 @@ for (const breite of [320, 390, 430, 1366]) { ausreisser: teile.filter((x) => x.hoehe > schnitt * 1.6), }; }); + /* ---- BLEIBT SIE BEIM SCROLLEN STEHEN? ------------------------------- + + Filipe, 23.09.2026: "die leiste soll immer da fest stehen bleiben + auch wenn man runterscrollt, sonnst muss man immer wieder hoch + scrollen um zurueck zu koennen oder so." + + Sie stand damals auf der Haelfte der Seiten -- und auf der anderen + nicht. Im Quelltext war das nicht zu sehen: Beide Seiten laden + dasselbe CSS, und die Regel, die es kaputt machte, greift erst, + wenn kopf.js ein "data-ton" an den Body haengt. Der Unterschied + entsteht also nach dem Laden. + + GEMESSEN WIRD DAS VERHALTEN, NICHT DIE EIGENSCHAFT. "position ist + sticky" waere die leichtere Frage und die falsche: Eine klebende + Leiste in einem Kasten, der selbst scrollt, hat auch position + sticky -- und wandert trotzdem weg. Gefragt wird deshalb, wo die + Leiste NACH dem Scrollen steht. + + Und nur dort, wo ueberhaupt gescrollt werden KANN: Auf einer + kurzen Seite bewegt sich nichts, und "sie ist noch oben" waere + dann kein Beweis, sondern eine Selbstverstaendlichkeit. Das ist + der dritte Ausgang -- nicht gut, nicht schlecht, sondern nicht + nachsehbar. */ + const kleben = await seite.evaluate(async () => { + const k = document.querySelector(".kopfleiste"); + if (!k) return { fehlt: true }; + const hoch = document.documentElement.scrollHeight - window.innerHeight; + if (hoch < 120) return { zuKurz: true, hoch }; + window.scrollTo(0, Math.min(600, hoch)); + await new Promise((r) => setTimeout(r, 250)); + const y = Math.round(k.getBoundingClientRect().top); + const gescrollt = Math.round(window.scrollY); + window.scrollTo(0, 0); + await new Promise((r) => setTimeout(r, 150)); + return { y, gescrollt, position: getComputedStyle(k).position }; + }); + if (kleben.fehlt) { + geprueft++; fehler++; + console.log(" FEHL " + breite + "px " + wo + ": gar keine Kopfleiste"); + } else if (kleben.zuKurz) { + console.log(" -- " + breite + "px " + wo + ": Seite zu kurz zum Scrollen (" + + kleben.hoch + "px) -- nicht nachsehbar"); + } else { + geprueft++; + /* Zwei Bildpunkte Spielraum: Unterpixel-Rundung beim Zoomen. */ + const bleibt = kleben.y >= -2 && kleben.y <= 2; + if (!bleibt) fehler++; + console.log(" " + (bleibt ? "ok " : "FEHL") + " " + breite + "px " + wo + + ": nach " + kleben.gescrollt + "px Scrollen steht die Leiste bei y=" + + kleben.y + " (position: " + kleben.position + ")" + + (bleibt ? "" : " -- sie wandert mit")); + } + geprueft++; if (reihe.ausreisser.length) { fehler++; diff --git a/workspace/anruf-probe.html b/workspace/anruf-probe.html index 27c53e74..5dbf4253 100644 --- a/workspace/anruf-probe.html +++ b/workspace/anruf-probe.html @@ -16,15 +16,15 @@ verdeckt. Gefunden hat es pruef-struktur. Richtig sind `gate.css` (die Farbwerte des Hauses) und `haus.css`. --> - - + + - +