frontend: Touch-Langdruck springt beim Loslassen (Fokus blieb sonst nicht)
Auf echten Touch-Geräten flackerte die Markierung im Editor nach dem langen
Druck nur kurz auf und der Fokus fiel sofort wieder heraus.
Ursache: Der Sprung lief im 500-ms-Timer, und `focus()` aus einem
Timer-Callback gilt in mobilen Browsern nicht als Nutzergeste — ein Textfeld
darf sich so nicht selbst fokussieren (sonst könnte jede Seite ungefragt die
Bildschirmtastatur aufziehen). `touchend` ist eine Nutzergeste.
- Der Timer setzt jetzt nur noch die Rückmeldung: der Zielknoten bekommt die
Klasse `armed` mit demselben Petrol-Ring wie unter dem Alt-Zeiger.
`jumpToLine()` läuft im touchend-Handler; Wischen bricht weiterhin ab.
- Zweiter Beitrag zum selben Symptom: die native Textauswahl bzw. das
Link-Callout des Browsers startet bei derselben Druckdauer und riss die
Auswahl an sich. Drei Schichten dagegen, weil keine allein überall wirkt:
contextmenu-preventDefault während des Drucks (überall), `user-select:none`
an .node für grobe Zeiger (@media hover:none and pointer:coarse) und
`-webkit-touch-callout:none` (nur iOS; Chrome kennt es nicht mehr). Die
frühere Regel `a.node{-webkit-touch-callout:none}` geht darin auf.
Verifiziert (synthetische TouchEvents): während des Drucks nur `armed` +
Petrol-Ring, Auswahl noch unverändert, Fokus noch nicht im Textfeld; beim
Loslassen Sprung, Fokus TEXTAREA, Klick unterdrückt; Wischen und kurzer Druck
springen nicht und lassen den Klick durch. Ring greift auch unterhalb einer
any-of-Gruppe. Vitest 37/37.
Einschränkung: Weder die Nutzergesten-Regel noch die nativen Langdruck-Gesten
lassen sich synthetisch auslösen — der eigentliche Beweis ist ein Test auf
echter Hardware.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Opus 4.8
parent
c496850b88
commit
bbdecce75a
@@ -542,3 +542,26 @@ bedeutet aber, dass derselbe Klick je nach Knoten Verschiedenes tut. Ebenfalls
|
||||
verworfen: ein **einmaliger Hinweis** nach dem ersten Sprung (localStorage-Flag)
|
||||
— zusätzlicher i18n-Text in 9 Sprachen für einen Effekt, den Cursor und Legende
|
||||
bereits abdecken.
|
||||
|
||||
**Touch: der Sprung passiert beim Loslassen, nicht nach 500 ms (Nachtrag).**
|
||||
Erste Fassung führte den Sprung im 500-ms-Timer aus. Auf echten Touch-Geräten
|
||||
flackerte die Markierung im Editor dann nur kurz auf und der Fokus fiel sofort
|
||||
wieder heraus: **`focus()` aus einem Timer-Callback gilt in mobilen Browsern
|
||||
nicht als Nutzergeste**, das Textfeld darf sich so nicht selbst fokussieren
|
||||
(sonst könnte jede Seite ungefragt die Bildschirmtastatur aufziehen).
|
||||
`touchend` **ist** eine Nutzergeste — dort bleibt der Fokus. Der Timer macht
|
||||
seither nur noch die Rückmeldung („scharf": Petrol-Ring am Zielknoten, dieselbe
|
||||
Sprache wie unter dem Alt-Zeiger), der eigentliche Sprung hängt am Loslassen.
|
||||
|
||||
Zweiter Beitrag zum selben Symptom: Die **native Textauswahl bzw. das
|
||||
Link-Callout** des Browsers startet bei etwa derselben Druckdauer und riss die
|
||||
Auswahl an sich. Dagegen drei Schichten, weil keine allein überall wirkt:
|
||||
`preventDefault()` auf `contextmenu` während des Drucks (überall),
|
||||
`user-select:none` an `.node` für grobe Zeiger (`@media (hover:none) and
|
||||
(pointer:coarse)`) und `-webkit-touch-callout:none` (nur iOS/Safari; Chrome
|
||||
kennt die Eigenschaft nicht mehr). Auf Touch lässt sich Knotentext damit nicht
|
||||
mehr markieren — bewusst in Kauf genommen, die Geste ist dort vergeben.
|
||||
|
||||
Lehre für die Prüfung: Synthetische `TouchEvent`s beweisen nur die eigene
|
||||
Ereignis-Logik. Weder die Nutzergesten-Regel noch die nativen Langdruck-Gesten
|
||||
lassen sich so auslösen — beides fiel erst auf echter Hardware auf.
|
||||
|
||||
+3
-2
@@ -232,8 +232,9 @@ verknüpft (siehe D25):
|
||||
- **Diagramm → Text:** **Alt+Klick** auf einen Knoten markiert die zugehörige
|
||||
Zeile im Texteditor (ganze Zeile ausgewählt, in Sicht gescrollt, Fokus im
|
||||
Textfeld). Tastatur: **Alt+Enter** am fokussierten Knoten. Auf Touch-Geräten:
|
||||
**langer Druck** (≥ 500 ms); ein Wischen bricht ab. Ist das Editor-Panel
|
||||
zugeklappt, öffnet der Sprung es zuerst.
|
||||
**langer Druck** — nach ≥ 500 ms zeigt der Knoten einen Petrol-Ring („scharf"),
|
||||
der Sprung erfolgt beim **Loslassen**; ein Wischen bricht ab. Ist das
|
||||
Editor-Panel zugeklappt, öffnet der Sprung es zuerst.
|
||||
- **Text → Diagramm:** Der Knoten der **Cursor-Zeile** wird im Diagramm
|
||||
hervorgehoben (weißer Halo + Ring in Tinte) und beim Zeilenwechsel ins Bild
|
||||
gescrollt. Zeilen ohne Knoten (Kommentar, Leerzeile, ausgeblendetes
|
||||
|
||||
Reference in New Issue
Block a user