Merge pull request #55 from TeigenZhang/fix/auto-attach-on-restart

fix: auto-attach PTY on server restart
2026-10-03 14:09:42 +02:00 · 2026-04-03 03:50:31 +02:00
parent 53b473708f 28a6247c27
commit 8e679a280b
8 changed files with 970 additions and 73 deletions
@@ -309,7 +309,7 @@ export class StateStore {

    this.ensureDir();

-    const tempPath = this.filePath + '.tmp';
+    const tempPath = `${this.filePath}.${process.pid}.${Date.now()}.${Math.random().toString(36).slice(2)}.tmp`;
    const backupPath = this.filePath + '.bak';

    // Step 1: Serialize state (validates it's JSON-safe)
@@ -373,7 +373,7 @@ export class StateStore {

    this.ensureDir();

-    const tempPath = this.filePath + '.tmp';
+    const tempPath = `${this.filePath}.${process.pid}.${Date.now()}.${Math.random().toString(36).slice(2)}.tmp`;
    const backupPath = this.filePath + '.bak';

    const json = this.serializeState();
@@ -2105,8 +2105,9 @@ class CodemanApp {

    // Track working directory for path normalization in Project Insights
    this.currentSessionWorkingDir = session?.workingDir || null;
-    if (session && session.pid === null && session.status === 'idle') {
-      // This is a restored session - attach to the existing screen/shell
+    if (session && session.pid === null && !session._ended) {
+      // Session has no PTY attached — either restored after server restart
+      // or detached for some other reason. Re-attach regardless of status.
      try {
        const endpoint = session.mode === 'shell'
          ? `/api/sessions/${sessionId}/shell`
@@ -4,7 +4,7 @@
 * Defines two exports:
 *
 * - KeyboardAccessoryBar (singleton object) — Quick action buttons shown above the virtual
- *   keyboard on mobile: arrow up/down, /init, /clear, /compact, paste, and dismiss.
+ *   keyboard on mobile: Esc, arrow up/down, Tab, Shift+Tab, Ctrl+O, /init, /clear, /compact, paste, and dismiss.
 *   Destructive actions (/clear, /compact) require double-tap confirmation (2s amber state).
 *   Commands are sent as text + Enter separately for Ink compatibility.
 *   Only initializes on touch devices (MobileDetection.isTouchDevice guard).
@@ -53,17 +53,32 @@ const KeyboardAccessoryBar = {
          <path d="M19 9l-7 7-7-7"/>
        </svg>
      </button>
-      <button class="accessory-btn" data-action="init" title="/init">/init</button>
-      <button class="accessory-btn" data-action="clear" title="/clear">/clear</button>
-      <button class="accessory-btn" data-action="compact" title="/compact">/compact</button>
+      <button class="accessory-btn accessory-btn-arrow" data-action="arrow-left" title="Arrow left">
+        <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
+          <path d="M15 19l-7-7 7-7"/>
+        </svg>
+      </button>
+      <button class="accessory-btn accessory-btn-arrow" data-action="arrow-right" title="Arrow right">
+        <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
+          <path d="M9 5l7 7-7 7"/>
+        </svg>
+      </button>
      <button class="accessory-btn" data-action="paste" title="Paste from clipboard">
        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
          <path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"/>
          <rect x="8" y="2" width="8" height="4" rx="1" ry="1"/>
        </svg>
      </button>
-      <button class="accessory-btn accessory-btn-dismiss" data-action="dismiss" title="Dismiss keyboard">
-        <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3">
+      <button class="accessory-btn" data-action="tab" title="Tab">Tab</button>
+      <button class="accessory-btn" data-action="shift-tab" title="Shift+Tab">⇧Tab</button>
+      <button class="accessory-btn" data-action="ctrl-o" title="Ctrl+O">⌃O</button>
+      <button class="accessory-btn" data-action="opt-enter" title="Option+Enter (newline)">⌥Enter</button>
+      <button class="accessory-btn" data-action="esc" title="Escape">Esc</button>
+      <button class="accessory-btn" data-action="init" title="/init">/init</button>
+      <button class="accessory-btn" data-action="clear" title="/clear">/clear</button>
+      <button class="accessory-btn" data-action="compact" title="/compact">/compact</button>
+      <button class="accessory-btn accessory-btn-arrow" data-action="dismiss" title="Dismiss keyboard">
+        <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
          <path d="M19 9l-7 7-7-7"/>
        </svg>
      </button>
@@ -80,7 +95,7 @@ const KeyboardAccessoryBar = {
      this.handleAction(action, btn);

      // Refocus terminal so keyboard stays open (tap blurs terminal → keyboard dismisses → toolbar shifts)
-      if ((action === 'scroll-up' || action === 'scroll-down') ||
+      if ((action === 'scroll-up' || action === 'scroll-down' || action === 'arrow-left' || action === 'arrow-right' || action === 'tab' || action === 'shift-tab' || action === 'ctrl-o' || action === 'opt-enter' || action === 'esc') ||
          ((action === 'clear' || action === 'compact') && this._confirmAction)) {
        if (typeof app !== 'undefined' && app.terminal) {
          app.terminal.focus();
@@ -109,6 +124,27 @@ const KeyboardAccessoryBar = {
      case 'scroll-down':
        this.sendKey('\x1b[B');
        break;
+      case 'arrow-left':
+        this.sendKey('\x1b[D');
+        break;
+      case 'arrow-right':
+        this.sendKey('\x1b[C');
+        break;
+      case 'esc':
+        this.sendKey('\x1b');
+        break;
+      case 'opt-enter':
+        this.sendKey('\x1b\r');
+        break;
+      case 'tab':
+        this.sendKey('\t');
+        break;
+      case 'shift-tab':
+        this.sendKey('\x1b[Z');
+        break;
+      case 'ctrl-o':
+        this.sendKey('\x0f');
+        break;
      case 'init':
        this.sendCommand('/init');
        break;
@@ -886,7 +886,8 @@ html.mobile-init .file-browser-panel {
    padding-right: calc(8px + var(--safe-area-right));
    gap: 8px;
    align-items: center;
-    justify-content: center;
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
    z-index: 51;
    transition: transform 0.15s ease-out;
    will-change: transform;
@@ -896,10 +897,16 @@ html.mobile-init .file-browser-panel {
    display: flex;
  }

+  /* 隐藏滚动条但保留滑动能力 */
+  .keyboard-accessory-bar::-webkit-scrollbar {
+    display: none;
+  }
+
  .accessory-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
+    flex-shrink: 0;
    gap: 4px;
    padding: 6px 12px;
    background: #2a2a2a;
@@ -939,24 +946,6 @@ html.mobile-init .file-browser-panel {
    background: #2563eb;
  }

-  .accessory-btn-dismiss {
-    padding: 8px 14px;
-    background: #2a2a2a;
-    border: 1.5px solid rgba(255, 255, 255, 0.25);
-    border-radius: 6px;
-    color: #e5e5e5;
-  }
-
-  .accessory-btn-dismiss svg {
-    width: 22px;
-    height: 22px;
-    stroke-width: 3;
-  }
-
-  .accessory-btn-dismiss:active {
-    background: #3a3a3a;
-  }
-
  /* Voice preview — positioned above accessory bar on mobile */
  .voice-preview {
    bottom: calc(var(--safe-area-bottom) + 94px);
@@ -2068,7 +2057,8 @@ html.mobile-init .file-browser-panel {
  padding: 6px 8px;
  gap: 8px;
  align-items: center;
-  justify-content: center;
+  overflow-x: auto;
+  -webkit-overflow-scrolling: touch;
  z-index: 51;
 }

@@ -2076,10 +2066,15 @@ html.mobile-init .file-browser-panel {
  display: flex;
 }

+.keyboard-accessory-bar::-webkit-scrollbar {
+  display: none;
+}
+
 .accessory-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
+  flex-shrink: 0;
  gap: 4px;
  padding: 6px 12px;
  background: #2a2a2a;
@@ -2118,24 +2113,6 @@ html.mobile-init .file-browser-panel {
  background: #2563eb;
 }

-.accessory-btn-dismiss {
-  padding: 8px 14px;
-  background: #2a2a2a;
-  border: 1.5px solid rgba(255, 255, 255, 0.25);
-  border-radius: 6px;
-  color: #e5e5e5;
-}
-
-.accessory-btn-dismiss svg {
-  width: 22px;
-  height: 22px;
-  stroke-width: 3;
-}
-
-.accessory-btn-dismiss:active {
-  background: #3a3a3a;
-}
-
 /* ============================================================================
   iOS Safari Specific Fixes
   ============================================================================ */
@@ -179,6 +179,7 @@ Object.assign(CodemanApp.prototype, {
      // Accumulate sub-line pixel deltas so slow swipes still scroll
      let pixelAccum = 0;

+      let didScroll = false; // track whether touchmove fired (tap vs scroll)
      container.addEventListener(
        'touchstart',
        (ev) => {
@@ -187,6 +188,7 @@ Object.assign(CodemanApp.prototype, {
            velocity = 0;
            pixelAccum = 0;
            isTouching = true;
+            didScroll = false;
            lastTime = 0;
            if (scrollFrame) {
              cancelAnimationFrame(scrollFrame);
@@ -201,6 +203,7 @@ Object.assign(CodemanApp.prototype, {
        'touchmove',
        (ev) => {
          if (ev.touches.length === 1 && isTouching) {
+            didScroll = true;
            const touchY = ev.touches[0].clientY;
            const delta = touchLastY - touchY; // positive = scroll down
            pixelAccum += delta;
@@ -225,6 +228,12 @@ Object.assign(CodemanApp.prototype, {
          if (!scrollFrame && Math.abs(velocity) > 0.3) {
            scrollFrame = requestAnimationFrame(scrollLoop);
          }
+          // Tap (no scroll): refocus xterm's hidden textarea so keyboard input
+          // routes back to the terminal. Without this, a tap on the terminal area
+          // consumes the touch event but xterm's textarea never regains focus.
+          if (!didScroll && this.terminal) {
+            this.terminal.focus();
+          }
        },
        { passive: true }
      );
@@ -284,22 +293,6 @@ Object.assign(CodemanApp.prototype, {
          }
          this.flushFlickerBuffer();
        }
-        // Clear viewport + scrollback for Ink-based sessions before sending SIGWINCH.
-        // fitAddon.fit() reflows content: lines at old width may wrap to more rows,
-        // pushing overflow into scrollback. Ink's cursor-up count is based on the
-        // pre-reflow line count, so ghost renders accumulate in scrollback.
-        // Fix: \x1b[3J (Erase Saved Lines) clears scrollback reflow debris,
-        // then \x1b[H\x1b[2J clears the viewport for a clean Ink redraw.
-        const activeResizeSession = this.activeSessionId ? this.sessions.get(this.activeSessionId) : null;
-        if (
-          activeResizeSession &&
-          activeResizeSession.mode !== 'shell' &&
-          !activeResizeSession._ended &&
-          this.terminal &&
-          this.isTerminalAtBottom()
-        ) {
-          this.terminal.write('\x1b[3J\x1b[H\x1b[2J');
-        }
        // Skip server resize while mobile keyboard is visible — sending SIGWINCH
        // causes Ink to re-render at the new row count, garbling terminal output.
        // Local fit() still runs so xterm knows the viewport size for scrolling.
@@ -311,6 +304,24 @@ Object.assign(CodemanApp.prototype, {
          const rows = dims ? Math.max(dims.rows, MIN_ROWS) : MIN_ROWS;
          // Only send resize if dimensions actually changed
          if (!this._lastResizeDims || cols !== this._lastResizeDims.cols || rows !== this._lastResizeDims.rows) {
+            // Clear viewport + scrollback ONLY when dimensions actually change.
+            // fitAddon.fit() reflows content: lines at old width may wrap to more rows,
+            // pushing overflow into scrollback. Ink's cursor-up count is based on the
+            // pre-reflow line count, so ghost renders accumulate in scrollback.
+            // Fix: \x1b[3J (Erase Saved Lines) clears scrollback reflow debris,
+            // then \x1b[H\x1b[2J clears the viewport for a clean Ink redraw.
+            // IMPORTANT: Only clear when we're actually sending SIGWINCH (dims changed).
+            // Clearing without a subsequent Ink redraw leaves the terminal blank.
+            const activeResizeSession = this.activeSessionId ? this.sessions.get(this.activeSessionId) : null;
+            if (
+              activeResizeSession &&
+              activeResizeSession.mode !== 'shell' &&
+              !activeResizeSession._ended &&
+              this.terminal &&
+              this.isTerminalAtBottom()
+            ) {
+              this.terminal.write('\x1b[3J\x1b[H\x1b[2J');
+            }
            this._lastResizeDims = { cols, rows };
            fetch(`/api/sessions/${this.activeSessionId}/resize`, {
              method: 'POST',
@@ -1348,6 +1359,10 @@ Object.assign(CodemanApp.prototype, {
    if (this.fitAddon) this.fitAddon.fit();
    const dims = this.getTerminalDimensions();
    if (!dims) return;
+    // Update _lastResizeDims so the throttledResize handler won't redundantly
+    // clear the terminal for the same dimensions (which would blank the screen
+    // without a subsequent Ink redraw to repaint it).
+    this._lastResizeDims = { cols: dims.cols, rows: dims.rows };
    // Fast path: WebSocket resize
    if (this._wsReady && this._wsSessionId === sessionId) {
      try {
@@ -1767,15 +1767,28 @@ export class WebServer extends EventEmitter {

            this.sessions.set(session.id, session);
            await this.setupSessionListeners(session);
-            this.persistSessionState(session);

-            // Mark it as restored (not started yet - user needs to attach)
-            getLifecycleLog().log({
-              event: 'recovered',
-              sessionId: session.id,
-              name: session.name,
-            });
-            console.log(`[Server] Restored session ${session.id} from mux ${muxSession.muxName}`);
+            // Auto-attach PTY to the surviving tmux session immediately.
+            // This ensures ALL sessions resume capturing output right away,
+            // not just the one the client happens to select first.
+            try {
+              await session.startInteractive();
+              getLifecycleLog().log({
+                event: 'recovered',
+                sessionId: session.id,
+                name: session.name,
+              });
+              console.log(`[Server] Restored and attached session ${session.id} from mux ${muxSession.muxName}`);
+            } catch (attachErr) {
+              console.error(`[Server] Failed to attach session ${session.id}, keeping as detached:`, attachErr);
+              getLifecycleLog().log({
+                event: 'recovered',
+                sessionId: session.id,
+                name: session.name,
+              });
+            }
+
+            this.persistSessionState(session);
          }
        }