fix: Bildschirmtastatur quetscht den Editor nicht mehr zusammen

Die eigentliche Ursache der Meldung — meine erste Diagnose (Titelzeilen-Tipp im
alten Splitter-Modell) war für 1.1.39 richtig, aber nicht das, was der Nutzer
auf dem Pages-Build sah.

setAppHeight() schreibt visualViewport.height nach --app-height, und
body{height:var(--app-height)} macht daraus die Höhe der ganzen Seite. Genau
diesen Wert verkleinert die Bildschirmtastatur — dafür ist visualViewport
gemacht. Nachgemessen linear: Textfeldhöhe = --app-height minus ~206 px feste
Aufbauten. 812 px -> 606 px Text, 440 -> 234, 260 -> 54 px, also drei Zeilen.
Das ist das gemeldete „komplett zusammengeklappt".

Sichtbar ausschließlich auf echten Geräten: In der Emulation gibt es keine
Tastatur, deshalb liefen alle drei Reproduktionsversuche vorher ins Leere.

Unterschieden wird am Fokus, nicht an der Größe: Tastatur und überlagernde
Browserleiste (Brave, der ursprüngliche Anlass des Mechanismus) erzeugen
dieselbe Signatur — vv.height fällt, innerHeight bleibt. Die Tastatur steht
aber nur, wenn ein editierbares Feld den Fokus hat. Solange das so ist, bleibt
die letzte tastaturfreie Höhe stehen; die Seite behält ihre Größe und der
Browser schiebt den Ausschnitt zur Schreibmarke.

Mit nachgebildetem visualViewport geprüft: mit Fokus im Textfeld 812/606 px
(unverändert), ohne Fokus 440/234 px — die Brave-Leiste wirkt also weiter.

orientationchange durchbricht die Sperre (sonst behielte die Seite beim Drehen
während des Tippens das alte Hochformat); der focusout-Timer ruft
() => setAppHeight(), sonst reichte er ein wahres `force` durch.

D17 (Nachtrag 4) und frontend/CLAUDE.md nachgezogen, samt der Lehre: Ein
„nicht reproduzierbar" aus dem Emulator ist bei geräteabhängigen Meldungen
kein Befund (vgl. D25 zu synthetischen TouchEvents).

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
mhoennig
2026-08-23 08:19:46 +02:00
co-authored by Claude Fable 5
parent 1bda54ae59
commit 6463a76e1e
3 changed files with 93 additions and 5 deletions
+12
View File
@@ -398,6 +398,18 @@ verworfene Elemente. Quelle sind ES-Module unter `src/`; `index.html` ist der
**einzige** Touch-Navigation Text → Diagramm (Alt gibt es dort nicht). Keinen
langen Druck ins Textfeld legen — der gehört dem OS (Wortauswahl,
Auswahlgriffe), anders als im Diagramm, wo D25 ihn sich nehmen konnte.
- `--app-height` (`setAppHeight()`, D17-Nachtrag 4): `body{height:var(--app-height)}`
kommt aus `visualViewport.height` — nötig gegen überlagernde Browserleisten
(Brave). **Die Bildschirmtastatur verkleinert denselben Wert** und quetschte
damit den Editor zusammen, sobald der Cursor ins Textfeld kam (Textfeldhöhe =
`--app-height` ~206 px feste Aufbauten; bei 260 px Viewport bleiben 54 px).
Deshalb die Fokus-Sperre `editingNow()`: Solange ein editierbares Feld den
Fokus hat, bleibt die letzte tastaturfreie Höhe stehen. Tastatur und
Browserleiste sind an den **Zahlen** nicht zu unterscheiden (beide: `vv.height`
fällt, `innerHeight` bleibt) — nur am Fokus. `orientationchange` ruft
`setAppHeight(true)` und durchbricht die Sperre; der `focusout`-Timer muss
`() => setAppHeight()` sein, sonst reicht er ein wahres `force` durch.
**Nur auf echten Geräten sichtbar** — in der Emulation gibt es keine Tastatur.
**Der verborgene Bereich ist `display:none` und misst sich damit zu null**
`setMobilePane()` MUSS neu zeichnen: zum Diagramm hin dieselben vier Schritte
wie `applyLayout` (`applyOptStairs`/`alignStems`/`drawCheapPath`/