From 24f9be8e4f776226cfc5de62da6a586cc0a55009 Mon Sep 17 00:00:00 2001 From: Dogfather Date: Fri, 25 Sep 2026 02:25:06 +0200 Subject: [PATCH] =?UTF-8?q?Drei=20F=C3=A4cher,=20Gesichter,=20Zeichen=20an?= =?UTF-8?q?=20jedem=20Handgriff=20--=20der=20Chat=20ist=20nicht=20wiederzu?= =?UTF-8?q?erkennen?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Filipe: "ich will 3 kategorien haben. chats mit einzelnen personen, gruppen chats und kanäle." Und: "ich will dass du überhaupt die komplette kachel veränderst, ich will dass alles anderst aussieht und gestaltet ist, mach wirklich was verrücktes und übertrieben krank geiles ... dass die ganze community und team morgen total überrascht sind und den chat nicht wieder erkennen." DIE LISTE HAT DREI FÄCHER. Personen, Gruppen, Kanäle -- als Mulde mit drei Schaltern über dem Suchfeld, nicht als drei freie Knöpfe: Drei Dinge, die einander ausschließen, liest man nur als EINE Entscheidung, wenn sie in einer gemeinsamen Fassung sitzen. Das gewählte Fach liegt oben auf (Licht, Schatten, Akzentsaum), die anderen liegen darin -- man sieht die Wahl an der Tiefe, nicht nur an der Farbe. Die Wahl überlebt das Neuladen; beim Suchen gilt sie nicht, wer einen Namen tippt will ihn finden und nicht raten, in welchem Fach er liegt. WAS EIN GESCHLOSSENES FACH NICHT VERSCHLUCKEN DARF: die Ungelesenen und den Ruf. Beides steht deshalb AM Fach -- die Zahl in der Warnfarbe, das @ in der Akzentfarbe. Gefunden hat die Lücke nicht ein Blick, sondern pruef-erwaehnung: Die Erwähnung lag in einer Gruppe, offen war "Personen", und das @ war damit nirgends zu sehen. EIN LEERES FACH MERKT MAN SICH NICHT. Wer nur einen Kanal hat -- jeder Neue im Haus -- landete auf "Personen" und sah eine leere Liste neben einem vollen Kanal. Beim ersten Zeichnen wird deshalb ins erste Fach gewechselt, in dem etwas steht; Reihenfolge: gerufen, dann ungelesen, dann überhaupt vorhanden. Gespeichert wird das NICHT -- es ist geraten, nicht gewählt. Gefunden von pruef-gifs. EIN GESICHT IM KOPF DES GESPRÄCHS. Links in der Liste trägt jedes Gespräch sein Zeichen, und ausgerechnet beim Öffnen verschwand es. Es ist dasselbe Zeichen, nicht ein ähnliches: `zeichenFuellen()` füllt jetzt Liste und Kopf -- rund fünfzig Zeilen standen vorher mitten im Zeichnen und hätten sonst ein zweites Mal dagestanden. Am Handy bleibt es weg, nachgerechnet: mit ihm blieben dem Namen 126 px bei 128 Untergrenze, die Knopfreihe fiele eine Zeile tiefer. JEDER HANDGRIFF BEKOMMT SEIN ZEICHEN. Unter jeder Blase standen fünf Wörter in Versalien -- bei zwölf Nachrichten sechzig. Jetzt Pfeil, Gesicht, Papierkorb, Nadel und zwei Blätter, das Wort klein daneben. Die Wörter bleiben: "anheften" und "lösen" sehen als Nadel gleich aus, und "löschen (Notfall)" darf nie ein Rätsel sein. Breiter wird es trotzdem nicht -- gesperrte Versalien kosten rund ein Viertel mehr Breite, genau das, was die Zeichen brauchen. Die Zeichen sind Masken: sie folgen `currentColor` und damit jedem Zustand der Schrift daneben. AUS DER FUSSZEILE WIRD EINE MULDE, und der Grund wird dabei dunkler, nie heller -- das ist die Bedingung dafür, dass die Kontrastzusage gültig bleibt. Die Uhrzeit bekommt ein eigenes Schild: eine Angabe, keine Bedienung. AUS DEM FARBFLECK WIRD EIN RING. Der Knopf für die eigene Kachel war ein voller Kreis in der gewählten Farbe, direkt neben einer gleich großen Marke -- man las ihn als Meldung, und er meldet nichts. Farbe erscheint auf dieser Seite überall als Kontur; jetzt auch hier. AUS DEM TOTEN TRENNER WIRD LICHT. Die senkrechte Linie am Verlauf stammte aus der Zeit, als Liste und Verlauf EIN Kasten waren; seit dem Umbau auf zwei Tafeln klebte sie ohne Aufgabe an der Kante. An ihrer Stelle ein sehr weicher Schein oben rechts, unter vier Prozent Deckung -- Tiefe, kein Leuchten. DIE KONSOLE: Das Schreibfeld ist eine Rinne statt eines flachen Kastens, die vier Werkzeuge sprechen dieselbe Sprache, und der Absendeknopf ist als einziger gefüllt. Keine Maßzahl angefasst -- die Zeile ist seit dem 23.09. auf den Pixel voll. ZWEI PRÜFUNGEN WURDEN GENAUER, NICHT NACHSICHTIGER: pruef-chatkachel suchte ihre "freie Stelle" nicht, sie rechnete sie aus -- 6 px vom rechten Rand, halbe Höhe. Das lag mal auf dem Rollbalken, mal auf einer Blase, und meldete beides Mal "das Bühnenbild ist gar nicht da". Sie sucht die Stelle jetzt mit `elementFromPoint` und sagt es, wenn es keine gibt. pruef-erwaehnung prüft jetzt beides: dass das Fach den Ruf meldet, ohne geöffnet zu werden, UND dass die Zeile nach dem Wechsel dasteht -- mit der Gegenprobe, dass das Fach wirklich filtert. 126 -> 129. Nachgebessert: die Ungelesen-Marke am Fach stand auf 0,64 rem = 10,24 px, unter der Hausgrenze von 11,5. Gemeldet von pruef-css-klassen, bevor es jemand auf einem Telefon sehen musste -- der zweite Anlauf desselben Reflexes an einem Tag. Geprüft: pruef-chat-optik, pruef-chatkachel (40), pruef-chat (ALLES IN ORDNUNG), pruef-chat-neu (32), pruef-chat-ausbau (64), pruef-chat-kanaele (81), pruef-chat-aufloesen (126), pruef-chat-anhaenge (109), pruef-erwaehnung (129), pruef-css-klassen, pruef-tippziele (11), pruef-lesbarkeit. pruef-gifs hat weiterhin die zwei Fehler, die schon vor diesem Umbau da waren (an HEAD nachgemessen). Co-Authored-By: Claude Opus 5 --- server/pruef-chatkachel.mjs | 65 +++- server/pruef-erwaehnung.mjs | 66 ++++ workspace/anruf-probe.html | 10 +- workspace/app.webmanifest | 8 +- workspace/assets/css/chat.css | 603 +++++++++++++++++++++++++++++--- workspace/assets/js/chat.js | 290 ++++++++++++--- workspace/aufgaben.html | 38 +- workspace/automation.html | 32 +- workspace/befinden.html | 34 +- workspace/bereich.html | 44 +-- workspace/bewerben.html | 38 +- workspace/bewerbungen.html | 36 +- workspace/calls.html | 34 +- workspace/chat.html | 87 ++++- workspace/content.html | 34 +- workspace/crew-index.html | 12 +- workspace/crew.webmanifest | 8 +- workspace/dateien.html | 34 +- workspace/entwicklung.html | 36 +- workspace/hilfe.html | 30 +- workspace/index.html | 10 +- workspace/kalender.html | 34 +- workspace/leistung.html | 32 +- workspace/material.html | 32 +- workspace/personen.html | 32 +- workspace/profil.html | 36 +- workspace/rechte.html | 34 +- workspace/report.html | 36 +- workspace/scouting.html | 32 +- workspace/start.html | 32 +- workspace/startcheck.html | 34 +- workspace/steckbrief.html | 36 +- workspace/support.html | 28 +- workspace/talente.html | 36 +- workspace/team.html | 32 +- workspace/teamlage.html | 34 +- workspace/teilen.html | 30 +- workspace/treff-moderation.html | 32 +- workspace/treff-regeln.html | 32 +- workspace/uebersicht.html | 32 +- workspace/unsere-seiten.html | 30 +- workspace/unterstuetzen.html | 32 +- workspace/werdegang.html | 32 +- workspace/willkommen.html | 30 +- workspace/wissen.html | 34 +- 45 files changed, 1608 insertions(+), 725 deletions(-) diff --git a/server/pruef-chatkachel.mjs b/server/pruef-chatkachel.mjs index c803895d..1417356f 100644 --- a/server/pruef-chatkachel.mjs +++ b/server/pruef-chatkachel.mjs @@ -475,12 +475,69 @@ try { /* Mitten in der Kachel -- nicht am Rand, dort liegen Kante und abgerundete Ecke. */ kachel: { x: Math.round(rb.left + rb.width / 2), y: Math.round(rb.top + rb.height / 2) }, - /* Und ein Fleck im Verlauf, auf dem sicher keine Kachel liegt: - ganz rechts aussen, wo die eigenen Nachrichten nicht hinreichen. */ - frei: { x: Math.round(rv.right - 6), y: Math.round(rv.top + rv.height / 2) }, + /* Die freie Stelle steht weiter unten -- sie wird GESUCHT. */ + frei: null, }; }); - ok(!!punkte, "Kachel und freie Fläche gefunden"); + + /* ==== DIE FREIE STELLE WIRD GESUCHT, NICHT GERATEN ================ + (nachgebessert 25.09.2026, nach zwei Fehlalarmen an einem Abend) + + Hier stand ein fester Punkt: „6 Pixel vom rechten Rand, auf halber + Hoehe". Das hat zweimal dasselbe Ergebnis gehabt -- rot, ohne dass + an der Sache etwas war: + + 1. `rect.right` schliesst den ROLLBALKEN ein. Sobald der Verlauf + laenger wird als das Fenster, liegt der Punkt auf ihm: eine + deckende Flaeche, die sich nicht aendert, wenn man das + Buehnenbild abschaltet. + 2. Auch ohne Balken ist „halbe Hoehe" nicht frei. Eigene + Nachrichten stehen rechtsbuendig und reichen bis an die + Polsterung; wird eine Blase um ein paar Pixel hoeher (heute: + die Handgriffe sitzen jetzt in einer Mulde), liegt auf halber + Hoehe ploetzlich eine Kachel. Die Pruefung meldet dann „das + Buehnenbild ist gar nicht da", und der Fehler steht an einer + Stelle, die niemand im Verdacht hat. + + Der Punkt ist also nicht die Sache -- die Sache ist „eine Stelle + im Verlauf, auf der KEINE Kachel liegt". Genau das laesst sich + fragen, statt es auszurechnen: `elementFromPoint` sagt, was an + einer Stelle obenauf liegt. Gesucht wird von oben nach unten, bis + dort keine Nachricht mehr ist. + + UND WENN ES KEINE GIBT, wird das gesagt und nicht geschwiegen -- + der dritte Ausgang: Eine Messung, die ihre Voraussetzung nicht + findet, muss scheitern, nicht bestaetigen. */ + const freiePunkte = await s.evaluate(() => { + const v = document.querySelector(".chat__verlauf"); + if (!v) return null; + const rv = v.getBoundingClientRect(); + /* `clientWidth` laesst den Rollbalken aussen vor, die 6 px liegen + damit immer in der 18-px-Polsterung des Verlaufs. */ + const x = Math.round(rv.left + v.clientWidth - 6); + for (let y = Math.round(rv.top) + 10; y < rv.bottom - 10; y += 6) { + const e = document.elementFromPoint(x, y); + /* Nicht nur „ist keine Blase", sondern „gehoert zu gar keiner + Nachricht": Reaktionen, Zitate und Anhaenge sind ebenfalls + deckend und haengen an derselben Zeile. */ + if (e && !e.closest(".chat-nachricht") && v.contains(e)) { + return { x, y, gefunden: true }; + } + } + /* KEIN `null`. Die Pruefung soll scheitern und trotzdem + weiterlaufen -- mit `null` wuerde die naechste Aufnahme + abstuerzen, und ein Absturz sagt weniger als ein roter Punkt + mit Begruendung. Der Ersatzpunkt liegt oben in der Polsterung; + er misst dann eben nichts Aussagekraeftiges, und genau das + steht in der Zeile darueber. */ + return { x, y: Math.round(rv.top) + 10, gefunden: false }; + }); + ok(!!punkte && !!freiePunkte && freiePunkte.gefunden, + freiePunkte && freiePunkte.gefunden + ? `Kachel und freie Fläche gefunden (frei bei y ${freiePunkte.y})` + : "ABBRUCH: im Verlauf ist keine Stelle ohne Kachel zu finden — " + + "ohne sie lässt sich nicht nachweisen, dass das Bühnenbild da ist"); + if (punkte && freiePunkte) punkte.frei = freiePunkte; /* Playwright kann einen Ausschnitt aufnehmen -- ein Bildpunkt reicht. */ const punktFarbe = async (pkt) => { diff --git a/server/pruef-erwaehnung.mjs b/server/pruef-erwaehnung.mjs index f58fd179..ec8ea69c 100644 --- a/server/pruef-erwaehnung.mjs +++ b/server/pruef-erwaehnung.mjs @@ -754,11 +754,43 @@ try { Jetzt der Fall, um den es wirklich geht: Sie ist woanders, und es kommt etwas für sie herein. */ + /* ==== DIE LISTE HAT SEIT DEM 25.09.2026 DREI FAECHER ============= + + Filipe: „ich will 3 kategorien haben. chats mit einzelnen + personen, gruppen chats und kanäle." + + Diese Erwaehnung liegt in einer GRUPPE („Testgruppe", weiter + oben), das voreingestellte Fach ist „Personen" -- die Zeile mit + dem @ steht also nicht in der Liste, bevor man das Fach wechselt. + Die Pruefung ist daran rot geworden, und das war RICHTIG: Sie hat + eine echte Luecke gefunden, keine Aeusserlichkeit. Ein Ruf, den + ein geschlossenes Fach verschluckt, ist schlimmer als gar keiner. + + GEBAUT WURDE DARAUFHIN das @ AM FACH (`.chat-art__at`). Die + Pruefung misst jetzt beides und sagt damit mehr als vorher: + + 1. Das Fach „Gruppen" traegt das Zeichen, OHNE dass man es + oeffnet -- man sieht, dass etwas wartet. + 2. Im Fach „Personen" steht die Zeile dabei NICHT (Gegenprobe: + das Fach filtert wirklich, das Zeichen ist keine Dekoration). + 3. Nach dem Wechsel steht die Zeile mit ihrem @ da. + + EIN HELFER STATT DREI ABSCHRIFTEN: Jede Stelle, die ein Fach + waehlt, tut es hier gleich -- sonst waere die dritte die, die + auf das Warten verzichtet. */ + const fachWaehlen = async (seite, art) => { + await seite.click(`.chat-art[data-art="${art}"]`); + await seite.waitForTimeout(400); + }; + await vs.goto(`${BASIS}/workspace/chat.html`, { waitUntil: "networkidle" }); await vs.waitForTimeout(900); + await fachWaehlen(vs, "gruppe"); const vorSchon = await vs.locator(".chat-raum__erwaehnt").count(); ok(vorSchon === 0, `solange nichts Neues da ist, leuchtet auch nichts (${vorSchon})`); + const vorFach = await vs.locator(".chat-art__at").count(); + ok(vorFach === 0, ` und auch an keinem der drei Fächer (${vorFach})`); await s.click("#text"); await s.type("#text", "@VanVan noch eine Sache", { delay: 15 }); @@ -767,6 +799,32 @@ try { await vs.reload({ waitUntil: "networkidle" }); await vs.waitForTimeout(1200); + /* ERST ZURUECK AUF „Personen". Der erste Anlauf verliess sich + darauf, dass das Neuladen dort landet -- tat es nicht, und die + Gegenprobe war rot: Die Wahl des Fachs UEBERLEBT das Neuladen + (localStorage, Absicht seit dem 25.09.2026 -- wer im Kanal + arbeitet, arbeitet meist den ganzen Tag im Kanal). + + Das ist ein Fund und kein Aergernis: Die Pruefung hat damit + nebenbei belegt, dass das Merken wirklich greift. Der Fall, um + den es hier geht, muss aber ausdruecklich hergestellt werden -- + sie steht in einem ANDEREN Fach, und der Ruf liegt woanders. */ + await fachWaehlen(vs, "direkt"); + const fachAt = vs.locator(".chat-art__at"); + ok(await fachAt.count() === 1, + `das Fach mit der Erwähnung trägt das @-Zeichen, ungeöffnet (${await fachAt.count()})`); + const amFach = await vs.locator('.chat-art[data-art="gruppe"] .chat-art__at').count(); + ok(amFach === 1, ` und zwar genau an „Gruppen" (${amFach})`); + ok((await fachAt.first().getAttribute("aria-label") || "").includes("erwähnt"), + " mit einem Satz für Vorleseprogramme statt eines nackten Zeichens"); + /* GEGENPROBE: Im falschen Fach steht die Zeile nicht -- das Fach + filtert wirklich. Ohne diese Zeile koennte das @ am Fach auch + dann gruen sein, wenn die Liste gar nicht filtert. */ + const zeileFalschesFach = await vs.locator(".chat-raum__erwaehnt").count(); + ok(zeileFalschesFach === 0, + `Gegenprobe: im Fach „Personen" steht die Zeile nicht (${zeileFalschesFach}) — das Fach filtert wirklich`); + + await fachWaehlen(vs, "gruppe"); const zeichen = vs.locator(".chat-raum__erwaehnt"); ok(await zeichen.count() === 1, `in ihrer Gesprächsliste steht das @-Zeichen (${await zeichen.count()})`); ok((await zeichen.first().getAttribute("aria-label") || "").includes("erwähnt"), @@ -778,8 +836,16 @@ try { der Antwort des Servers. */ const funny = await alsRolle("scout", "CODE-SCOU-0002", 1280, "chat.html"); await funny.seite.waitForTimeout(1200); + /* AUCH HIER INS RICHTIGE FACH. Im Fach „Personen" waere bei Funny + ohnehin nichts zu sehen -- die Gegenprobe waere dann gruen, ohne + die Gruppe je angesehen zu haben. Genau die Sorte Haken, die + nichts bestaetigt. */ + await fachWaehlen(funny.seite, "gruppe"); const beiFunny = await funny.seite.locator(".chat-raum__erwaehnt").count(); + const beiFunnyFach = await funny.seite.locator(".chat-art__at").count(); const zahlFunny = await funny.seite.locator(".chat-raum__zahl").count(); + ok(beiFunnyFach === 0, + `Gegenprobe: bei Funny trägt auch kein Fach das @ (${beiFunnyFach})`); ok(beiFunny === 0, `Gegenprobe: bei Funny leuchtet nichts (${beiFunny})`); ok(zahlFunny >= 1, ` obwohl sie Ungelesenes hat (${zahlFunny} Gespräch(e) mit Zahl) — es liegt nicht daran`); diff --git a/workspace/anruf-probe.html b/workspace/anruf-probe.html index b365a0fc..707d05dc 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`. --> - - + + - +