Show machine loading progress and retain earlier terminal output

Author: writingdeveloper

README.md

@@ -11,7 +11,7 @@ See every repository, live agent session, next task, local usage estimate, and r
 ![License](https://img.shields.io/badge/license-MIT-blue)
 ![Platform](https://img.shields.io/badge/platform-Windows%20%7C%20macOS%20%7C%20Linux-0078D6)
 ![Built with Electron](https://img.shields.io/badge/Electron-43-47848F)
-![Tests](https://img.shields.io/badge/tests-1254%20passing-3fb950)
+![Tests](https://img.shields.io/badge/tests-1255%20passing-3fb950)
 ![CI](https://github.com/writingdeveloper/devdeck/actions/workflows/ci.yml/badge.svg)
 
 </div>

docs/quality-review-1.37.7.md

@@ -0,0 +1,29 @@
+# PC 전환 진행 표시와 터미널 상단 확인
+
+## 확인 및 개선
+
+| 항목 | 확인한 원인 | 처리 |
+| --- | --- | --- |
+| PC 전환이 멈춘 것처럼 보임 | 프로젝트 요청은 최대 150초를 기다리지만 회색 자리 표시자만 표시 | 상단 고정 도구 모음에 대상 PC 이름과 회전 표시. 8초 후 지연 안내. 전환 조작은 계속 허용 |
+| 전환을 반복할 때 진행 상태 혼동 | 이전 요청의 완료가 현재 요청보다 늦을 수 있음 | 선택 세대와 요청 번호가 현재일 때만 상태를 종료. 실패·재시도에도 같은 규칙 적용 |
+| 터미널 이전 출력이 일찍 사라짐 | xterm 기본 보관량 1,000줄 사용 | 세션당 최대 10,000줄 보관 |
+| 접속·화면 복구 시 첫 출력 줄 누락 | 보관 상한에 도달하지 않은 출력도 첫 줄을 무조건 제거 | 실제 앞부분이 잘린 버퍼에만 경계 복구 적용. 온전한 첫 줄과 커서 제어 문자 보존 |
+
+4개 언어와 화면 읽기 프로그램용 진행 상태를 적용했다. 로딩 표시를 위해 진행률을 추정하거나 중복 요청을 보내지 않는다. 데이터 스캔 및 네트워크 대기 시간 자체를 단축하는 변경은 아니다.
+
+## QA
+
+로컬 전체 단위 검사: 1,255개 통과, 기존 1개 생략. 로컬 Electron 복원력 검사: 9개 시나리오 통과.
+
+- 기존 저장 실패·초안 보존·재시작·응답 역전 검사 유지.
+- 원격 응답을 보류하고 즉시 로딩 문구, 8초 후 지연 문구, A→B→A 전환 중 이전 실패 무시 확인.
+- 원격 실패 후 로딩 종료, 재시도 시 로딩 재개, 성공 시 종료 확인.
+- Windows 네이티브 터미널에 1,500줄 출력 후 검색으로 최초 출력에 접근.
+- 스크롤한 설정 화면에서 터미널로 이동하고 800×600, 1280×800 창 크기에서 제목·터미널의 상단 및 하단 경계 검사.
+- 터미널 버퍼 단위 검사에 온전한 첫 줄, 잘린 이스케이프 접두부, 줄바꿈 없는 화면 갱신, 크기 변경 후 첫 줄 보존 추가.
+
+## 구분해야 하는 제한
+
+제목이나 버튼이 화면 위로 잘리는 현상은 이번 탐색과 경계 검사에서는 재현하지 못했다. 출력 기록의 누락과 같은 문제로 단정하지 않았다.
+
+10,000줄은 실행 중인 화면의 보관 상한이다. 원격 연결 시 받는 출력은 256 KiB로 제한되며 크기 변경 때 화면 왜곡을 막기 위해 이전 크기의 원시 출력을 폐기한다. 재연결·수동 화면 복구는 최근 출력으로 화면을 다시 만들기 때문에 모든 과거 기록을 보장하지 않는다. 이를 보장하려면 화면 복구용 데이터와 영구 대화 기록을 분리하는 후속 설계가 필요하다. 기존에 폐기된 출력은 이번 변경으로 복구되지 않는다.

docs/releases/1.37.7.md

@@ -0,0 +1,9 @@
+# DevDeck 1.37.7
+
+- Projects now shows a visible, localized loading indicator naming the selected PC. After eight seconds it explains that loading is taking longer and that switching PCs remains available.
+- Loading state follows the current request: obsolete responses cannot dismiss it, failures stop it, and Retry displays progress again. The notice stays in the sticky toolbar while scrolling.
+- Terminal scrollback increases from the xterm default of 1,000 lines to 10,000 lines, keeping earlier output accessible during longer sessions.
+- Attaching to a running terminal preserves the first output line and its initial cursor-control sequences. Only buffers actually truncated by the memory cap discard an incomplete prefix.
+- Electron QA now checks delayed loading, stale responses, failed-load recovery, searching the start of 1,500 lines of native terminal output, and terminal boundaries after navigation and window resizing.
+
+Terminal scrollback remains bounded. Remote attachment and screen recovery use recent output rather than a permanent transcript; this release does not guarantee all output survives a reconnect, refresh, or application restart. The reported title/top-edge clipping was not reproduced in the navigation and resize checks.

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "devdeck",
-  "version": "1.37.6",
+  "version": "1.37.7",
   "description": "Project command deck — at-a-glance state + Claude Code, Codex, and Antigravity resume",
   "main": "dist/main/main.js",
   "type": "commonjs",

package.json

@@ -17,7 +17,7 @@ const bin = join(sandbox, 'bin');
 const out = join(root, 'qa', 'shots', 'resilience');
 for (const p of [repo, userData, out, bin]) mkdirSync(p, { recursive: true });
 // Exercise ConPTY without depending on a logged-in provider or starting another agent.
-for (const name of ['claude', 'codex', 'antigravity']) writeFileSync(join(bin, name + '.cmd'), '@echo off\r\necho DEVDECK_QA_PTY_READY\r\n');
+for (const name of ['claude', 'codex', 'antigravity']) writeFileSync(join(bin, name + '.cmd'), '@echo off\r\necho DEVDECK_QA_HISTORY_START\r\nfor /L %%i in (1,1,1500) do @echo History line %%i\r\necho DEVDECK_QA_PTY_READY\r\n');
 execFileSync('git', ['init', '-q', '-b', 'qa-fixture'], { cwd: repo });
 const stateFile = join(userData, 'state.json');
 writeFileSync(stateFile, JSON.stringify({ projects: {}, settings: { language: 'en', viewMode: 'cards', folders: [{ path: repo, kind: 'repo' }] } }));
@@ -127,6 +127,27 @@ try {
     await win.click('#cards .provider-open-primary');
     await win.waitForFunction(() => [...document.querySelectorAll('.ck-term')].some((e) => e.textContent.includes('DEVDECK_QA_PTY_READY')));
     assert.equal(await win.locator('.ck-term.show').count(), 1);
+    await win.locator('.ck-term.show .xterm-helper-textarea').press('Control+f');
+    await win.fill('.ck-find-input', 'DEVDECK_QA_HISTORY_START');
+    await win.waitForFunction(() => document.querySelector('.ck-term.show .xterm-rows')?.textContent.includes('DEVDECK_QA_HISTORY_START'));
+    await win.locator('.ck-find-input').press('Escape');
+    await win.screenshot({ path: join(out, 'terminal-history.png') });
+    // Navigate from a scrolled long view, then focus/search the terminal and resize the window.
+    // Measure the top as well as bottom: fitting inside a tile alone misses an off-screen tile.
+    await view('settings');
+    await win.evaluate(() => { document.getElementById('content').scrollTop = 600; });
+    await win.locator('#shell-session-groups .shell-session').first().click();
+    for (const size of [[800, 600], [1280, 800]]) {
+      await app.evaluate(({ BrowserWindow }, size) => BrowserWindow.getAllWindows()[0].setSize(...size), size);
+      await win.waitForFunction(() => {
+        const content = document.getElementById('content').getBoundingClientRect();
+        const header = document.getElementById('ck-header').getBoundingClientRect();
+        const tile = document.querySelector('.ck-term.show').getBoundingClientRect();
+        const screen = document.querySelector('.ck-term.show .xterm-screen').getBoundingClientRect();
+        return header.top >= content.top && tile.top >= header.bottom && screen.top >= tile.top
+          && screen.bottom <= content.bottom && screen.right <= content.right;
+      });
+    }
     await view('projects');
   });
 
@@ -158,18 +179,43 @@ try {
   await check('machine switch immediately removes old actionable rows; A → B → A ignores old success', async () => {
     await win.click('#refresh'); await pending('local-projects');
     await win.selectOption('#machine-switch', 'qa-remote'); await pending('remote-projects');
+    assert.match(await win.locator('#project-load-status').innerText(), /Loading projects from QA Remote/);
+    assert.equal(await win.locator('#cards').getAttribute('aria-busy'), 'true');
+    await win.waitForFunction(() => document.querySelector('#project-load-status')?.textContent.includes('longer than usual'), { }, { timeout: 12_000 });
+    await win.screenshot({ path: join(out, 'slow-machine-loading.png') });
     assert.equal(await win.locator('#cards .card').count(), 0);
     assert.equal(await win.locator('#shell-projects .shell-project').count(), 0);
     await win.selectOption('#machine-switch', 'local'); await pending('local-projects', 2);
+    assert.match(await win.locator('#project-load-status').innerText(), /Loading projects from This PC/);
+    // An obsolete answer must not clear the current machine's loading indication.
+    await answer('remote-projects', { fail: true });
+    assert.equal(await win.locator('#cards').getAttribute('aria-busy'), 'true');
     await answer('local-projects', { index: 1, name: 'Newest local' });
     await win.waitForFunction(() => document.querySelector('#cards')?.textContent.includes('Newest local'));
     await answer('local-projects', { name: 'Obsolete local' });
-    await answer('remote-projects', { fail: true });
+    assert.equal(await win.locator('#project-load-status').isVisible(), false);
+    assert.equal(await win.locator('#cards').getAttribute('aria-busy'), 'false');
     assert.ok((await win.locator('#cards').innerText()).includes('Newest local'));
     assert.ok(!(await win.locator('#cards').innerText()).includes('Obsolete local'));
     assert.equal(await win.locator('#cards .load-error').count(), 0);
   });
 
+  await check('failed machine load ends the busy state and retry shows progress through success', async () => {
+    await win.selectOption('#machine-switch', 'qa-remote');
+    await answer('remote-projects', { fail: true });
+    await win.waitForSelector('#cards .load-error-retry');
+    assert.equal(await win.locator('#project-load-status').isVisible(), false);
+    assert.equal(await win.locator('#cards').getAttribute('aria-busy'), 'false');
+    await win.click('#cards .load-error-retry');
+    await pending('remote-projects');
+    assert.equal(await win.locator('#project-load-status').isVisible(), true);
+    await answer('remote-projects', { name: 'Recovered remote' });
+    await win.waitForFunction(() => document.querySelector('#cards')?.textContent.includes('Recovered remote'));
+    assert.equal(await win.locator('#project-load-status').isVisible(), false);
+    await win.selectOption('#machine-switch', 'local');
+    await answer('local-projects', { name: 'Returned local' });
+  });
+
   await check('task board ignores both obsolete success and obsolete failure after repeated navigation', async () => {
     await view('next'); await pending('local-projects');
     await view('projects'); await view('next'); await pending('local-projects', 2);

qa/resilience.mjs

@@ -122,7 +122,7 @@ describe('what a machine can say about its own sessions', () => {
     host.create('s', 'pwsh', [], 'C:\repo', 80, 24, () => {}, () => {});
     f.emit('first line\nbuilding…\n');
     f.emit('done\n');
-    expect(host.buffer('s').data).toContain('done');
+    expect(host.buffer('s').data).toBe('first line\nbuilding…\ndone\n');
   });
 
   it('drops the OLDEST output when the buffer fills — the recent part is what matters', () => {
@@ -146,6 +146,21 @@ describe('what a machine can say about its own sessions', () => {
     expect(host.buffer('s')).toEqual({ data: expect.stringContaining('hello'), cols: 120, rows: 40 });
   });
 
+  it('does not replay a truncated escape prefix until a complete line boundary exists', () => {
+    const f = fake();
+    const host = new PtyHost(() => f.proc);
+    host.create('s', 'pwsh', [], 'C:/repo', 80, 24, () => {}, () => {});
+    f.emit('x'.repeat(300_000));
+    expect(host.buffer('s').data).toBe('');
+    f.emit('\x1b[Hfull screen repaint');
+    expect(host.buffer('s').data).toBe('\x1b[Hfull screen repaint');
+    f.emit('\ncomplete line\n');
+    expect(host.buffer('s').data).toBe('complete line\n');
+    host.resize('s', 100, 30);
+    f.emit('\x1b[Hfirst repaint row\nsecond row\n');
+    expect(host.buffer('s').data).toBe('\x1b[Hfirst repaint row\nsecond row\n');
+  });
+
   it('forgets output drawn at the old size when the size changes', () => {
     // The bug this exists for: ConPTY paints by absolute cursor address, computed for the width it
     // had at the time. Handing a viewer bytes drawn at 120 columns to replay into an 80-column

src/main/ptyHost.test.ts

@@ -83,6 +83,8 @@ interface Session {
   /** Chunks, oldest first, trimmed from the front once the total passes the cap. */
   chunks: string[];
   bufferedLength: number;
+  /** Only a truncated prefix needs discarding through the next complete line. */
+  prefixTruncated: boolean;
 }
 
 export class PtyHost {
@@ -118,6 +120,7 @@ export class PtyHost {
       internal: info?.internal === true,
       chunks: [],
       bufferedLength: 0,
+      prefixTruncated: false,
     };
     this.sessions.set(id, session);
     proc.onData((data) => { this.remember(session, data); onData(data); });
@@ -134,12 +137,14 @@ export class PtyHost {
     session.bufferedLength += data.length;
     while (session.bufferedLength > SCROLLBACK_BYTES && session.chunks.length > 1) {
       session.bufferedLength -= session.chunks.shift()!.length;
+      session.prefixTruncated = true;
     }
     // A single chunk larger than the cap still has to shrink, and it is cut from the FRONT so the most
     // recent output — the part a viewer actually needs to see — is what survives.
     if (session.bufferedLength > SCROLLBACK_BYTES && session.chunks.length === 1) {
       session.chunks[0] = session.chunks[0].slice(-SCROLLBACK_BYTES);
       session.bufferedLength = session.chunks[0].length;
+      session.prefixTruncated = true;
     }
   }
 
@@ -171,15 +176,19 @@ export class PtyHost {
   /**
    * Recent output, for repainting a terminal that is being attached to mid-flight.
    *
-   * Trimmed to the first line boundary: the cut point is arbitrary, and starting a replay in the
-   * middle of an escape sequence makes xterm render the tail of it as literal text.
+   * Only a buffer that exceeded the cap is trimmed to a safe boundary. Discarding a first line from
+   * an intact buffer loses real output (and the cursor-positioning prefix of a ConPTY repaint).
    */
   buffer(id: string): PtyScreen {
     const session = this.sessions.get(id);
     if (!session) return { data: '', cols: 0, rows: 0 };
     const joined = session.chunks.join('');
     const firstBreak = joined.indexOf('\n');
-    const data = firstBreak >= 0 && firstBreak < joined.length - 1 ? joined.slice(firstBreak + 1) : joined;
+    // Full-screen TUIs can repaint using cursor addresses without any newline. Resume at an escape
+    // boundary in that case, instead of returning a blank screen for the rest of their lifetime.
+    const firstEscape = joined.indexOf('\x1b');
+    const data = !session.prefixTruncated ? joined : firstBreak >= 0 ? joined.slice(firstBreak + 1)
+      : firstEscape >= 0 ? joined.slice(firstEscape) : '';
     return { data, cols: session.cols, rows: session.rows };
   }
 
@@ -205,6 +214,7 @@ export class PtyHost {
     session.rows = rows;
     session.chunks = [];
     session.bufferedLength = 0;
+    session.prefixTruncated = false;
     session.proc.resize(cols, rows);
     return true;
   }

src/main/ptyHost.ts

@@ -652,7 +652,7 @@ async function buildTile(p: OpenReq): Promise<boolean> {
   el.classList.add('show');
   // No cursor blink: it is a repaint twice a second per visible terminal for the life of the app,
   // and the spinner beside the input already says whether the agent is busy.
-  const term = new Terminal({ fontFamily: 'Cascadia Mono, Consolas, monospace', fontSize: 12, theme: { background: '#0a0b0e' }, cursorBlink: false, windowsPty });
+  const term = new Terminal({ fontFamily: 'Cascadia Mono, Consolas, monospace', fontSize: 12, theme: { background: '#0a0b0e' }, cursorBlink: false, scrollback: 10_000, windowsPty });
   const fit = new FitAddon(); term.loadAddon(fit); term.open(el); fit.fit();
   const webgl = attachWebgl(term);
   el.dataset.termRenderer = webgl ? 'webgl' : 'dom'; // which renderer this tile got — read by the perf harness and by anyone debugging a slow machine

src/renderer/cockpitView.ts

@@ -184,3 +184,16 @@
   border-color: var(--dd-accent, var(--dd-border-strong));
   font-weight: 560;
 }
+.project-load-status {
+  display: flex; flex-basis: 100%; align-items: center; gap: 10px; padding: 12px 14px;
+  border: 1px solid var(--border-strong); border-radius: 8px;
+  color: var(--text-dim); background: var(--surface); overflow-wrap: anywhere;
+}
+.project-load-status.hidden { display: none; }
+.project-load-status::before {
+  content: ''; flex: 0 0 14px; width: 14px; height: 14px; border-radius: 50%;
+  border: 2px solid var(--border-strong); border-top-color: var(--accent-hover);
+  animation: project-load-spin .8s linear infinite;
+}
+@keyframes project-load-spin { to { transform: rotate(360deg); } }
+@media (prefers-reduced-motion: reduce) { .project-load-status::before { animation: none; } }