fix: mobile CJK input, terminal flicker, and layout overflow

Terminal flicker:
- Skip buffer-recovered/clear-terminal events during active buffer load
  to prevent competing clear+rewrite cycles (app.js)
- Move viewport+scrollback clear inside dimension-change guard so resize
  without actual SIGWINCH doesn't blank the terminal (terminal-ui.js)
- Sync _lastResizeDims on explicit resize to prevent redundant clears

CJK input rewrite (input-cjk.js):
- Use InputEvent.inputType to distinguish insertText (final) from
  insertCompositionText (tentative) — fixes Chinese punctuation and
  English text being swallowed during Android IME composition
- Remove isComposing guard on Enter so it always sends
- Phantom character (U+200B) keeps textarea non-empty so Android
  long-press backspace generates continuous deleteContentBackward
  events at the keyboard's native repeat rate

CJK input settings:
- Add "CJK Input" toggle in Settings > Input (index.html, settings-ui.js)
- Store as device-specific setting (cjkInputEnabled), not synced to server
- Replace INPUT_CJK_FORM env var dependency with user-controlled setting
  (env var still works as server override)

Mobile layout:
- Fix welcome screen overflow on phones by constraining .welcome-content
  to calc(100vw - 1.5rem) (mobile.css)
- Move xterm helper textarea on-screen for touch devices to fix iOS
  keyboard input (styles.css)
- Focus terminal synchronously in user-gesture context for iOS Safari
  keyboard activation (session-ui.js, app.js)
- Refocus terminal on tap (not scroll) in touch handler (terminal-ui.js)
This commit is contained in:
Teigen
2026-03-24 09:22:06 +08:00
parent b7c3c30c8c
commit 47963b54fa
8 changed files with 261 additions and 52 deletions
+13 -1
View File
@@ -94,7 +94,11 @@ textarea:focus-visible {
outline: none;
}
/* xterm.js hidden textarea — must never show focus ring or caret */
/* xterm.js hidden textarea — must never show focus ring or caret.
* On mobile (touch devices), override xterm.css defaults that position the
* textarea at left:-9999em with width/height:0. iOS Safari ignores keyboard
* input to off-screen zero-size textareas, so we move it on-screen with a
* minimal size while keeping it visually invisible. */
.xterm-helper-textarea {
border: none !important;
box-shadow: none !important;
@@ -102,6 +106,14 @@ textarea:focus-visible {
opacity: 0 !important;
caret-color: transparent !important;
}
.touch-device .xterm .xterm-helper-textarea {
left: 0 !important;
top: 0 !important;
width: 1px !important;
height: 1px !important;
z-index: -1 !important;
font-size: 16px !important; /* prevent iOS auto-zoom on focus */
}
/* Session tab focus */
.session-tab:focus-visible {