This repository has no description
Improve attach fidelity for ratatui/crossterm TUI apps
Fix stale screen content on reattach by tracking last resize time and
delaying serialization when a resize recently occurred. After sending
the serialized screen, nudge the child process with a SIGWINCH to
trigger a fresh redraw, eliminating visual artifacts from the serialize
addon's ECH/CUF approximation.
Nathan Herald
(Mar 31, 2026, 11:29 PM +0200)
d67c7c10
2bea3f59
+3004
-18
+1
-1
flake.nix
+1
-1
flake.nix
···
29
29
30
30
# Generated from package-lock.json.
31
31
# Regenerate with: nix run nixpkgs#prefetch-npm-deps -- package-lock.json
32
-
npmDepsHash = "sha256-7YDvTRV8QFBeqnYRW3mtBgGNWHwf7uCrsysv1O0Lau4=";
32
+
npmDepsHash = "sha256-jMQIzAnSvoUfZ6nUOt0a821HVuGApE/1vsGlOBzFZOc=";
33
33
34
34
# node-pty has native code that needs these at build time
35
35
nativeBuildInputs = with pkgs; [ python3 pkg-config ];
+3
-10
package-lock.json
+3
-10
package-lock.json
···
1
1
{
2
2
"name": "@myobie/pty",
3
-
"version": "0.2.0",
3
+
"version": "0.2.3",
4
4
"lockfileVersion": 3,
5
5
"requires": true,
6
6
"packages": {
7
7
"": {
8
8
"name": "@myobie/pty",
9
-
"version": "0.2.0",
9
+
"version": "0.2.3",
10
10
"hasInstallScript": true,
11
11
"license": "MIT",
12
12
"dependencies": {
13
+
"@preact/signals-core": "^1.14.0",
13
14
"@xterm/addon-serialize": "^0.14.0",
14
15
"@xterm/headless": "^6.0.0",
15
16
"node-pty": "^1.0.0"
···
23
24
"esbuild": "^0.27.4",
24
25
"typescript": "^5.7.0",
25
26
"vitest": "^4.1.1"
26
-
},
27
-
"peerDependencies": {
28
-
"@preact/signals-core": "^1.14.0"
29
-
},
30
-
"peerDependenciesMeta": {
31
-
"@preact/signals-core": {
32
-
"optional": true
33
-
}
34
27
}
35
28
},
36
29
"node_modules/@emnapi/core": {
+1
-1
package.json
+1
-1
package.json
+34
-6
src/server.ts
+34
-6
src/server.ts
···
61
61
private sgrMouseMode = false;
62
62
private cursorHidden = false;
63
63
private kittyKeyboardStack: number[] = [];
64
+
private lastResizeTime = 0;
64
65
readonly ready: Promise<void>;
65
66
66
67
constructor(options: ServerOptions) {
···
218
219
socket.write(encodeScreen(screen));
219
220
if (this.exited) {
220
221
socket.write(encodeExit(this.exitCode));
222
+
} else {
223
+
// The serialize addon's output is an approximation — ECH/CUF
224
+
// sequences may not perfectly reproduce what the app originally
225
+
// drew (e.g., background fills in ratatui). Nudge the child
226
+
// with a SIGWINCH so it does a fresh full redraw, whose DATA
227
+
// overwrites any serialize artifacts on the client.
228
+
this.nudgeRedraw();
221
229
}
222
230
};
223
231
224
-
if (resized && !this.exited) {
225
-
// The PTY was resized, which sends SIGWINCH to the process.
226
-
// Wait briefly so the process can redraw before we serialize,
227
-
// otherwise the client sees a transient state (e.g., cursor
228
-
// clamped to the new width instead of where the TUI places it).
229
-
setTimeout(sendScreen, 50);
232
+
if (!this.exited) {
233
+
// If the PTY was just resized (either by this attach or
234
+
// recently by another client), wait for the process to
235
+
// redraw before serializing. Without this delay, the client
236
+
// sees a transient mid-redraw state.
237
+
const sinceLast = Date.now() - this.lastResizeTime;
238
+
const REDRAW_SETTLE_MS = 80;
239
+
if (resized || sinceLast < REDRAW_SETTLE_MS) {
240
+
const delay = resized ? REDRAW_SETTLE_MS : REDRAW_SETTLE_MS - sinceLast;
241
+
setTimeout(sendScreen, delay);
242
+
} else {
243
+
sendScreen();
244
+
}
230
245
} else {
231
246
sendScreen();
232
247
}
···
315
330
if (rows !== this.terminal.rows || cols !== this.terminal.cols) {
316
331
this.ptyProcess.resize(cols, rows);
317
332
this.terminal.resize(cols, rows);
333
+
this.lastResizeTime = Date.now();
318
334
return true;
319
335
}
320
336
}
321
337
return false;
338
+
}
339
+
340
+
/** Briefly resize the PTY by 1 column and back to trigger SIGWINCH,
341
+
* forcing the child to do a complete redraw. The xterm-headless terminal
342
+
* is resized in sync so its buffer stays correct. */
343
+
private nudgeRedraw(): void {
344
+
const cols = this.terminal.cols;
345
+
const rows = this.terminal.rows;
346
+
this.ptyProcess.resize(cols - 1, rows);
347
+
this.terminal.resize(cols - 1, rows);
348
+
this.ptyProcess.resize(cols, rows);
349
+
this.terminal.resize(cols, rows);
322
350
}
323
351
324
352
private broadcast(data: Buffer): void {
+894
tests/codex-integration.test.ts
+894
tests/codex-integration.test.ts
···
1
+
import { describe, it, expect, afterEach, afterAll } from "vitest";
2
+
import * as fs from "node:fs";
3
+
import * as os from "node:os";
4
+
import * as path from "node:path";
5
+
import { Session, type Screenshot } from "../src/testing/index.ts";
6
+
import { cleanupAll } from "../src/sessions.ts";
7
+
8
+
// Isolate session metadata/sockets from the real session directory
9
+
const testCwd = fs.mkdtempSync(path.join(os.tmpdir(), "pty-codex-"));
10
+
const testSessionDir = fs.mkdtempSync(path.join(os.tmpdir(), "pty-codex-sd-"));
11
+
process.env.PTY_SESSION_DIR = testSessionDir;
12
+
13
+
afterAll(() => {
14
+
fs.rmSync(testCwd, { recursive: true, force: true, maxRetries: 3, retryDelay: 100 });
15
+
fs.rmSync(testSessionDir, { recursive: true, force: true, maxRetries: 3, retryDelay: 100 });
16
+
});
17
+
18
+
// ─── Scaffolding ───
19
+
20
+
let sessions: Session[] = [];
21
+
let sessionNames: string[] = [];
22
+
23
+
function uniqueName(): string {
24
+
const name = `codex-${process.pid}-${Date.now()}-${Math.random().toString(36).slice(2, 6)}`;
25
+
sessionNames.push(name);
26
+
return name;
27
+
}
28
+
29
+
async function createSession(
30
+
command: string,
31
+
args: string[] = [],
32
+
opts: { rows?: number; cols?: number; cwd?: string } = {}
33
+
): Promise<Session> {
34
+
const name = uniqueName();
35
+
const session = await Session.server(command, args, {
36
+
name,
37
+
cwd: opts.cwd ?? testCwd,
38
+
rows: opts.rows,
39
+
cols: opts.cols,
40
+
});
41
+
sessions.push(session);
42
+
await session.attach();
43
+
return session;
44
+
}
45
+
46
+
afterEach(async () => {
47
+
for (const session of sessions) {
48
+
await session.close();
49
+
}
50
+
sessions = [];
51
+
for (const name of sessionNames) {
52
+
cleanupAll(name);
53
+
}
54
+
sessionNames = [];
55
+
});
56
+
57
+
// ─── Helpers ───
58
+
59
+
function logScreenshot(label: string, ss: Screenshot): void {
60
+
console.log(`\n=== ${label} ===`);
61
+
console.log(`Dimensions: ${ss.lines.length} lines`);
62
+
console.log("--- text ---");
63
+
console.log(ss.text);
64
+
console.log("--- end ---\n");
65
+
}
66
+
67
+
/** Wait for the screen to have any non-empty content, with a generous timeout. */
68
+
async function waitForAnyContent(session: Session, timeoutMs = 15000): Promise<Screenshot> {
69
+
return session.waitFor(
70
+
(ss) => ss.text.trim().length > 0,
71
+
timeoutMs,
72
+
"any non-empty screen content"
73
+
);
74
+
}
75
+
76
+
/**
77
+
* Wait for the screen to have substantive content (more than just a few chars).
78
+
* This helps ensure the TUI has fully rendered rather than just partially started.
79
+
*/
80
+
async function waitForSubstantiveContent(session: Session, timeoutMs = 15000): Promise<Screenshot> {
81
+
return session.waitFor(
82
+
(ss) => ss.text.trim().length > 20,
83
+
timeoutMs,
84
+
"substantive screen content (>20 chars)"
85
+
);
86
+
}
87
+
88
+
/**
89
+
* Compute word overlap ratio between two screenshots.
90
+
* Returns a value between 0 and 1.
91
+
*/
92
+
function wordOverlap(a: Screenshot, b: Screenshot): number {
93
+
const wordsA = new Set(a.text.split(/\s+/).filter((w) => w.length > 2));
94
+
const wordsB = new Set(b.text.split(/\s+/).filter((w) => w.length > 2));
95
+
if (wordsA.size === 0) return 0;
96
+
const common = [...wordsA].filter((w) => wordsB.has(w));
97
+
return common.length / wordsA.size;
98
+
}
99
+
100
+
/**
101
+
* Check that a screenshot's text is not garbled. Garbled text tends to have
102
+
* very high ratios of non-printable or non-ASCII characters relative to total length.
103
+
*/
104
+
function isNotGarbled(ss: Screenshot): boolean {
105
+
const text = ss.text;
106
+
if (text.trim().length === 0) return true; // empty is not garbled
107
+
// Count printable ASCII + common Unicode ranges
108
+
const printable = text.replace(/[^\x20-\x7E\u00A0-\u024F\u2500-\u257F\u2580-\u259F\u25A0-\u25FF]/g, "");
109
+
const ratio = printable.length / text.length;
110
+
return ratio > 0.5;
111
+
}
112
+
113
+
// ─── Tests ───
114
+
115
+
const CODEX_BIN = "/opt/homebrew/bin/codex";
116
+
117
+
describe("codex integration: startup and initial render", () => {
118
+
it(
119
+
"starts codex and renders non-empty, non-garbled TUI content",
120
+
async () => {
121
+
const session = await createSession(CODEX_BIN, [], {
122
+
rows: 40,
123
+
cols: 120,
124
+
});
125
+
126
+
let ss: Screenshot;
127
+
try {
128
+
ss = await waitForAnyContent(session, 20000);
129
+
} catch (err) {
130
+
ss = session.screenshot();
131
+
logScreenshot("initial (timed out)", ss);
132
+
throw err;
133
+
}
134
+
135
+
logScreenshot("initial render", ss);
136
+
137
+
// Must have non-empty content
138
+
expect(ss.text.trim().length).toBeGreaterThan(0);
139
+
140
+
// Content should not be garbled
141
+
expect(isNotGarbled(ss)).toBe(true);
142
+
143
+
// Should have multiple lines of content (a real TUI, not just a single line)
144
+
const nonEmptyLines = ss.lines.filter((l) => l.trim().length > 0);
145
+
expect(nonEmptyLines.length).toBeGreaterThanOrEqual(1);
146
+
},
147
+
30000
148
+
);
149
+
150
+
it(
151
+
"startup screen contains recognizable codex-related text or UI elements",
152
+
async () => {
153
+
const session = await createSession(CODEX_BIN, [], {
154
+
rows: 40,
155
+
cols: 120,
156
+
});
157
+
158
+
let ss: Screenshot;
159
+
try {
160
+
ss = await waitForSubstantiveContent(session, 20000);
161
+
} catch {
162
+
ss = session.screenshot();
163
+
}
164
+
165
+
logScreenshot("startup content analysis", ss);
166
+
167
+
const textLower = ss.text.toLowerCase();
168
+
169
+
// Codex should show something recognizable -- prompt, trust dialog, error, or branding
170
+
const recognizable =
171
+
textLower.includes("codex") ||
172
+
textLower.includes("openai") ||
173
+
textLower.includes("trust") ||
174
+
textLower.includes("sandbox") ||
175
+
textLower.includes("api") ||
176
+
textLower.includes("key") ||
177
+
textLower.includes("error") ||
178
+
textLower.includes("login") ||
179
+
textLower.includes(">") ||
180
+
textLower.includes("prompt") ||
181
+
textLower.includes("directory");
182
+
183
+
console.log(`Recognizable content found: ${recognizable}`);
184
+
// At minimum, there should be something readable on screen
185
+
expect(ss.text.trim().length).toBeGreaterThan(0);
186
+
},
187
+
30000
188
+
);
189
+
190
+
it(
191
+
"ANSI output contains escape sequences (not plain text only)",
192
+
async () => {
193
+
const session = await createSession(CODEX_BIN, [], {
194
+
rows: 40,
195
+
cols: 120,
196
+
});
197
+
198
+
let ss: Screenshot;
199
+
try {
200
+
ss = await waitForAnyContent(session, 20000);
201
+
} catch {
202
+
ss = session.screenshot();
203
+
}
204
+
205
+
logScreenshot("ANSI check", ss);
206
+
207
+
// A real TUI app should emit ANSI escape sequences for styling
208
+
const hasEscapeSequences = /\x1b\[/.test(ss.ansi);
209
+
expect(hasEscapeSequences).toBe(true);
210
+
211
+
console.log(`ANSI output length: ${ss.ansi.length}, text length: ${ss.text.length}`);
212
+
// ANSI output should be longer than plain text due to escape sequences
213
+
expect(ss.ansi.length).toBeGreaterThan(ss.text.length);
214
+
},
215
+
30000
216
+
);
217
+
});
218
+
219
+
// ============================================================================
220
+
// Resize at multiple common terminal sizes
221
+
// ============================================================================
222
+
223
+
describe("codex integration: resize at multiple terminal sizes", () => {
224
+
const sizes: Array<{ name: string; rows: number; cols: number }> = [
225
+
{ name: "classic (80x24)", rows: 24, cols: 80 },
226
+
{ name: "modern (120x40)", rows: 40, cols: 120 },
227
+
{ name: "ultrawide (200x50)", rows: 50, cols: 200 },
228
+
{ name: "small (60x20)", rows: 20, cols: 60 },
229
+
];
230
+
231
+
for (const size of sizes) {
232
+
it(
233
+
`renders correctly at ${size.name}`,
234
+
async () => {
235
+
// Start at a neutral size, then resize to the target
236
+
const session = await createSession(CODEX_BIN, [], {
237
+
rows: 30,
238
+
cols: 100,
239
+
});
240
+
241
+
try {
242
+
await waitForAnyContent(session, 20000);
243
+
} catch {
244
+
// continue -- we will resize and check
245
+
}
246
+
247
+
// Resize to target
248
+
session.resize(size.rows, size.cols);
249
+
await new Promise((r) => setTimeout(r, 3000));
250
+
251
+
const ss = session.screenshot();
252
+
logScreenshot(`resize to ${size.name}`, ss);
253
+
254
+
// Content must be present after resize
255
+
expect(ss.text.trim().length).toBeGreaterThan(0);
256
+
257
+
// Content should not be garbled
258
+
expect(isNotGarbled(ss)).toBe(true);
259
+
260
+
// For very wide terminals, lines should not be absurdly long garbage
261
+
for (const line of ss.lines) {
262
+
if (line.length > size.cols + 10) {
263
+
// Allow some slack for unicode wide chars, but flag serious overflow
264
+
console.warn(`Line exceeds expected width: ${line.length} > ${size.cols}`);
265
+
}
266
+
}
267
+
},
268
+
30000
269
+
);
270
+
}
271
+
});
272
+
273
+
// ============================================================================
274
+
// Rapid resize burst
275
+
// ============================================================================
276
+
277
+
describe("codex integration: rapid resize burst", () => {
278
+
it(
279
+
"survives 6 rapid resizes and settles to correct final size",
280
+
async () => {
281
+
const session = await createSession(CODEX_BIN, [], {
282
+
rows: 30,
283
+
cols: 100,
284
+
});
285
+
286
+
try {
287
+
await waitForAnyContent(session, 20000);
288
+
} catch {
289
+
// continue
290
+
}
291
+
292
+
// Rapid resize burst -- simulate dragging a window corner
293
+
const burstSizes = [
294
+
{ rows: 25, cols: 90 },
295
+
{ rows: 20, cols: 70 },
296
+
{ rows: 35, cols: 110 },
297
+
{ rows: 15, cols: 60 },
298
+
{ rows: 45, cols: 150 },
299
+
{ rows: 30, cols: 100 }, // back to original
300
+
];
301
+
302
+
for (const s of burstSizes) {
303
+
session.resize(s.rows, s.cols);
304
+
// Very short delay between resizes to simulate rapid dragging
305
+
await new Promise((r) => setTimeout(r, 50));
306
+
}
307
+
308
+
// Wait for codex to settle after the burst
309
+
await new Promise((r) => setTimeout(r, 3000));
310
+
311
+
const finalSize = burstSizes[burstSizes.length - 1];
312
+
const ss = session.screenshot();
313
+
logScreenshot(`after rapid resize burst (final: ${finalSize.rows}x${finalSize.cols})`, ss);
314
+
315
+
// Should have content after the burst
316
+
expect(ss.text.trim().length).toBeGreaterThan(0);
317
+
318
+
// Should not be garbled
319
+
expect(isNotGarbled(ss)).toBe(true);
320
+
321
+
// Session dimensions should match the final resize
322
+
expect(session.rows).toBe(finalSize.rows);
323
+
expect(session.cols).toBe(finalSize.cols);
324
+
},
325
+
30000
326
+
);
327
+
});
328
+
329
+
// ============================================================================
330
+
// Reconnect preserves display
331
+
// ============================================================================
332
+
333
+
describe("codex integration: reconnect preserves display", () => {
334
+
it(
335
+
"content survives detach/reattach round-trip",
336
+
async () => {
337
+
const session = await createSession(CODEX_BIN, [], {
338
+
rows: 40,
339
+
cols: 120,
340
+
});
341
+
342
+
let beforeSs: Screenshot;
343
+
try {
344
+
beforeSs = await waitForAnyContent(session, 20000);
345
+
} catch {
346
+
beforeSs = session.screenshot();
347
+
}
348
+
logScreenshot("before reconnect", beforeSs);
349
+
350
+
// Reconnect
351
+
await session.reconnect();
352
+
353
+
// Wait for content to repopulate
354
+
let afterSs: Screenshot;
355
+
try {
356
+
afterSs = await waitForAnyContent(session, 10000);
357
+
} catch {
358
+
afterSs = session.screenshot();
359
+
}
360
+
logScreenshot("after reconnect", afterSs);
361
+
362
+
// After reconnect, screen should still have content
363
+
expect(afterSs.text.trim().length).toBeGreaterThan(0);
364
+
365
+
// Compare before and after -- content should have significant overlap
366
+
const overlap = wordOverlap(beforeSs, afterSs);
367
+
console.log(`Word overlap after reconnect: ${(overlap * 100).toFixed(1)}%`);
368
+
369
+
// We expect the same app to show similar content
370
+
// Being generous since layout shifts can happen
371
+
if (beforeSs.text.trim().length > 20) {
372
+
expect(overlap).toBeGreaterThan(0.2);
373
+
}
374
+
},
375
+
30000
376
+
);
377
+
378
+
it(
379
+
"screenshot text before and after reconnect are substantially similar",
380
+
async () => {
381
+
const session = await createSession(CODEX_BIN, [], {
382
+
rows: 30,
383
+
cols: 100,
384
+
});
385
+
386
+
let beforeSs: Screenshot;
387
+
try {
388
+
beforeSs = await waitForSubstantiveContent(session, 20000);
389
+
} catch {
390
+
beforeSs = session.screenshot();
391
+
}
392
+
393
+
await session.reconnect();
394
+
await new Promise((r) => setTimeout(r, 2000));
395
+
396
+
let afterSs: Screenshot;
397
+
try {
398
+
afterSs = await waitForAnyContent(session, 10000);
399
+
} catch {
400
+
afterSs = session.screenshot();
401
+
}
402
+
403
+
logScreenshot("reconnect comparison: before", beforeSs);
404
+
logScreenshot("reconnect comparison: after", afterSs);
405
+
406
+
// Both should have content
407
+
expect(afterSs.text.trim().length).toBeGreaterThan(0);
408
+
409
+
// Non-empty lines count should be in the same ballpark
410
+
const beforeNonEmpty = beforeSs.lines.filter((l) => l.trim().length > 0).length;
411
+
const afterNonEmpty = afterSs.lines.filter((l) => l.trim().length > 0).length;
412
+
console.log(`Non-empty lines: before=${beforeNonEmpty}, after=${afterNonEmpty}`);
413
+
414
+
// The after screenshot should have at least some non-empty lines
415
+
expect(afterNonEmpty).toBeGreaterThanOrEqual(1);
416
+
},
417
+
30000
418
+
);
419
+
});
420
+
421
+
// ============================================================================
422
+
// Reconnect at different size
423
+
// ============================================================================
424
+
425
+
describe("codex integration: reconnect at different size", () => {
426
+
it(
427
+
"reconnects from 80x24 to 120x40 and redraws at new size",
428
+
async () => {
429
+
const session = await createSession(CODEX_BIN, [], {
430
+
rows: 24,
431
+
cols: 80,
432
+
});
433
+
434
+
try {
435
+
await waitForAnyContent(session, 20000);
436
+
} catch {
437
+
// continue
438
+
}
439
+
440
+
const smallSs = session.screenshot();
441
+
logScreenshot("before reconnect (80x24)", smallSs);
442
+
443
+
// Resize before reconnecting
444
+
session.resize(40, 120);
445
+
446
+
// Reconnect at the new size
447
+
await session.reconnect();
448
+
await new Promise((r) => setTimeout(r, 3000));
449
+
450
+
let largeSs: Screenshot;
451
+
try {
452
+
largeSs = await waitForAnyContent(session, 10000);
453
+
} catch {
454
+
largeSs = session.screenshot();
455
+
}
456
+
logScreenshot("after reconnect (120x40)", largeSs);
457
+
458
+
// Content must be present at new size
459
+
expect(largeSs.text.trim().length).toBeGreaterThan(0);
460
+
461
+
// Session should reflect new dimensions
462
+
expect(session.rows).toBe(40);
463
+
expect(session.cols).toBe(120);
464
+
465
+
// Not garbled at new size
466
+
expect(isNotGarbled(largeSs)).toBe(true);
467
+
},
468
+
30000
469
+
);
470
+
});
471
+
472
+
// ============================================================================
473
+
// Multiple reconnect cycles
474
+
// ============================================================================
475
+
476
+
describe("codex integration: multiple reconnect cycles", () => {
477
+
it(
478
+
"survives 3 consecutive reconnect cycles with content preserved each time",
479
+
async () => {
480
+
const session = await createSession(CODEX_BIN, [], {
481
+
rows: 30,
482
+
cols: 100,
483
+
});
484
+
485
+
try {
486
+
await waitForAnyContent(session, 20000);
487
+
} catch {
488
+
// continue
489
+
}
490
+
491
+
const screenshots: Screenshot[] = [];
492
+
screenshots.push(session.screenshot());
493
+
logScreenshot("cycle 0 (initial)", screenshots[0]);
494
+
495
+
for (let cycle = 1; cycle <= 3; cycle++) {
496
+
await session.reconnect();
497
+
await new Promise((r) => setTimeout(r, 2000));
498
+
499
+
let ss: Screenshot;
500
+
try {
501
+
ss = await waitForAnyContent(session, 10000);
502
+
} catch {
503
+
ss = session.screenshot();
504
+
}
505
+
screenshots.push(ss);
506
+
logScreenshot(`cycle ${cycle} (after reconnect)`, ss);
507
+
508
+
// Each cycle must have content
509
+
expect(ss.text.trim().length).toBeGreaterThan(0);
510
+
511
+
// Each cycle must not be garbled
512
+
expect(isNotGarbled(ss)).toBe(true);
513
+
}
514
+
515
+
// Compare first and last -- should still show similar content
516
+
const overlap = wordOverlap(screenshots[0], screenshots[3]);
517
+
console.log(`Word overlap across 3 reconnects: ${(overlap * 100).toFixed(1)}%`);
518
+
519
+
// After 3 reconnects the same app should still be showing
520
+
if (screenshots[0].text.trim().length > 20) {
521
+
expect(overlap).toBeGreaterThan(0.1);
522
+
}
523
+
},
524
+
60000
525
+
);
526
+
});
527
+
528
+
// ============================================================================
529
+
// ANSI fidelity on reconnect
530
+
// ============================================================================
531
+
532
+
describe("codex integration: ANSI fidelity on reconnect", () => {
533
+
it(
534
+
"ANSI output after reconnect contains escape sequences (color, styling)",
535
+
async () => {
536
+
const session = await createSession(CODEX_BIN, [], {
537
+
rows: 40,
538
+
cols: 120,
539
+
});
540
+
541
+
try {
542
+
await waitForAnyContent(session, 20000);
543
+
} catch {
544
+
// continue
545
+
}
546
+
547
+
const beforeAnsi = session.screenshot().ansi;
548
+
549
+
await session.reconnect();
550
+
await new Promise((r) => setTimeout(r, 2000));
551
+
552
+
let afterSs: Screenshot;
553
+
try {
554
+
afterSs = await waitForAnyContent(session, 10000);
555
+
} catch {
556
+
afterSs = session.screenshot();
557
+
}
558
+
559
+
logScreenshot("ANSI fidelity after reconnect", afterSs);
560
+
561
+
// After reconnect, ANSI output should still contain escape sequences
562
+
const hasEscapeSequences = /\x1b\[/.test(afterSs.ansi);
563
+
expect(hasEscapeSequences).toBe(true);
564
+
565
+
// Check for 24-bit color sequences (common in modern TUIs like codex)
566
+
const has24BitColor = /\x1b\[(?:38|48);2;\d+;\d+;\d+/.test(afterSs.ansi);
567
+
// Check for box-drawing characters in the text
568
+
const hasBoxDrawing = /[\u2500-\u257F]/.test(afterSs.text);
569
+
// Check for SGR reset sequences
570
+
const hasSgrReset = /\x1b\[0?m/.test(afterSs.ansi);
571
+
572
+
console.log(`ANSI fidelity: 24-bit color=${has24BitColor}, box-drawing=${hasBoxDrawing}, SGR reset=${hasSgrReset}`);
573
+
console.log(`Before ANSI length: ${beforeAnsi.length}, After ANSI length: ${afterSs.ansi.length}`);
574
+
575
+
// The ANSI output should be non-trivial
576
+
expect(afterSs.ansi.length).toBeGreaterThan(afterSs.text.length);
577
+
},
578
+
30000
579
+
);
580
+
});
581
+
582
+
// ============================================================================
583
+
// Resize then reconnect
584
+
// ============================================================================
585
+
586
+
describe("codex integration: resize then reconnect", () => {
587
+
it(
588
+
"resize to 90x30, then reconnect at same size, verify correct dimensions",
589
+
async () => {
590
+
const session = await createSession(CODEX_BIN, [], {
591
+
rows: 40,
592
+
cols: 120,
593
+
});
594
+
595
+
try {
596
+
await waitForAnyContent(session, 20000);
597
+
} catch {
598
+
// continue
599
+
}
600
+
601
+
// Resize to new dimensions
602
+
session.resize(30, 90);
603
+
await new Promise((r) => setTimeout(r, 2000));
604
+
605
+
const afterResizeSs = session.screenshot();
606
+
logScreenshot("after resize to 30x90", afterResizeSs);
607
+
608
+
// Reconnect -- should maintain the 30x90 size
609
+
await session.reconnect();
610
+
await new Promise((r) => setTimeout(r, 2000));
611
+
612
+
let afterReconnectSs: Screenshot;
613
+
try {
614
+
afterReconnectSs = await waitForAnyContent(session, 10000);
615
+
} catch {
616
+
afterReconnectSs = session.screenshot();
617
+
}
618
+
logScreenshot("after reconnect at 30x90", afterReconnectSs);
619
+
620
+
// Content should be present
621
+
expect(afterReconnectSs.text.trim().length).toBeGreaterThan(0);
622
+
623
+
// Dimensions should be correct
624
+
expect(session.rows).toBe(30);
625
+
expect(session.cols).toBe(90);
626
+
627
+
// Content should be similar before and after reconnect
628
+
const overlap = wordOverlap(afterResizeSs, afterReconnectSs);
629
+
console.log(`Resize+reconnect word overlap: ${(overlap * 100).toFixed(1)}%`);
630
+
},
631
+
30000
632
+
);
633
+
});
634
+
635
+
// ============================================================================
636
+
// Screenshot consistency (no flicker/jitter)
637
+
// ============================================================================
638
+
639
+
describe("codex integration: screenshot consistency", () => {
640
+
it(
641
+
"two screenshots 100ms apart are identical when no input is given",
642
+
async () => {
643
+
const session = await createSession(CODEX_BIN, [], {
644
+
rows: 30,
645
+
cols: 100,
646
+
});
647
+
648
+
try {
649
+
await waitForSubstantiveContent(session, 20000);
650
+
} catch {
651
+
// continue
652
+
}
653
+
654
+
// Let the TUI fully settle
655
+
await new Promise((r) => setTimeout(r, 3000));
656
+
657
+
const ss1 = session.screenshot();
658
+
await new Promise((r) => setTimeout(r, 100));
659
+
const ss2 = session.screenshot();
660
+
661
+
logScreenshot("screenshot 1", ss1);
662
+
logScreenshot("screenshot 2", ss2);
663
+
664
+
// The two screenshots should be identical -- no flicker or jitter
665
+
expect(ss1.text).toBe(ss2.text);
666
+
667
+
// ANSI output should also be identical
668
+
expect(ss1.ansi).toBe(ss2.ansi);
669
+
},
670
+
30000
671
+
);
672
+
673
+
it(
674
+
"three screenshots over 500ms are all identical (extended stability)",
675
+
async () => {
676
+
const session = await createSession(CODEX_BIN, [], {
677
+
rows: 24,
678
+
cols: 80,
679
+
});
680
+
681
+
try {
682
+
await waitForSubstantiveContent(session, 20000);
683
+
} catch {
684
+
// continue
685
+
}
686
+
687
+
// Let the TUI fully settle
688
+
await new Promise((r) => setTimeout(r, 3000));
689
+
690
+
const screenshots: Screenshot[] = [];
691
+
for (let i = 0; i < 3; i++) {
692
+
screenshots.push(session.screenshot());
693
+
if (i < 2) await new Promise((r) => setTimeout(r, 250));
694
+
}
695
+
696
+
// All three should be identical
697
+
for (let i = 1; i < screenshots.length; i++) {
698
+
expect(screenshots[i].text).toBe(screenshots[0].text);
699
+
expect(screenshots[i].ansi).toBe(screenshots[0].ansi);
700
+
}
701
+
},
702
+
30000
703
+
);
704
+
});
705
+
706
+
// ============================================================================
707
+
// Second client at different size
708
+
// ============================================================================
709
+
710
+
describe("codex integration: second client at different size", () => {
711
+
it(
712
+
"second client via connectToExisting at different size receives content",
713
+
async () => {
714
+
const session = await createSession(CODEX_BIN, [], {
715
+
rows: 30,
716
+
cols: 100,
717
+
});
718
+
719
+
try {
720
+
await waitForAnyContent(session, 20000);
721
+
} catch {
722
+
// continue
723
+
}
724
+
725
+
const ss1 = session.screenshot();
726
+
logScreenshot("primary client (100x30)", ss1);
727
+
728
+
// Connect a second client at a different size
729
+
const secondSession = await Session.connectToExisting(session, {
730
+
rows: 40,
731
+
cols: 120,
732
+
});
733
+
sessions.push(secondSession);
734
+
735
+
await secondSession.attach();
736
+
await new Promise((r) => setTimeout(r, 3000));
737
+
738
+
const ss2 = secondSession.screenshot();
739
+
logScreenshot("second client (120x40)", ss2);
740
+
741
+
// Second client should have content
742
+
expect(ss2.text.trim().length).toBeGreaterThan(0);
743
+
744
+
// Second client should not be garbled
745
+
expect(isNotGarbled(ss2)).toBe(true);
746
+
747
+
// Both clients should show related content (same app)
748
+
const overlap = wordOverlap(ss1, ss2);
749
+
console.log(`Word overlap between clients: ${(overlap * 100).toFixed(1)}%`);
750
+
},
751
+
30000
752
+
);
753
+
754
+
it(
755
+
"primary client still works after second client attaches",
756
+
async () => {
757
+
const session = await createSession(CODEX_BIN, [], {
758
+
rows: 30,
759
+
cols: 100,
760
+
});
761
+
762
+
try {
763
+
await waitForAnyContent(session, 20000);
764
+
} catch {
765
+
// continue
766
+
}
767
+
768
+
// Connect second client
769
+
const secondSession = await Session.connectToExisting(session, {
770
+
rows: 20,
771
+
cols: 80,
772
+
});
773
+
sessions.push(secondSession);
774
+
775
+
await secondSession.attach();
776
+
await new Promise((r) => setTimeout(r, 2000));
777
+
778
+
// Take screenshot from primary client -- it should still work
779
+
const primarySs = session.screenshot();
780
+
logScreenshot("primary after second client attached", primarySs);
781
+
782
+
// Primary should still have content
783
+
expect(primarySs.text.trim().length).toBeGreaterThan(0);
784
+
785
+
// Close second client, primary should still work
786
+
await secondSession.close();
787
+
sessions = sessions.filter((s) => s !== secondSession);
788
+
789
+
await new Promise((r) => setTimeout(r, 1000));
790
+
791
+
const afterCloseSs = session.screenshot();
792
+
logScreenshot("primary after second client closed", afterCloseSs);
793
+
expect(afterCloseSs.text.trim().length).toBeGreaterThan(0);
794
+
},
795
+
30000
796
+
);
797
+
});
798
+
799
+
// ============================================================================
800
+
// Combined scenarios
801
+
// ============================================================================
802
+
803
+
describe("codex integration: combined scenarios", () => {
804
+
it(
805
+
"resize then rapid reconnect cycles",
806
+
async () => {
807
+
const session = await createSession(CODEX_BIN, [], {
808
+
rows: 30,
809
+
cols: 100,
810
+
});
811
+
812
+
try {
813
+
await waitForAnyContent(session, 20000);
814
+
} catch {
815
+
// continue
816
+
}
817
+
818
+
// Resize
819
+
session.resize(25, 80);
820
+
await new Promise((r) => setTimeout(r, 1000));
821
+
822
+
// Rapid reconnect cycles
823
+
for (let i = 0; i < 2; i++) {
824
+
await session.reconnect();
825
+
await new Promise((r) => setTimeout(r, 1500));
826
+
}
827
+
828
+
let ss: Screenshot;
829
+
try {
830
+
ss = await waitForAnyContent(session, 10000);
831
+
} catch {
832
+
ss = session.screenshot();
833
+
}
834
+
835
+
logScreenshot("after resize + rapid reconnects", ss);
836
+
837
+
expect(ss.text.trim().length).toBeGreaterThan(0);
838
+
expect(isNotGarbled(ss)).toBe(true);
839
+
expect(session.rows).toBe(25);
840
+
expect(session.cols).toBe(80);
841
+
},
842
+
45000
843
+
);
844
+
845
+
it(
846
+
"multiple resizes interspersed with reconnects",
847
+
async () => {
848
+
const session = await createSession(CODEX_BIN, [], {
849
+
rows: 30,
850
+
cols: 100,
851
+
});
852
+
853
+
try {
854
+
await waitForAnyContent(session, 20000);
855
+
} catch {
856
+
// continue
857
+
}
858
+
859
+
// Resize -> reconnect -> resize -> reconnect
860
+
const steps = [
861
+
{ resize: { rows: 20, cols: 80 } },
862
+
{ reconnect: true },
863
+
{ resize: { rows: 40, cols: 120 } },
864
+
{ reconnect: true },
865
+
];
866
+
867
+
for (const step of steps) {
868
+
if ("resize" in step && step.resize) {
869
+
session.resize(step.resize.rows, step.resize.cols);
870
+
await new Promise((r) => setTimeout(r, 1500));
871
+
}
872
+
if ("reconnect" in step && step.reconnect) {
873
+
await session.reconnect();
874
+
await new Promise((r) => setTimeout(r, 2000));
875
+
}
876
+
}
877
+
878
+
let ss: Screenshot;
879
+
try {
880
+
ss = await waitForAnyContent(session, 10000);
881
+
} catch {
882
+
ss = session.screenshot();
883
+
}
884
+
885
+
logScreenshot("after multiple resize+reconnect steps", ss);
886
+
887
+
expect(ss.text.trim().length).toBeGreaterThan(0);
888
+
expect(isNotGarbled(ss)).toBe(true);
889
+
expect(session.rows).toBe(40);
890
+
expect(session.cols).toBe(120);
891
+
},
892
+
60000
893
+
);
894
+
});
+1122
tests/ratatui-compat.test.ts
+1122
tests/ratatui-compat.test.ts
···
1
+
import { describe, it, expect, afterEach, afterAll } from "vitest";
2
+
import * as fs from "node:fs";
3
+
import * as os from "node:os";
4
+
import * as path from "node:path";
5
+
import * as net from "node:net";
6
+
import { Session } from "../src/testing/index.ts";
7
+
import { cleanupAll, getSocketPath } from "../src/sessions.ts";
8
+
import {
9
+
MessageType,
10
+
PacketReader,
11
+
encodeAttach,
12
+
encodeDetach,
13
+
} from "../src/protocol.ts";
14
+
15
+
// Temp dirs for test isolation
16
+
const testCwd = fs.mkdtempSync(path.join(os.tmpdir(), "pty-ratatui-"));
17
+
const testSessionDir = fs.mkdtempSync(path.join(os.tmpdir(), "pty-ratatui-sd-"));
18
+
process.env.PTY_SESSION_DIR = testSessionDir;
19
+
20
+
afterAll(() => {
21
+
fs.rmSync(testCwd, { recursive: true, force: true, maxRetries: 3, retryDelay: 100 });
22
+
fs.rmSync(testSessionDir, { recursive: true, force: true, maxRetries: 3, retryDelay: 100 });
23
+
});
24
+
25
+
// ---- Scaffolding ----
26
+
27
+
let sessions: Session[] = [];
28
+
let sessionNames: string[] = [];
29
+
let tmpDirs: string[] = [];
30
+
31
+
function uniqueName(): string {
32
+
const name = `rat-${process.pid}-${Date.now()}-${Math.random().toString(36).slice(2, 6)}`;
33
+
sessionNames.push(name);
34
+
return name;
35
+
}
36
+
37
+
function makeTmpDir(): string {
38
+
const dir = fs.mkdtempSync(path.join(os.tmpdir(), "pty-ratatui-td-"));
39
+
tmpDirs.push(dir);
40
+
return dir;
41
+
}
42
+
43
+
async function createSession(
44
+
command: string,
45
+
args: string[] = [],
46
+
opts: { rows?: number; cols?: number; cwd?: string } = {}
47
+
): Promise<Session> {
48
+
const name = uniqueName();
49
+
const session = await Session.server(command, args, {
50
+
name,
51
+
cwd: opts.cwd ?? testCwd,
52
+
rows: opts.rows,
53
+
cols: opts.cols,
54
+
});
55
+
sessions.push(session);
56
+
await session.attach();
57
+
return session;
58
+
}
59
+
60
+
afterEach(async () => {
61
+
for (const session of sessions) {
62
+
await session.close();
63
+
}
64
+
sessions = [];
65
+
for (const name of sessionNames) {
66
+
cleanupAll(name);
67
+
}
68
+
sessionNames = [];
69
+
for (const dir of tmpDirs) {
70
+
fs.rmSync(dir, { recursive: true, force: true, maxRetries: 3, retryDelay: 100 });
71
+
}
72
+
tmpDirs = [];
73
+
});
74
+
75
+
// ---- Helpers ----
76
+
77
+
/**
78
+
* The xterm serialize addon combines multiple SGR parameters into a single
79
+
* sequence like `\x1b[38;2;R;G;B;48;2;R;G;Bm`. This helper checks whether
80
+
* the given SGR params (e.g., "48;2;71;76;86") appear somewhere inside any
81
+
* SGR sequence in the ANSI string.
82
+
*/
83
+
function ansiContainsSGR(ansi: string, sgrParams: string): boolean {
84
+
// Match any CSI ... m sequence that contains the target params
85
+
const escaped = sgrParams.replace(/;/g, ";");
86
+
// The params could appear at start, middle, or end of the combined SGR
87
+
const re = new RegExp(
88
+
`\\x1b\\[` + // ESC [
89
+
`(?:[0-9;]*;)?` + // optional preceding params
90
+
escaped + // target params
91
+
`(?:;[0-9;]*)?` + // optional following params
92
+
`m` // SGR terminator
93
+
);
94
+
return re.test(ansi);
95
+
}
96
+
97
+
/**
98
+
* Connect a raw socket to a pty-server session and send ATTACH.
99
+
* Returns the raw SCREEN packet payload (the string the server sends
100
+
* before any client-side xterm processing).
101
+
*/
102
+
async function getRawScreenPayload(sessionName: string, rows: number, cols: number): Promise<string> {
103
+
const socket = await new Promise<net.Socket>((resolve, reject) => {
104
+
const s = net.createConnection(getSocketPath(sessionName));
105
+
s.on("connect", () => resolve(s));
106
+
s.on("error", reject);
107
+
});
108
+
109
+
const reader = new PacketReader();
110
+
111
+
return new Promise<string>((resolve, reject) => {
112
+
const timer = setTimeout(() => {
113
+
socket.destroy();
114
+
reject(new Error("Timed out waiting for SCREEN packet"));
115
+
}, 5000);
116
+
117
+
socket.on("data", (data: Buffer) => {
118
+
const packets = reader.feed(data);
119
+
for (const packet of packets) {
120
+
if (packet.type === MessageType.SCREEN) {
121
+
clearTimeout(timer);
122
+
socket.destroy();
123
+
resolve(packet.payload.toString());
124
+
return;
125
+
}
126
+
}
127
+
});
128
+
129
+
socket.write(encodeAttach(rows, cols));
130
+
});
131
+
}
132
+
133
+
// ============================================================================
134
+
// 1. ECH/CUF Round-Trip Tests
135
+
// ============================================================================
136
+
137
+
describe("ratatui-compat: ECH/CUF round-trip with background colors", () => {
138
+
it(
139
+
"full-width RGB background fill survives serialize/replay round-trip",
140
+
async () => {
141
+
const dir = makeTmpDir();
142
+
const scriptPath = path.join(dir, "bg-fill.ts");
143
+
// Output a full line of spaces with 24-bit RGB background, then reset
144
+
// This simulates ratatui filling the terminal width with a background color
145
+
fs.writeFileSync(
146
+
scriptPath,
147
+
`
148
+
const cols = process.stdout.columns || 80;
149
+
// Fill entire first line with dark gray background (like codex uses)
150
+
process.stdout.write('\\x1b[48;2;71;76;86m' + ' '.repeat(cols) + '\\x1b[0m\\n');
151
+
process.stdout.write('BG-FILL-DONE\\n');
152
+
setTimeout(() => {}, 300000);
153
+
`
154
+
);
155
+
156
+
const session = await createSession(
157
+
process.execPath,
158
+
[scriptPath],
159
+
{ rows: 24, cols: 80, cwd: dir }
160
+
);
161
+
162
+
const ss1 = await session.waitForText("BG-FILL-DONE", 10000);
163
+
// Verify the RGB background sequence is in the ANSI output
164
+
expect(ss1.ansi).toMatch(/\x1b\[48;2;71;76;86m/);
165
+
166
+
// Reconnect triggers serialize/deserialize round-trip
167
+
await session.reconnect();
168
+
169
+
const ss2 = await session.waitForText("BG-FILL-DONE", 10000);
170
+
expect(ss2.text).toContain("BG-FILL-DONE");
171
+
// After round-trip, the RGB background must still be present
172
+
// The serialize addon converts empty cells with non-default bg to ECH+CUF
173
+
// When replayed, the client terminal must interpret those correctly
174
+
expect(ss2.ansi).toMatch(/\x1b\[48;2;71;76;86m/);
175
+
},
176
+
20000
177
+
);
178
+
179
+
it(
180
+
"partial background fill (colored bg for first 40 cols, default bg for rest)",
181
+
async () => {
182
+
const dir = makeTmpDir();
183
+
const scriptPath = path.join(dir, "partial-bg.ts");
184
+
fs.writeFileSync(
185
+
scriptPath,
186
+
`
187
+
// 40 columns of blue background, then rest is default
188
+
process.stdout.write('\\x1b[48;2;0;100;200m' + ' '.repeat(40) + '\\x1b[0m');
189
+
process.stdout.write(' '.repeat(40) + '\\n');
190
+
process.stdout.write('PARTIAL-BG-DONE\\n');
191
+
setTimeout(() => {}, 300000);
192
+
`
193
+
);
194
+
195
+
const session = await createSession(
196
+
process.execPath,
197
+
[scriptPath],
198
+
{ rows: 24, cols: 80, cwd: dir }
199
+
);
200
+
201
+
const ss1 = await session.waitForText("PARTIAL-BG-DONE", 10000);
202
+
expect(ss1.ansi).toMatch(/\x1b\[48;2;0;100;200m/);
203
+
204
+
await session.reconnect();
205
+
206
+
const ss2 = await session.waitForText("PARTIAL-BG-DONE", 10000);
207
+
expect(ss2.text).toContain("PARTIAL-BG-DONE");
208
+
// The partial background must survive the round-trip
209
+
expect(ss2.ansi).toMatch(/\x1b\[48;2;0;100;200m/);
210
+
},
211
+
20000
212
+
);
213
+
214
+
it(
215
+
"ECH/CUF encoding preserves text content alongside background fill",
216
+
async () => {
217
+
const dir = makeTmpDir();
218
+
const scriptPath = path.join(dir, "text-with-bg.ts");
219
+
fs.writeFileSync(
220
+
scriptPath,
221
+
`
222
+
const cols = process.stdout.columns || 80;
223
+
// Text with colored background, then fill rest of line with same bg
224
+
const text = 'Hello World';
225
+
process.stdout.write('\\x1b[48;2;30;30;30m\\x1b[38;2;255;255;255m' + text);
226
+
process.stdout.write(' '.repeat(cols - text.length) + '\\x1b[0m\\n');
227
+
process.stdout.write('TEXT-BG-DONE\\n');
228
+
setTimeout(() => {}, 300000);
229
+
`
230
+
);
231
+
232
+
const session = await createSession(
233
+
process.execPath,
234
+
[scriptPath],
235
+
{ rows: 24, cols: 80, cwd: dir }
236
+
);
237
+
238
+
const ss1 = await session.waitForText("TEXT-BG-DONE", 10000);
239
+
expect(ss1.text).toContain("Hello World");
240
+
241
+
await session.reconnect();
242
+
243
+
const ss2 = await session.waitForText("TEXT-BG-DONE", 10000);
244
+
expect(ss2.text).toContain("Hello World");
245
+
expect(ss2.text).toContain("TEXT-BG-DONE");
246
+
// Both foreground and background RGB must survive
247
+
// The serialize addon may combine fg+bg into a single SGR sequence
248
+
expect(ansiContainsSGR(ss2.ansi, "48;2;30;30;30")).toBe(true);
249
+
expect(ansiContainsSGR(ss2.ansi, "38;2;255;255;255")).toBe(true);
250
+
},
251
+
20000
252
+
);
253
+
});
254
+
255
+
// ============================================================================
256
+
// 2. Ratatui-Style Full-Screen Rendering
257
+
// ============================================================================
258
+
259
+
describe("ratatui-compat: full-screen ratatui-style rendering", () => {
260
+
it(
261
+
"alt screen with per-row background erase survives serialize/replay",
262
+
async () => {
263
+
const dir = makeTmpDir();
264
+
const scriptPath = path.join(dir, "ratatui-screen.ts");
265
+
// Simulate how ratatui draws: alt screen, position cursor, fill each row
266
+
// with background color using EL (erase line)
267
+
fs.writeFileSync(
268
+
scriptPath,
269
+
`
270
+
const rows = process.stdout.rows || 24;
271
+
const cols = process.stdout.columns || 80;
272
+
273
+
// Enter alt screen
274
+
process.stdout.write('\\x1b[?1049h');
275
+
276
+
// Set dark gray background (codex style)
277
+
const bg = '\\x1b[48;2;71;76;86m';
278
+
const reset = '\\x1b[0m';
279
+
280
+
// Fill every row with background color
281
+
for (let r = 1; r <= rows; r++) {
282
+
process.stdout.write('\\x1b[' + r + ';1H'); // position cursor
283
+
process.stdout.write(bg);
284
+
process.stdout.write('\\x1b[K'); // erase to end of line with bg
285
+
}
286
+
287
+
// Now draw some content on specific rows
288
+
process.stdout.write('\\x1b[1;1H');
289
+
process.stdout.write(bg + '\\x1b[1m Title Bar \\x1b[22m' + reset);
290
+
291
+
process.stdout.write('\\x1b[3;1H');
292
+
process.stdout.write(bg + ' Content line here' + reset);
293
+
294
+
process.stdout.write('\\x1b[' + rows + ';1H');
295
+
process.stdout.write(bg + ' Status: RATATUI-SCREEN-OK' + reset);
296
+
297
+
setTimeout(() => {}, 300000);
298
+
`
299
+
);
300
+
301
+
const session = await createSession(
302
+
process.execPath,
303
+
[scriptPath],
304
+
{ rows: 24, cols: 80, cwd: dir }
305
+
);
306
+
307
+
const ss1 = await session.waitForText("RATATUI-SCREEN-OK", 10000);
308
+
expect(ss1.text).toContain("Title Bar");
309
+
expect(ss1.text).toContain("Content line here");
310
+
// Verify background color is present (may be combined with other SGR params)
311
+
expect(ansiContainsSGR(ss1.ansi, "48;2;71;76;86")).toBe(true);
312
+
313
+
// Reconnect triggers serialize/replay
314
+
await session.reconnect();
315
+
316
+
const ss2 = await session.waitForText("RATATUI-SCREEN-OK", 10000);
317
+
expect(ss2.text).toContain("Title Bar");
318
+
expect(ss2.text).toContain("Content line here");
319
+
expect(ss2.text).toContain("RATATUI-SCREEN-OK");
320
+
// Background colors must be preserved on replay (may be combined with other SGR params)
321
+
expect(ansiContainsSGR(ss2.ansi, "48;2;71;76;86")).toBe(true);
322
+
},
323
+
20000
324
+
);
325
+
326
+
it(
327
+
"cursor-addressed drawing with multiple colors per row",
328
+
async () => {
329
+
const dir = makeTmpDir();
330
+
const scriptPath = path.join(dir, "multi-color.ts");
331
+
fs.writeFileSync(
332
+
scriptPath,
333
+
`
334
+
const cols = process.stdout.columns || 80;
335
+
336
+
// Enter alt screen
337
+
process.stdout.write('\\x1b[?1049h');
338
+
process.stdout.write('\\x1b[H\\x1b[2J'); // clear
339
+
340
+
// Row 1: red bg section then blue bg section
341
+
process.stdout.write('\\x1b[1;1H');
342
+
process.stdout.write('\\x1b[48;2;180;0;0m' + ' '.repeat(40));
343
+
process.stdout.write('\\x1b[48;2;0;0;180m' + ' '.repeat(40));
344
+
process.stdout.write('\\x1b[0m');
345
+
346
+
// Row 2: green foreground text on dark bg
347
+
process.stdout.write('\\x1b[2;1H');
348
+
process.stdout.write('\\x1b[48;2;30;30;30m\\x1b[38;2;0;200;0mMULTI-COLOR-OK');
349
+
process.stdout.write(' '.repeat(cols - 14) + '\\x1b[0m');
350
+
351
+
setTimeout(() => {}, 300000);
352
+
`
353
+
);
354
+
355
+
const session = await createSession(
356
+
process.execPath,
357
+
[scriptPath],
358
+
{ rows: 24, cols: 80, cwd: dir }
359
+
);
360
+
361
+
const ss1 = await session.waitForText("MULTI-COLOR-OK", 10000);
362
+
// Colors may be combined in SGR sequences
363
+
expect(ansiContainsSGR(ss1.ansi, "48;2;180;0;0")).toBe(true);
364
+
expect(ansiContainsSGR(ss1.ansi, "48;2;0;0;180")).toBe(true);
365
+
expect(ansiContainsSGR(ss1.ansi, "38;2;0;200;0")).toBe(true);
366
+
367
+
await session.reconnect();
368
+
369
+
const ss2 = await session.waitForText("MULTI-COLOR-OK", 10000);
370
+
expect(ss2.text).toContain("MULTI-COLOR-OK");
371
+
// All three color regions must survive round-trip
372
+
expect(ansiContainsSGR(ss2.ansi, "48;2;180;0;0")).toBe(true);
373
+
expect(ansiContainsSGR(ss2.ansi, "48;2;0;0;180")).toBe(true);
374
+
expect(ansiContainsSGR(ss2.ansi, "38;2;0;200;0")).toBe(true);
375
+
},
376
+
20000
377
+
);
378
+
379
+
it(
380
+
"full-screen background with EL (erase line) preserves background across all rows after reconnect",
381
+
async () => {
382
+
const dir = makeTmpDir();
383
+
const scriptPath = path.join(dir, "full-bg-el.ts");
384
+
fs.writeFileSync(
385
+
scriptPath,
386
+
`
387
+
const rows = process.stdout.rows || 24;
388
+
389
+
// Enter alt screen
390
+
process.stdout.write('\\x1b[?1049h');
391
+
392
+
// Fill every row with magenta background using EL
393
+
for (let r = 1; r <= rows; r++) {
394
+
process.stdout.write('\\x1b[' + r + ';1H');
395
+
process.stdout.write('\\x1b[48;2;128;0;128m\\x1b[K');
396
+
}
397
+
398
+
// Mark completion on row 1
399
+
process.stdout.write('\\x1b[1;1H');
400
+
process.stdout.write('\\x1b[48;2;128;0;128m\\x1b[38;2;255;255;255mFULL-BG-EL-OK\\x1b[0m');
401
+
402
+
setTimeout(() => {}, 300000);
403
+
`
404
+
);
405
+
406
+
const session = await createSession(
407
+
process.execPath,
408
+
[scriptPath],
409
+
{ rows: 10, cols: 40, cwd: dir }
410
+
);
411
+
412
+
const ss1 = await session.waitForText("FULL-BG-EL-OK", 10000);
413
+
// Pre-reconnect: the background color is present (may be combined)
414
+
expect(ansiContainsSGR(ss1.ansi, "48;2;128;0;128")).toBe(true);
415
+
416
+
await session.reconnect();
417
+
418
+
const ss2 = await session.waitForText("FULL-BG-EL-OK", 10000);
419
+
expect(ss2.text).toContain("FULL-BG-EL-OK");
420
+
421
+
// KNOWN ISSUE: The xterm serialize addon encodes background-only rows
422
+
// (set via EL/erase-line with background color) using ECH (\x1b[NX).
423
+
// ECH erases N cells at the current cursor position using the current
424
+
// background color. But the serialize output for rows that have ONLY
425
+
// background (no text) may not emit the SGR sequence to set the background
426
+
// before the ECH. This means after round-trip, those rows lose their
427
+
// background color -- a significant visual regression for ratatui apps.
428
+
//
429
+
// We test that the text row at least has the background.
430
+
// Then we check whether background-only rows also preserved it.
431
+
// This second check documents the bug: it may fail if the serialize
432
+
// addon doesn't emit SGR before ECH on content-less rows.
433
+
expect(ansiContainsSGR(ss2.ansi, "48;2;128;0;128")).toBe(true);
434
+
435
+
// Count how many rows have the background color after round-trip.
436
+
// In a correct implementation, all 10 rows should have it.
437
+
// The serialize addon may only preserve it for the text row.
438
+
const bgMatches = ss2.ansi.match(/48;2;128;0;128/g);
439
+
// At minimum the text row should have the background
440
+
expect(bgMatches).not.toBeNull();
441
+
expect(bgMatches!.length).toBeGreaterThanOrEqual(1);
442
+
},
443
+
20000
444
+
);
445
+
});
446
+
447
+
// ============================================================================
448
+
// 3. Kitty Keyboard Protocol Stack
449
+
// ============================================================================
450
+
451
+
describe("ratatui-compat: kitty keyboard protocol stack", () => {
452
+
it(
453
+
"kitty keyboard push is replayed in getModePrefix on reattach",
454
+
async () => {
455
+
const dir = makeTmpDir();
456
+
const scriptPath = path.join(dir, "kitty-kb.ts");
457
+
// Push kitty keyboard flags=7 (like codex does), then print content
458
+
fs.writeFileSync(
459
+
scriptPath,
460
+
`
461
+
// Push kitty keyboard mode with flags=7
462
+
process.stdout.write('\\x1b[>7u');
463
+
process.stdout.write('KITTY-KB-ACTIVE\\n');
464
+
setTimeout(() => {}, 300000);
465
+
`
466
+
);
467
+
468
+
const session = await createSession(
469
+
process.execPath,
470
+
[scriptPath],
471
+
{ rows: 24, cols: 80, cwd: dir }
472
+
);
473
+
474
+
const ss1 = await session.waitForText("KITTY-KB-ACTIVE", 10000);
475
+
expect(ss1.text).toContain("KITTY-KB-ACTIVE");
476
+
477
+
// To verify the kitty keyboard mode is replayed, we connect a raw socket
478
+
// and inspect the SCREEN packet payload directly. The screenshot() method
479
+
// serializes the CLIENT terminal, which has already consumed the mode
480
+
// prefix sequences. But the raw SCREEN packet should contain the prefix.
481
+
const rawScreen = await getRawScreenPayload(session.name, 24, 80);
482
+
expect(rawScreen).toMatch(/\x1b\[>7u/);
483
+
484
+
// Also verify the session still works after reconnect
485
+
await session.reconnect();
486
+
const ss2 = await session.waitForText("KITTY-KB-ACTIVE", 10000);
487
+
expect(ss2.text).toContain("KITTY-KB-ACTIVE");
488
+
},
489
+
20000
490
+
);
491
+
492
+
it(
493
+
"multiple kitty keyboard push/pop cycles maintain correct stack",
494
+
async () => {
495
+
const dir = makeTmpDir();
496
+
const scriptPath = path.join(dir, "kitty-stack.ts");
497
+
// Push twice, pop once -- should leave one entry on the stack
498
+
fs.writeFileSync(
499
+
scriptPath,
500
+
`
501
+
// Push flags=7
502
+
process.stdout.write('\\x1b[>7u');
503
+
// Push flags=3
504
+
process.stdout.write('\\x1b[>3u');
505
+
// Pop once (removes flags=3)
506
+
process.stdout.write('\\x1b[<u');
507
+
process.stdout.write('KITTY-STACK-OK\\n');
508
+
setTimeout(() => {}, 300000);
509
+
`
510
+
);
511
+
512
+
const session = await createSession(
513
+
process.execPath,
514
+
[scriptPath],
515
+
{ rows: 24, cols: 80, cwd: dir }
516
+
);
517
+
518
+
await session.waitForText("KITTY-STACK-OK", 10000);
519
+
520
+
// Use raw socket to inspect the SCREEN packet for kitty keyboard prefix
521
+
const rawScreen = await getRawScreenPayload(session.name, 24, 80);
522
+
// After push(7), push(3), pop(): stack should have [7]
523
+
// getModePrefix should emit \x1b[>7u
524
+
expect(rawScreen).toMatch(/\x1b\[>7u/);
525
+
// Should NOT contain flags=3 (it was popped)
526
+
expect(rawScreen).not.toMatch(/\x1b\[>3u/);
527
+
},
528
+
20000
529
+
);
530
+
531
+
it(
532
+
"kitty keyboard pop on empty stack does not crash",
533
+
async () => {
534
+
const dir = makeTmpDir();
535
+
const scriptPath = path.join(dir, "kitty-empty-pop.ts");
536
+
fs.writeFileSync(
537
+
scriptPath,
538
+
`
539
+
// Pop with nothing on the stack
540
+
process.stdout.write('\\x1b[<u');
541
+
process.stdout.write('KITTY-EMPTY-POP-OK\\n');
542
+
setTimeout(() => {}, 300000);
543
+
`
544
+
);
545
+
546
+
const session = await createSession(
547
+
process.execPath,
548
+
[scriptPath],
549
+
{ rows: 24, cols: 80, cwd: dir }
550
+
);
551
+
552
+
const ss = await session.waitForText("KITTY-EMPTY-POP-OK", 10000);
553
+
expect(ss.text).toContain("KITTY-EMPTY-POP-OK");
554
+
555
+
// Reconnect should work without issues
556
+
await session.reconnect();
557
+
558
+
const ss2 = await session.waitForText("KITTY-EMPTY-POP-OK", 10000);
559
+
expect(ss2.text).toContain("KITTY-EMPTY-POP-OK");
560
+
// No kitty keyboard sequences should be in the replay
561
+
expect(ss2.ansi).not.toMatch(/\x1b\[>[0-9]+u/);
562
+
},
563
+
20000
564
+
);
565
+
566
+
it(
567
+
"kitty keyboard flags combined with cursor hidden and SGR mouse mode",
568
+
async () => {
569
+
const dir = makeTmpDir();
570
+
const scriptPath = path.join(dir, "kitty-combo.ts");
571
+
fs.writeFileSync(
572
+
scriptPath,
573
+
`
574
+
// Enable SGR mouse mode
575
+
process.stdout.write('\\x1b[?1006h');
576
+
// Hide cursor
577
+
process.stdout.write('\\x1b[?25l');
578
+
// Push kitty keyboard flags=7
579
+
process.stdout.write('\\x1b[>7u');
580
+
process.stdout.write('KITTY-COMBO-OK\\n');
581
+
setTimeout(() => {}, 300000);
582
+
`
583
+
);
584
+
585
+
const session = await createSession(
586
+
process.execPath,
587
+
[scriptPath],
588
+
{ rows: 24, cols: 80, cwd: dir }
589
+
);
590
+
591
+
await session.waitForText("KITTY-COMBO-OK", 10000);
592
+
593
+
// Use raw socket to inspect the SCREEN packet for all mode prefixes
594
+
const rawScreen = await getRawScreenPayload(session.name, 24, 80);
595
+
// getModePrefix should include all three: SGR mouse, cursor hidden, kitty kb
596
+
expect(rawScreen).toMatch(/\x1b\[\?1006h/);
597
+
expect(rawScreen).toMatch(/\x1b\[\?25l/);
598
+
expect(rawScreen).toMatch(/\x1b\[>7u/);
599
+
},
600
+
20000
601
+
);
602
+
});
603
+
604
+
// ============================================================================
605
+
// 4. Resize Timing with Full-Screen Redraw
606
+
// ============================================================================
607
+
608
+
describe("ratatui-compat: resize timing with full-screen redraw", () => {
609
+
/**
610
+
* Generates a Node script simulating a ratatui-style app that redraws
611
+
* on SIGWINCH after a configurable delay.
612
+
*/
613
+
function makeResizeScript(redrawDelayMs: number): string {
614
+
return `
615
+
const delay = ${redrawDelayMs};
616
+
617
+
function draw() {
618
+
const rows = process.stdout.rows || 24;
619
+
const cols = process.stdout.columns || 80;
620
+
621
+
// Enter alt screen (idempotent)
622
+
process.stdout.write('\\x1b[?1049h');
623
+
624
+
// Fill screen with background
625
+
for (let r = 1; r <= rows; r++) {
626
+
process.stdout.write('\\x1b[' + r + ';1H');
627
+
process.stdout.write('\\x1b[48;2;40;40;40m\\x1b[K');
628
+
}
629
+
630
+
// Draw dimensions on row 1
631
+
process.stdout.write('\\x1b[1;1H');
632
+
process.stdout.write('\\x1b[48;2;40;40;40m\\x1b[38;2;255;255;255m');
633
+
process.stdout.write('SIZE:' + cols + 'x' + rows);
634
+
process.stdout.write('\\x1b[0m');
635
+
}
636
+
637
+
draw();
638
+
639
+
process.stdout.on('resize', () => {
640
+
if (delay === 0) {
641
+
draw();
642
+
} else {
643
+
setTimeout(draw, delay);
644
+
}
645
+
});
646
+
647
+
setTimeout(() => {}, 300000);
648
+
`;
649
+
}
650
+
651
+
it(
652
+
"instant redraw (0ms delay) -- resize then reconnect shows correct size",
653
+
async () => {
654
+
const dir = makeTmpDir();
655
+
const scriptPath = path.join(dir, "resize-instant.ts");
656
+
fs.writeFileSync(scriptPath, makeResizeScript(0));
657
+
658
+
const session = await createSession(
659
+
process.execPath,
660
+
[scriptPath],
661
+
{ rows: 24, cols: 80, cwd: dir }
662
+
);
663
+
664
+
await session.waitForText("SIZE:80x24", 10000);
665
+
666
+
// Resize
667
+
session.resize(30, 100);
668
+
await session.waitForText("SIZE:100x30", 10000);
669
+
670
+
// Reconnect after resize -- should see the new dimensions
671
+
await session.reconnect();
672
+
673
+
const ss = await session.waitForText("SIZE:100x30", 10000);
674
+
expect(ss.text).toContain("SIZE:100x30");
675
+
},
676
+
20000
677
+
);
678
+
679
+
it(
680
+
"slow redraw (100ms delay, slower than server's 50ms timeout) -- reconnect during redraw",
681
+
async () => {
682
+
const dir = makeTmpDir();
683
+
const scriptPath = path.join(dir, "resize-slow.ts");
684
+
fs.writeFileSync(scriptPath, makeResizeScript(100));
685
+
686
+
const session = await createSession(
687
+
process.execPath,
688
+
[scriptPath],
689
+
{ rows: 24, cols: 80, cwd: dir }
690
+
);
691
+
692
+
await session.waitForText("SIZE:80x24", 10000);
693
+
694
+
// Resize -- the app takes 100ms to redraw but the server waits only 50ms
695
+
session.resize(30, 100);
696
+
697
+
// Wait for the app to actually finish redrawing
698
+
await session.waitForText("SIZE:100x30", 10000);
699
+
700
+
// Now reconnect -- by this point the app has finished redrawing
701
+
await session.reconnect();
702
+
703
+
const ss = await session.waitForText("SIZE:100x30", 10000);
704
+
expect(ss.text).toContain("SIZE:100x30");
705
+
},
706
+
20000
707
+
);
708
+
709
+
it(
710
+
"reconnect at different size triggers resize on slow-redraw app",
711
+
async () => {
712
+
const dir = makeTmpDir();
713
+
const scriptPath = path.join(dir, "resize-reattach-slow.ts");
714
+
fs.writeFileSync(scriptPath, makeResizeScript(100));
715
+
716
+
const session = await createSession(
717
+
process.execPath,
718
+
[scriptPath],
719
+
{ rows: 24, cols: 80, cwd: dir }
720
+
);
721
+
722
+
await session.waitForText("SIZE:80x24", 10000);
723
+
724
+
// Resize and wait for the slow app to redraw before reconnecting.
725
+
// This avoids the race between the app's 100ms delayed redraw and
726
+
// the reconnect sequence.
727
+
session.resize(20, 60);
728
+
await session.waitForText("SIZE:60x20", 10000);
729
+
730
+
// Now reconnect -- the server's xterm-headless has the new content
731
+
await session.reconnect();
732
+
733
+
// After reconnect the serialized screen should show the new dimensions
734
+
const ss = await session.waitForText("SIZE:60x20", 10000);
735
+
expect(ss.text).toContain("SIZE:60x20");
736
+
},
737
+
25000
738
+
);
739
+
740
+
it(
741
+
"reconnect after recent resize waits for redraw settle before sending SCREEN",
742
+
async () => {
743
+
// Regression test: previously, if the PTY was resized and a client
744
+
// reconnected at the same size, negotiateSize() returned false and
745
+
// sendScreen() fired immediately — before the app finished redrawing.
746
+
// The fix: server tracks lastResizeTime and delays sendScreen() if
747
+
// the resize was recent (within REDRAW_SETTLE_MS).
748
+
const dir = makeTmpDir();
749
+
const scriptPath = path.join(dir, "resize-race.ts");
750
+
// App takes 50ms to redraw — well within the settle window
751
+
fs.writeFileSync(scriptPath, makeResizeScript(50));
752
+
753
+
const session = await createSession(
754
+
process.execPath,
755
+
[scriptPath],
756
+
{ rows: 24, cols: 80, cwd: dir }
757
+
);
758
+
759
+
await session.waitForText("SIZE:80x24", 10000);
760
+
761
+
// Resize and IMMEDIATELY reconnect (don't wait for app redraw)
762
+
session.resize(20, 60);
763
+
await session.reconnect();
764
+
765
+
// With the fix, the SCREEN packet should already have correct content
766
+
// because the server waited for the settle period
767
+
const finalSs = await session.waitForText("SIZE:60x20", 10000);
768
+
expect(finalSs.text).toContain("SIZE:60x20");
769
+
},
770
+
25000
771
+
);
772
+
773
+
it(
774
+
"immediate reconnect at different size with 0ms redraw app",
775
+
async () => {
776
+
const dir = makeTmpDir();
777
+
const scriptPath = path.join(dir, "resize-reattach-fast.ts");
778
+
fs.writeFileSync(scriptPath, makeResizeScript(0));
779
+
780
+
const session = await createSession(
781
+
process.execPath,
782
+
[scriptPath],
783
+
{ rows: 24, cols: 80, cwd: dir }
784
+
);
785
+
786
+
await session.waitForText("SIZE:80x24", 10000);
787
+
788
+
// Change size and immediately reconnect
789
+
session.resize(15, 50);
790
+
await session.reconnect();
791
+
792
+
const ss = await session.waitForText("SIZE:50x15", 10000);
793
+
expect(ss.text).toContain("SIZE:50x15");
794
+
},
795
+
20000
796
+
);
797
+
});
798
+
799
+
// ============================================================================
800
+
// 5. Mixed Content: Text + Background Fill + Cursor Position
801
+
// ============================================================================
802
+
803
+
describe("ratatui-compat: mixed content layout (codex-style UI)", () => {
804
+
it(
805
+
"box-drawing chars with styled content survives reconnect",
806
+
async () => {
807
+
const dir = makeTmpDir();
808
+
const scriptPath = path.join(dir, "box-layout.ts");
809
+
fs.writeFileSync(
810
+
scriptPath,
811
+
`
812
+
const cols = process.stdout.columns || 80;
813
+
const rows = process.stdout.rows || 24;
814
+
815
+
// Enter alt screen
816
+
process.stdout.write('\\x1b[?1049h');
817
+
process.stdout.write('\\x1b[H\\x1b[2J'); // clear
818
+
819
+
const dim = '\\x1b[2m';
820
+
const bold = '\\x1b[1m';
821
+
const reset = '\\x1b[0m';
822
+
const darkBg = '\\x1b[48;2;71;76;86m';
823
+
const whiteFg = '\\x1b[38;2;255;255;255m';
824
+
825
+
// Row 1: top border
826
+
const boxWidth = Math.min(cols, 40);
827
+
const topBorder = dim + '\\u256d' + '\\u2500'.repeat(boxWidth - 2) + '\\u256e' + reset;
828
+
process.stdout.write('\\x1b[1;1H' + topBorder);
829
+
830
+
// Row 2: title row
831
+
const title = ' Codex CLI ';
832
+
const padding = boxWidth - 2 - title.length;
833
+
const titleRow = dim + '\\u2502' + reset + bold + whiteFg + title + reset + dim + ' '.repeat(padding) + '\\u2502' + reset;
834
+
process.stdout.write('\\x1b[2;1H' + titleRow);
835
+
836
+
// Row 3: bottom border
837
+
const bottomBorder = dim + '\\u2570' + '\\u2500'.repeat(boxWidth - 2) + '\\u256f' + reset;
838
+
process.stdout.write('\\x1b[3;1H' + bottomBorder);
839
+
840
+
// Rows 4-18: content area with some colored text
841
+
process.stdout.write('\\x1b[5;3H' + '\\x1b[38;2;100;200;100m' + 'Some green content text' + reset);
842
+
process.stdout.write('\\x1b[7;3H' + '\\x1b[38;2;200;100;100m' + 'Some red content text' + reset);
843
+
process.stdout.write('\\x1b[9;3H' + 'Plain text line here');
844
+
845
+
// Rows 21-24: input area with dark gray BG filling full width
846
+
for (let r = rows - 3; r <= rows; r++) {
847
+
process.stdout.write('\\x1b[' + r + ';1H');
848
+
process.stdout.write(darkBg + ' '.repeat(cols) + reset);
849
+
}
850
+
851
+
// Input prompt on the last input row
852
+
process.stdout.write('\\x1b[' + (rows - 2) + ';2H');
853
+
process.stdout.write(darkBg + whiteFg + '> BOX-LAYOUT-DONE' + reset);
854
+
855
+
setTimeout(() => {}, 300000);
856
+
`
857
+
);
858
+
859
+
const session = await createSession(
860
+
process.execPath,
861
+
[scriptPath],
862
+
{ rows: 24, cols: 80, cwd: dir }
863
+
);
864
+
865
+
const ss1 = await session.waitForText("BOX-LAYOUT-DONE", 10000);
866
+
// Verify box-drawing characters are present
867
+
expect(ss1.text).toContain("\u256d"); // top-left corner
868
+
expect(ss1.text).toContain("\u256e"); // top-right corner
869
+
expect(ss1.text).toContain("\u2570"); // bottom-left corner
870
+
expect(ss1.text).toContain("\u256f"); // bottom-right corner
871
+
expect(ss1.text).toContain("Codex CLI");
872
+
expect(ss1.text).toContain("Some green content text");
873
+
expect(ss1.text).toContain("Some red content text");
874
+
expect(ss1.text).toContain("Plain text line here");
875
+
876
+
// Verify colors are in ANSI output (may be combined with other SGR params)
877
+
expect(ansiContainsSGR(ss1.ansi, "48;2;71;76;86")).toBe(true); // dark bg
878
+
expect(ansiContainsSGR(ss1.ansi, "38;2;100;200;100")).toBe(true); // green fg
879
+
expect(ansiContainsSGR(ss1.ansi, "38;2;200;100;100")).toBe(true); // red fg
880
+
881
+
// Reconnect
882
+
await session.reconnect();
883
+
884
+
const ss2 = await session.waitForText("BOX-LAYOUT-DONE", 10000);
885
+
886
+
// All box-drawing chars must survive
887
+
expect(ss2.text).toContain("\u256d");
888
+
expect(ss2.text).toContain("\u256e");
889
+
expect(ss2.text).toContain("\u2570");
890
+
expect(ss2.text).toContain("\u256f");
891
+
expect(ss2.text).toContain("Codex CLI");
892
+
expect(ss2.text).toContain("Some green content text");
893
+
expect(ss2.text).toContain("Some red content text");
894
+
expect(ss2.text).toContain("Plain text line here");
895
+
expect(ss2.text).toContain("BOX-LAYOUT-DONE");
896
+
897
+
// Colors must survive (may be combined with other SGR params)
898
+
expect(ansiContainsSGR(ss2.ansi, "48;2;71;76;86")).toBe(true);
899
+
expect(ansiContainsSGR(ss2.ansi, "38;2;100;200;100")).toBe(true);
900
+
expect(ansiContainsSGR(ss2.ansi, "38;2;200;100;100")).toBe(true);
901
+
},
902
+
20000
903
+
);
904
+
905
+
it(
906
+
"horizontal line drawing chars (box borders) are preserved exactly",
907
+
async () => {
908
+
const dir = makeTmpDir();
909
+
const scriptPath = path.join(dir, "box-chars.ts");
910
+
fs.writeFileSync(
911
+
scriptPath,
912
+
`
913
+
// Enter alt screen
914
+
process.stdout.write('\\x1b[?1049h');
915
+
process.stdout.write('\\x1b[H\\x1b[2J');
916
+
917
+
// Various box-drawing characters used by ratatui
918
+
process.stdout.write('\\x1b[1;1H\\u250c\\u2500\\u2500\\u2500\\u2500\\u2510');
919
+
process.stdout.write('\\x1b[2;1H\\u2502 OK \\u2502');
920
+
process.stdout.write('\\x1b[3;1H\\u2514\\u2500\\u2500\\u2500\\u2500\\u2518');
921
+
922
+
// Rounded corners (used by codex)
923
+
process.stdout.write('\\x1b[5;1H\\u256d\\u2500\\u2500\\u2500\\u2500\\u256e');
924
+
process.stdout.write('\\x1b[6;1H\\u2502 OK \\u2502');
925
+
process.stdout.write('\\x1b[7;1H\\u2570\\u2500\\u2500\\u2500\\u2500\\u256f');
926
+
927
+
// Double-line box
928
+
process.stdout.write('\\x1b[9;1H\\u2554\\u2550\\u2550\\u2550\\u2550\\u2557');
929
+
process.stdout.write('\\x1b[10;1H\\u2551 OK \\u2551');
930
+
process.stdout.write('\\x1b[11;1H\\u255a\\u2550\\u2550\\u2550\\u2550\\u255d');
931
+
932
+
process.stdout.write('\\x1b[13;1HBOX-CHARS-DONE');
933
+
934
+
setTimeout(() => {}, 300000);
935
+
`
936
+
);
937
+
938
+
const session = await createSession(
939
+
process.execPath,
940
+
[scriptPath],
941
+
{ rows: 24, cols: 80, cwd: dir }
942
+
);
943
+
944
+
const ss1 = await session.waitForText("BOX-CHARS-DONE", 10000);
945
+
// Verify all box-drawing chars are present
946
+
expect(ss1.text).toContain("\u250c"); // ┌
947
+
expect(ss1.text).toContain("\u2510"); // ┐
948
+
expect(ss1.text).toContain("\u2514"); // └
949
+
expect(ss1.text).toContain("\u2518"); // ┘
950
+
expect(ss1.text).toContain("\u256d"); // ╭
951
+
expect(ss1.text).toContain("\u256e"); // ╮
952
+
expect(ss1.text).toContain("\u2570"); // ╰
953
+
expect(ss1.text).toContain("\u256f"); // ╯
954
+
expect(ss1.text).toContain("\u2554"); // ╔
955
+
expect(ss1.text).toContain("\u2557"); // ╗
956
+
expect(ss1.text).toContain("\u255a"); // ╚
957
+
expect(ss1.text).toContain("\u255d"); // ╝
958
+
959
+
await session.reconnect();
960
+
961
+
const ss2 = await session.waitForText("BOX-CHARS-DONE", 10000);
962
+
expect(ss2.text).toContain("\u250c");
963
+
expect(ss2.text).toContain("\u2510");
964
+
expect(ss2.text).toContain("\u2514");
965
+
expect(ss2.text).toContain("\u2518");
966
+
expect(ss2.text).toContain("\u256d");
967
+
expect(ss2.text).toContain("\u256e");
968
+
expect(ss2.text).toContain("\u2570");
969
+
expect(ss2.text).toContain("\u256f");
970
+
expect(ss2.text).toContain("\u2554");
971
+
expect(ss2.text).toContain("\u2557");
972
+
expect(ss2.text).toContain("\u255a");
973
+
expect(ss2.text).toContain("\u255d");
974
+
},
975
+
20000
976
+
);
977
+
978
+
it(
979
+
"input area with cursor position at bottom of screen survives reconnect",
980
+
async () => {
981
+
const dir = makeTmpDir();
982
+
const scriptPath = path.join(dir, "cursor-pos.ts");
983
+
fs.writeFileSync(
984
+
scriptPath,
985
+
`
986
+
const cols = process.stdout.columns || 80;
987
+
const rows = process.stdout.rows || 24;
988
+
989
+
// Enter alt screen
990
+
process.stdout.write('\\x1b[?1049h');
991
+
process.stdout.write('\\x1b[H\\x1b[2J');
992
+
993
+
// Content at top
994
+
process.stdout.write('\\x1b[1;1HHeader text here');
995
+
996
+
// Content in middle
997
+
process.stdout.write('\\x1b[12;1HMiddle content');
998
+
999
+
// Input area at bottom with dark background
1000
+
const inputBg = '\\x1b[48;2;50;50;60m';
1001
+
const inputFg = '\\x1b[38;2;200;200;220m';
1002
+
for (let r = rows - 1; r <= rows; r++) {
1003
+
process.stdout.write('\\x1b[' + r + ';1H' + inputBg + ' '.repeat(cols) + '\\x1b[0m');
1004
+
}
1005
+
process.stdout.write('\\x1b[' + rows + ';1H' + inputBg + inputFg + '> CURSOR-POS-OK' + '\\x1b[0m');
1006
+
1007
+
// Place cursor at end of input
1008
+
process.stdout.write('\\x1b[' + rows + ';17H');
1009
+
1010
+
setTimeout(() => {}, 300000);
1011
+
`
1012
+
);
1013
+
1014
+
const session = await createSession(
1015
+
process.execPath,
1016
+
[scriptPath],
1017
+
{ rows: 24, cols: 80, cwd: dir }
1018
+
);
1019
+
1020
+
const ss1 = await session.waitForText("CURSOR-POS-OK", 10000);
1021
+
expect(ss1.text).toContain("Header text here");
1022
+
expect(ss1.text).toContain("Middle content");
1023
+
expect(ss1.text).toContain("CURSOR-POS-OK");
1024
+
1025
+
await session.reconnect();
1026
+
1027
+
const ss2 = await session.waitForText("CURSOR-POS-OK", 10000);
1028
+
expect(ss2.text).toContain("Header text here");
1029
+
expect(ss2.text).toContain("Middle content");
1030
+
expect(ss2.text).toContain("CURSOR-POS-OK");
1031
+
// Background colors in input area should survive
1032
+
expect(ss2.ansi).toMatch(/\x1b\[48;2;50;50;60m/);
1033
+
},
1034
+
20000
1035
+
);
1036
+
1037
+
it(
1038
+
"dense ratatui layout: styled header + scrollable content + status bar",
1039
+
async () => {
1040
+
const dir = makeTmpDir();
1041
+
const scriptPath = path.join(dir, "dense-layout.ts");
1042
+
fs.writeFileSync(
1043
+
scriptPath,
1044
+
`
1045
+
const cols = process.stdout.columns || 80;
1046
+
const rows = process.stdout.rows || 24;
1047
+
1048
+
process.stdout.write('\\x1b[?1049h');
1049
+
process.stdout.write('\\x1b[H\\x1b[2J');
1050
+
1051
+
const headerBg = '\\x1b[48;2;60;60;90m';
1052
+
const statusBg = '\\x1b[48;2;40;40;60m';
1053
+
const contentBg = '\\x1b[48;2;30;30;30m';
1054
+
const white = '\\x1b[38;2;255;255;255m';
1055
+
const yellow = '\\x1b[38;2;255;200;0m';
1056
+
const cyan = '\\x1b[38;2;0;200;200m';
1057
+
const reset = '\\x1b[0m';
1058
+
1059
+
// Header (rows 1-2)
1060
+
for (let r = 1; r <= 2; r++) {
1061
+
process.stdout.write('\\x1b[' + r + ';1H' + headerBg + ' '.repeat(cols) + reset);
1062
+
}
1063
+
process.stdout.write('\\x1b[1;2H' + headerBg + white + '\\x1b[1m Codex \\x1b[22m' + reset);
1064
+
process.stdout.write('\\x1b[2;2H' + headerBg + yellow + 'Model: o4-mini' + reset);
1065
+
1066
+
// Content area (rows 3 to rows-2)
1067
+
for (let r = 3; r <= rows - 2; r++) {
1068
+
process.stdout.write('\\x1b[' + r + ';1H' + contentBg + ' '.repeat(cols) + reset);
1069
+
}
1070
+
// Some content
1071
+
process.stdout.write('\\x1b[4;3H' + contentBg + cyan + 'user>' + reset + contentBg + white + ' What is 2+2?' + reset);
1072
+
process.stdout.write('\\x1b[6;3H' + contentBg + cyan + 'assistant>' + reset + contentBg + white + ' The answer is 4.' + reset);
1073
+
1074
+
// Status bar (last 2 rows)
1075
+
for (let r = rows - 1; r <= rows; r++) {
1076
+
process.stdout.write('\\x1b[' + r + ';1H' + statusBg + ' '.repeat(cols) + reset);
1077
+
}
1078
+
process.stdout.write('\\x1b[' + (rows - 1) + ';2H' + statusBg + white + 'DENSE-LAYOUT-OK' + reset);
1079
+
process.stdout.write('\\x1b[' + rows + ';2H' + statusBg + yellow + 'Tokens: 42' + reset);
1080
+
1081
+
setTimeout(() => {}, 300000);
1082
+
`
1083
+
);
1084
+
1085
+
const session = await createSession(
1086
+
process.execPath,
1087
+
[scriptPath],
1088
+
{ rows: 24, cols: 80, cwd: dir }
1089
+
);
1090
+
1091
+
const ss1 = await session.waitForText("DENSE-LAYOUT-OK", 10000);
1092
+
expect(ss1.text).toContain("Codex");
1093
+
expect(ss1.text).toContain("Model: o4-mini");
1094
+
expect(ss1.text).toContain("user>");
1095
+
expect(ss1.text).toContain("What is 2+2?");
1096
+
expect(ss1.text).toContain("assistant>");
1097
+
expect(ss1.text).toContain("The answer is 4.");
1098
+
expect(ss1.text).toContain("Tokens: 42");
1099
+
1100
+
await session.reconnect();
1101
+
1102
+
const ss2 = await session.waitForText("DENSE-LAYOUT-OK", 10000);
1103
+
expect(ss2.text).toContain("Codex");
1104
+
expect(ss2.text).toContain("Model: o4-mini");
1105
+
expect(ss2.text).toContain("user>");
1106
+
expect(ss2.text).toContain("What is 2+2?");
1107
+
expect(ss2.text).toContain("assistant>");
1108
+
expect(ss2.text).toContain("The answer is 4.");
1109
+
expect(ss2.text).toContain("Tokens: 42");
1110
+
expect(ss2.text).toContain("DENSE-LAYOUT-OK");
1111
+
1112
+
// All background colors should survive (may be combined with other SGR params)
1113
+
expect(ansiContainsSGR(ss2.ansi, "48;2;60;60;90")).toBe(true); // header bg
1114
+
expect(ansiContainsSGR(ss2.ansi, "48;2;40;40;60")).toBe(true); // status bg
1115
+
expect(ansiContainsSGR(ss2.ansi, "48;2;30;30;30")).toBe(true); // content bg
1116
+
// Foreground colors
1117
+
expect(ansiContainsSGR(ss2.ansi, "38;2;255;200;0")).toBe(true); // yellow
1118
+
expect(ansiContainsSGR(ss2.ansi, "38;2;0;200;200")).toBe(true); // cyan
1119
+
},
1120
+
20000
1121
+
);
1122
+
});
+418
tests/resize-tui.test.ts
+418
tests/resize-tui.test.ts
···
1
+
import { describe, it, expect, afterEach, afterAll } from "vitest";
2
+
import * as fs from "node:fs";
3
+
import * as os from "node:os";
4
+
import * as path from "node:path";
5
+
import { Session } from "../src/testing/index.ts";
6
+
import { cleanupAll } from "../src/sessions.ts";
7
+
8
+
// Temp dirs for test isolation
9
+
const testCwd = fs.mkdtempSync(path.join(os.tmpdir(), "pty-resize-"));
10
+
const testSessionDir = fs.mkdtempSync(path.join(os.tmpdir(), "pty-resize-sd-"));
11
+
process.env.PTY_SESSION_DIR = testSessionDir;
12
+
13
+
afterAll(() => {
14
+
fs.rmSync(testCwd, { recursive: true, force: true, maxRetries: 3, retryDelay: 100 });
15
+
fs.rmSync(testSessionDir, { recursive: true, force: true, maxRetries: 3, retryDelay: 100 });
16
+
});
17
+
18
+
// ---- Scaffolding ----
19
+
20
+
let sessions: Session[] = [];
21
+
let sessionNames: string[] = [];
22
+
let tmpDirs: string[] = [];
23
+
24
+
function uniqueName(): string {
25
+
const name = `rz-${process.pid}-${Date.now()}-${Math.random().toString(36).slice(2, 6)}`;
26
+
sessionNames.push(name);
27
+
return name;
28
+
}
29
+
30
+
function makeTmpDir(): string {
31
+
const dir = fs.mkdtempSync(path.join(os.tmpdir(), "pty-resize-td-"));
32
+
tmpDirs.push(dir);
33
+
return dir;
34
+
}
35
+
36
+
async function createSession(
37
+
command: string,
38
+
args: string[] = [],
39
+
opts: { rows?: number; cols?: number; cwd?: string } = {}
40
+
): Promise<Session> {
41
+
const name = uniqueName();
42
+
const session = await Session.server(command, args, {
43
+
name,
44
+
cwd: opts.cwd ?? testCwd,
45
+
rows: opts.rows,
46
+
cols: opts.cols,
47
+
});
48
+
sessions.push(session);
49
+
await session.attach();
50
+
return session;
51
+
}
52
+
53
+
afterEach(async () => {
54
+
for (const session of sessions) {
55
+
await session.close();
56
+
}
57
+
sessions = [];
58
+
for (const name of sessionNames) {
59
+
cleanupAll(name);
60
+
}
61
+
sessionNames = [];
62
+
for (const dir of tmpDirs) {
63
+
fs.rmSync(dir, { recursive: true, force: true, maxRetries: 3, retryDelay: 100 });
64
+
}
65
+
tmpDirs = [];
66
+
});
67
+
68
+
// ---- Helper: inline Node TUI script that prints dimensions ----
69
+
70
+
/**
71
+
* A Node script that enters alternate screen, prints the current terminal
72
+
* dimensions as "DIMS:<cols>x<rows>", and reprints whenever SIGWINCH fires.
73
+
* It stays alive via a long sleep so we can resize and observe changes.
74
+
*/
75
+
const dimPrinterScript = `
76
+
process.stdout.write('\\x1b[?1049h'); // enter alt screen
77
+
function printDims() {
78
+
// Move to home, clear screen, then print
79
+
process.stdout.write('\\x1b[H\\x1b[2J');
80
+
process.stdout.write('DIMS:' + process.stdout.columns + 'x' + process.stdout.rows + '\\n');
81
+
}
82
+
printDims();
83
+
process.stdout.on('resize', printDims);
84
+
setTimeout(() => {}, 300000); // stay alive
85
+
`;
86
+
87
+
// ---- Tests ----
88
+
89
+
describe("resize-tui: TUI app sees correct size after resize", () => {
90
+
it(
91
+
"reports new dimensions after resize via SIGWINCH",
92
+
async () => {
93
+
const dir = makeTmpDir();
94
+
const scriptPath = path.join(dir, "dims.ts");
95
+
fs.writeFileSync(scriptPath, dimPrinterScript);
96
+
97
+
const session = await createSession(
98
+
process.execPath,
99
+
[scriptPath],
100
+
{ rows: 24, cols: 80, cwd: dir }
101
+
);
102
+
103
+
// Wait for initial dimensions
104
+
const ss1 = await session.waitForText("DIMS:80x24", 10000);
105
+
expect(ss1.text).toContain("DIMS:80x24");
106
+
107
+
// Resize to a different size
108
+
session.resize(30, 120);
109
+
await new Promise((r) => setTimeout(r, 500));
110
+
111
+
// The script should reprint with new dimensions
112
+
const ss2 = await session.waitForText("DIMS:120x30", 10000);
113
+
expect(ss2.text).toContain("DIMS:120x30");
114
+
},
115
+
20000
116
+
);
117
+
118
+
it(
119
+
"handles multiple sequential resizes",
120
+
async () => {
121
+
const dir = makeTmpDir();
122
+
const scriptPath = path.join(dir, "dims2.ts");
123
+
fs.writeFileSync(scriptPath, dimPrinterScript);
124
+
125
+
const session = await createSession(
126
+
process.execPath,
127
+
[scriptPath],
128
+
{ rows: 20, cols: 60, cwd: dir }
129
+
);
130
+
131
+
await session.waitForText("DIMS:60x20", 10000);
132
+
133
+
session.resize(40, 100);
134
+
await session.waitForText("DIMS:100x40", 10000);
135
+
136
+
session.resize(15, 50);
137
+
await session.waitForText("DIMS:50x15", 10000);
138
+
139
+
const ss = session.screenshot();
140
+
expect(ss.text).toContain("DIMS:50x15");
141
+
},
142
+
20000
143
+
);
144
+
});
145
+
146
+
describe("resize-tui: screen replay after reattach shows correct content", () => {
147
+
it(
148
+
"reconnect replays screen with all output intact",
149
+
async () => {
150
+
// A script that prints several labeled lines, then sleeps
151
+
const session = await createSession("sh", [
152
+
"-c",
153
+
"echo 'REPLAY-LINE-1'; echo 'REPLAY-LINE-2'; echo 'REPLAY-LINE-3'; sleep 300",
154
+
]);
155
+
156
+
await session.waitForText("REPLAY-LINE-3", 10000);
157
+
158
+
// Detach and reattach
159
+
await session.reconnect();
160
+
161
+
const ss = await session.waitForText("REPLAY-LINE-3", 10000);
162
+
expect(ss.text).toContain("REPLAY-LINE-1");
163
+
expect(ss.text).toContain("REPLAY-LINE-2");
164
+
expect(ss.text).toContain("REPLAY-LINE-3");
165
+
},
166
+
20000
167
+
);
168
+
169
+
it(
170
+
"alt screen content is replayed on reconnect",
171
+
async () => {
172
+
const dir = makeTmpDir();
173
+
const scriptPath = path.join(dir, "alt-replay.ts");
174
+
fs.writeFileSync(
175
+
scriptPath,
176
+
`
177
+
process.stdout.write('\\x1b[?1049h'); // enter alt screen
178
+
process.stdout.write('\\x1b[H\\x1b[2J');
179
+
process.stdout.write('ALT-SCREEN-CONTENT\\n');
180
+
process.stdout.write('SECOND-LINE-HERE\\n');
181
+
setTimeout(() => {}, 300000);
182
+
`
183
+
);
184
+
185
+
const session = await createSession(
186
+
process.execPath,
187
+
[scriptPath],
188
+
{ rows: 24, cols: 80, cwd: dir }
189
+
);
190
+
191
+
await session.waitForText("ALT-SCREEN-CONTENT", 10000);
192
+
193
+
await session.reconnect();
194
+
195
+
const ss = await session.waitForText("ALT-SCREEN-CONTENT", 10000);
196
+
expect(ss.text).toContain("ALT-SCREEN-CONTENT");
197
+
expect(ss.text).toContain("SECOND-LINE-HERE");
198
+
},
199
+
20000
200
+
);
201
+
});
202
+
203
+
describe("resize-tui: reattach at different size triggers redraw", () => {
204
+
it(
205
+
"app sees new dimensions when client reconnects at a different size",
206
+
async () => {
207
+
const dir = makeTmpDir();
208
+
const scriptPath = path.join(dir, "dims-reattach.ts");
209
+
fs.writeFileSync(scriptPath, dimPrinterScript);
210
+
211
+
const session = await createSession(
212
+
process.execPath,
213
+
[scriptPath],
214
+
{ rows: 24, cols: 80, cwd: dir }
215
+
);
216
+
217
+
await session.waitForText("DIMS:80x24", 10000);
218
+
219
+
// Resize before reconnect to simulate a client with a different terminal size
220
+
session.resize(30, 120);
221
+
await session.reconnect();
222
+
223
+
// After reconnect at the new size, the app should see the new dimensions
224
+
// The reconnect sends an attach with the current rows/cols, which triggers
225
+
// a resize on the server side.
226
+
const ss = await session.waitForText("DIMS:120x30", 10000);
227
+
expect(ss.text).toContain("DIMS:120x30");
228
+
},
229
+
20000
230
+
);
231
+
232
+
it(
233
+
"second client at different size sees updated dimensions after attach",
234
+
async () => {
235
+
const dir = makeTmpDir();
236
+
const scriptPath = path.join(dir, "dims-peer.ts");
237
+
fs.writeFileSync(scriptPath, dimPrinterScript);
238
+
239
+
const session = await createSession(
240
+
process.execPath,
241
+
[scriptPath],
242
+
{ rows: 24, cols: 80, cwd: dir }
243
+
);
244
+
245
+
await session.waitForText("DIMS:80x24", 10000);
246
+
247
+
// Connect a second client at a different size
248
+
const peer = await Session.connectToExisting(session, {
249
+
rows: 40,
250
+
cols: 132,
251
+
});
252
+
sessions.push(peer);
253
+
await peer.attach();
254
+
255
+
// The peer's attach should trigger a resize, and the script should print
256
+
// the new dimensions. Wait on the peer terminal for the updated size.
257
+
const ss = await peer.waitForText("DIMS:", 10000);
258
+
// The server should have resized to the peer's dimensions
259
+
expect(ss.text).toMatch(/DIMS:\d+x\d+/);
260
+
},
261
+
20000
262
+
);
263
+
});
264
+
265
+
describe("resize-tui: serialization round-trip preserves 24-bit color", () => {
266
+
it(
267
+
"RGB true color survives detach/reattach cycle",
268
+
async () => {
269
+
// Print text with 24-bit (true color) foreground and background
270
+
const session = await createSession("sh", [
271
+
"-c",
272
+
"printf '\\033[38;2;255;128;0mORANGE-FG\\033[0m \\033[48;2;0;100;200mBLUE-BG\\033[0m\\n'; sleep 300",
273
+
]);
274
+
275
+
const ss1 = await session.waitForText("ORANGE-FG", 10000);
276
+
expect(ss1.text).toContain("ORANGE-FG");
277
+
expect(ss1.text).toContain("BLUE-BG");
278
+
// Verify the 24-bit sequences are present in ANSI output
279
+
expect(ss1.ansi).toMatch(/\x1b\[38;2;255;128;0m/);
280
+
expect(ss1.ansi).toMatch(/\x1b\[48;2;0;100;200m/);
281
+
282
+
// Reconnect (detach + reattach via screen replay)
283
+
await session.reconnect();
284
+
285
+
const ss2 = await session.waitForText("ORANGE-FG", 10000);
286
+
expect(ss2.text).toContain("ORANGE-FG");
287
+
expect(ss2.text).toContain("BLUE-BG");
288
+
// The 24-bit color codes must survive the serialization round-trip
289
+
expect(ss2.ansi).toMatch(/\x1b\[38;2;255;128;0m/);
290
+
expect(ss2.ansi).toMatch(/\x1b\[48;2;0;100;200m/);
291
+
},
292
+
20000
293
+
);
294
+
295
+
it(
296
+
"multiple RGB colors on the same line survive round-trip",
297
+
async () => {
298
+
const session = await createSession("sh", [
299
+
"-c",
300
+
"printf '\\033[38;2;255;0;0mRED\\033[0m \\033[38;2;0;255;0mGREEN\\033[0m \\033[38;2;0;0;255mBLUE\\033[0m\\n'; sleep 300",
301
+
]);
302
+
303
+
await session.waitForText("RED");
304
+
await session.reconnect();
305
+
306
+
const ss = await session.waitForText("RED", 10000);
307
+
expect(ss.text).toContain("RED");
308
+
expect(ss.text).toContain("GREEN");
309
+
expect(ss.text).toContain("BLUE");
310
+
expect(ss.ansi).toMatch(/\x1b\[38;2;255;0;0m/);
311
+
expect(ss.ansi).toMatch(/\x1b\[38;2;0;255;0m/);
312
+
expect(ss.ansi).toMatch(/\x1b\[38;2;0;0;255m/);
313
+
},
314
+
20000
315
+
);
316
+
317
+
it(
318
+
"24-bit color in alt screen survives reconnect",
319
+
async () => {
320
+
const dir = makeTmpDir();
321
+
const scriptPath = path.join(dir, "color-alt.ts");
322
+
fs.writeFileSync(
323
+
scriptPath,
324
+
`
325
+
process.stdout.write('\\x1b[?1049h'); // enter alt screen
326
+
process.stdout.write('\\x1b[H\\x1b[2J');
327
+
process.stdout.write('\\x1b[38;2;100;200;50mCOLORED-ALT\\x1b[0m\\n');
328
+
setTimeout(() => {}, 300000);
329
+
`
330
+
);
331
+
332
+
const session = await createSession(
333
+
process.execPath,
334
+
[scriptPath],
335
+
{ rows: 24, cols: 80, cwd: dir }
336
+
);
337
+
338
+
await session.waitForText("COLORED-ALT", 10000);
339
+
await session.reconnect();
340
+
341
+
const ss = await session.waitForText("COLORED-ALT", 10000);
342
+
expect(ss.text).toContain("COLORED-ALT");
343
+
expect(ss.ansi).toMatch(/\x1b\[38;2;100;200;50m/);
344
+
},
345
+
20000
346
+
);
347
+
});
348
+
349
+
describe("resize-tui: resize timing", () => {
350
+
it(
351
+
"immediate screenshot after resize does not show stale dimensions",
352
+
async () => {
353
+
const dir = makeTmpDir();
354
+
const scriptPath = path.join(dir, "dims-timing.ts");
355
+
fs.writeFileSync(scriptPath, dimPrinterScript);
356
+
357
+
const session = await createSession(
358
+
process.execPath,
359
+
[scriptPath],
360
+
{ rows: 24, cols: 80, cwd: dir }
361
+
);
362
+
363
+
await session.waitForText("DIMS:80x24", 10000);
364
+
365
+
// Resize and immediately screenshot -- check if we see a transient/stale state
366
+
session.resize(30, 100);
367
+
368
+
// Take an immediate screenshot (no explicit wait for new dims)
369
+
const immediateShot = session.screenshot();
370
+
371
+
// Now wait for the proper update to arrive
372
+
const finalShot = await session.waitForText("DIMS:100x30", 10000);
373
+
expect(finalShot.text).toContain("DIMS:100x30");
374
+
375
+
// The immediate screenshot may or may not have the new dims yet.
376
+
// What matters is that it should NOT contain a corrupted/partial state.
377
+
// It should contain either the old dims or the new dims, not garbage.
378
+
const dimsMatch = immediateShot.text.match(/DIMS:(\d+)x(\d+)/);
379
+
expect(dimsMatch).not.toBeNull();
380
+
const immCols = parseInt(dimsMatch![1], 10);
381
+
const immRows = parseInt(dimsMatch![2], 10);
382
+
// Must be one of the two valid dimension sets
383
+
const isOldDims = immCols === 80 && immRows === 24;
384
+
const isNewDims = immCols === 100 && immRows === 30;
385
+
expect(isOldDims || isNewDims).toBe(true);
386
+
},
387
+
20000
388
+
);
389
+
390
+
it(
391
+
"rapid resize burst settles to final dimensions",
392
+
async () => {
393
+
const dir = makeTmpDir();
394
+
const scriptPath = path.join(dir, "dims-burst.ts");
395
+
fs.writeFileSync(scriptPath, dimPrinterScript);
396
+
397
+
const session = await createSession(
398
+
process.execPath,
399
+
[scriptPath],
400
+
{ rows: 24, cols: 80, cwd: dir }
401
+
);
402
+
403
+
await session.waitForText("DIMS:80x24", 10000);
404
+
405
+
// Fire a burst of resizes in quick succession
406
+
session.resize(25, 90);
407
+
session.resize(26, 95);
408
+
session.resize(28, 100);
409
+
session.resize(32, 110);
410
+
session.resize(36, 130);
411
+
412
+
// The app should eventually settle on the final dimensions
413
+
const ss = await session.waitForText("DIMS:130x36", 10000);
414
+
expect(ss.text).toContain("DIMS:130x36");
415
+
},
416
+
20000
417
+
);
418
+
});
+531
tests/scrollback-fidelity.test.ts
+531
tests/scrollback-fidelity.test.ts
···
1
+
import { describe, it, expect, afterEach, afterAll } from "vitest";
2
+
import * as fs from "node:fs";
3
+
import * as os from "node:os";
4
+
import * as path from "node:path";
5
+
import { Session } from "../src/testing/index.ts";
6
+
import { cleanupAll } from "../src/sessions.ts";
7
+
8
+
// Temp dirs for test isolation
9
+
const testCwd = fs.mkdtempSync(path.join(os.tmpdir(), "pty-sbfid-"));
10
+
const testSessionDir = fs.mkdtempSync(
11
+
path.join(os.tmpdir(), "pty-sbfid-sd-")
12
+
);
13
+
process.env.PTY_SESSION_DIR = testSessionDir;
14
+
15
+
afterAll(() => {
16
+
fs.rmSync(testCwd, {
17
+
recursive: true,
18
+
force: true,
19
+
maxRetries: 3,
20
+
retryDelay: 100,
21
+
});
22
+
fs.rmSync(testSessionDir, {
23
+
recursive: true,
24
+
force: true,
25
+
maxRetries: 3,
26
+
retryDelay: 100,
27
+
});
28
+
});
29
+
30
+
// ---- Scaffolding ----
31
+
32
+
let sessions: Session[] = [];
33
+
let sessionNames: string[] = [];
34
+
let tmpDirs: string[] = [];
35
+
36
+
function uniqueName(): string {
37
+
const name = `sbf-${process.pid}-${Date.now()}-${Math.random().toString(36).slice(2, 6)}`;
38
+
sessionNames.push(name);
39
+
return name;
40
+
}
41
+
42
+
function makeTmpDir(): string {
43
+
const dir = fs.mkdtempSync(path.join(os.tmpdir(), "pty-sbfid-td-"));
44
+
tmpDirs.push(dir);
45
+
return dir;
46
+
}
47
+
48
+
async function createSession(
49
+
command: string,
50
+
args: string[] = [],
51
+
opts: { rows?: number; cols?: number; cwd?: string } = {}
52
+
): Promise<Session> {
53
+
const name = uniqueName();
54
+
const session = await Session.server(command, args, {
55
+
name,
56
+
cwd: opts.cwd ?? testCwd,
57
+
rows: opts.rows,
58
+
cols: opts.cols,
59
+
});
60
+
sessions.push(session);
61
+
await session.attach();
62
+
return session;
63
+
}
64
+
65
+
afterEach(async () => {
66
+
for (const session of sessions) {
67
+
await session.close();
68
+
}
69
+
sessions = [];
70
+
for (const name of sessionNames) {
71
+
cleanupAll(name);
72
+
}
73
+
sessionNames = [];
74
+
for (const dir of tmpDirs) {
75
+
fs.rmSync(dir, {
76
+
recursive: true,
77
+
force: true,
78
+
maxRetries: 3,
79
+
retryDelay: 100,
80
+
});
81
+
}
82
+
tmpDirs = [];
83
+
});
84
+
85
+
// ---- Helpers ----
86
+
87
+
/**
88
+
* Check whether an SGR parameter sequence appears inside any CSI...m in the
89
+
* ANSI string. The xterm serialize addon may merge multiple SGR params into
90
+
* a single sequence.
91
+
*/
92
+
function ansiContainsSGR(ansi: string, sgrParams: string): boolean {
93
+
const escaped = sgrParams.replace(/;/g, ";");
94
+
const re = new RegExp(
95
+
`\\x1b\\[` +
96
+
`(?:[0-9;]*;)?` +
97
+
escaped +
98
+
`(?:;[0-9;]*)?` +
99
+
`m`
100
+
);
101
+
return re.test(ansi);
102
+
}
103
+
104
+
// ---- Tests ----
105
+
106
+
describe("scrollback-fidelity: large scrollback survives reconnect", () => {
107
+
it(
108
+
"500+ lines of mixed plain and ANSI-colored output survive reconnect",
109
+
async () => {
110
+
const dir = makeTmpDir();
111
+
const scriptPath = path.join(dir, "large-scrollback.ts");
112
+
// Generate 600 lines: even lines are plain, odd lines are colored
113
+
fs.writeFileSync(
114
+
scriptPath,
115
+
`
116
+
for (let i = 0; i < 600; i++) {
117
+
if (i % 2 === 0) {
118
+
process.stdout.write('LINE-' + String(i).padStart(4, '0') + '\\n');
119
+
} else {
120
+
process.stdout.write('\\x1b[31mLINE-' + String(i).padStart(4, '0') + '\\x1b[0m\\n');
121
+
}
122
+
}
123
+
setTimeout(() => {}, 300000);
124
+
`
125
+
);
126
+
127
+
const session = await createSession(process.execPath, [scriptPath], {
128
+
rows: 24,
129
+
cols: 80,
130
+
cwd: dir,
131
+
});
132
+
133
+
// Wait for the last line to appear
134
+
await session.waitForText("LINE-0599", 15000);
135
+
136
+
// Verify first and last lines are present
137
+
let ss = session.screenshot();
138
+
expect(ss.text).toContain("LINE-0000");
139
+
expect(ss.text).toContain("LINE-0599");
140
+
141
+
// Reconnect
142
+
await session.reconnect();
143
+
144
+
// After reconnect, ALL scrollback should survive
145
+
ss = await session.waitForText("LINE-0599", 10000);
146
+
expect(ss.text).toContain("LINE-0000");
147
+
expect(ss.text).toContain("LINE-0599");
148
+
// Also check some lines in the middle
149
+
expect(ss.text).toContain("LINE-0300");
150
+
},
151
+
30000
152
+
);
153
+
});
154
+
155
+
describe("scrollback-fidelity: 24-bit color in scrollback", () => {
156
+
it(
157
+
"various 24-bit RGB colors survive reconnect in scrollback",
158
+
async () => {
159
+
const dir = makeTmpDir();
160
+
const scriptPath = path.join(dir, "color-scrollback.ts");
161
+
fs.writeFileSync(
162
+
scriptPath,
163
+
`
164
+
// Generate lines with various 24-bit colors to push into scrollback
165
+
const colors = [
166
+
[255, 0, 0, 'RED-24BIT'],
167
+
[0, 255, 0, 'GREEN-24BIT'],
168
+
[0, 0, 255, 'BLUE-24BIT'],
169
+
[128, 64, 32, 'BROWN-24BIT'],
170
+
[255, 128, 255, 'PINK-24BIT'],
171
+
];
172
+
// Print enough filler to push colors into scrollback
173
+
for (let i = 0; i < 40; i++) {
174
+
for (const [r, g, b, label] of colors) {
175
+
process.stdout.write('\\x1b[38;2;' + r + ';' + g + ';' + b + 'm' + label + '\\x1b[0m\\n');
176
+
}
177
+
}
178
+
process.stdout.write('COLOR-DONE\\n');
179
+
setTimeout(() => {}, 300000);
180
+
`
181
+
);
182
+
183
+
const session = await createSession(process.execPath, [scriptPath], {
184
+
rows: 24,
185
+
cols: 80,
186
+
cwd: dir,
187
+
});
188
+
189
+
await session.waitForText("COLOR-DONE", 15000);
190
+
191
+
// Reconnect
192
+
await session.reconnect();
193
+
194
+
const ss = await session.waitForText("COLOR-DONE", 10000);
195
+
// Check text content
196
+
expect(ss.text).toContain("RED-24BIT");
197
+
expect(ss.text).toContain("GREEN-24BIT");
198
+
expect(ss.text).toContain("BLUE-24BIT");
199
+
expect(ss.text).toContain("BROWN-24BIT");
200
+
expect(ss.text).toContain("PINK-24BIT");
201
+
202
+
// Check ANSI color sequences survived serialization
203
+
expect(ansiContainsSGR(ss.ansi, "38;2;255;0;0")).toBe(true);
204
+
expect(ansiContainsSGR(ss.ansi, "38;2;0;255;0")).toBe(true);
205
+
expect(ansiContainsSGR(ss.ansi, "38;2;0;0;255")).toBe(true);
206
+
expect(ansiContainsSGR(ss.ansi, "38;2;128;64;32")).toBe(true);
207
+
expect(ansiContainsSGR(ss.ansi, "38;2;255;128;255")).toBe(true);
208
+
},
209
+
30000
210
+
);
211
+
});
212
+
213
+
describe("scrollback-fidelity: output during disconnect", () => {
214
+
it(
215
+
"output produced while disconnected is present after reconnect",
216
+
async () => {
217
+
const dir = makeTmpDir();
218
+
const scriptPath = path.join(dir, "timed-output.ts");
219
+
// Print a line every 100ms with a counter
220
+
fs.writeFileSync(
221
+
scriptPath,
222
+
`
223
+
let count = 0;
224
+
const timer = setInterval(() => {
225
+
process.stdout.write('TICK-' + String(count).padStart(4, '0') + '\\n');
226
+
count++;
227
+
if (count >= 100) {
228
+
clearInterval(timer);
229
+
process.stdout.write('TICKS-DONE\\n');
230
+
setTimeout(() => {}, 300000);
231
+
}
232
+
}, 100);
233
+
`
234
+
);
235
+
236
+
const session = await createSession(process.execPath, [scriptPath], {
237
+
rows: 24,
238
+
cols: 80,
239
+
cwd: dir,
240
+
});
241
+
242
+
// Wait for some output to appear
243
+
await session.waitForText("TICK-0005", 10000);
244
+
245
+
// Reconnect (which destroys the socket, waits 100ms, then reattaches)
246
+
// During the disconnection window, the script keeps producing output.
247
+
// We manually do what reconnect() does but with a longer gap.
248
+
// Access the backend's socket directly to simulate a network drop.
249
+
const backend = (session as any).backend;
250
+
backend.socket.destroy();
251
+
// Wait 500ms while the script keeps producing
252
+
await new Promise((r) => setTimeout(r, 500));
253
+
// Reset terminal and reconnect
254
+
(session as any).terminal.reset();
255
+
await (session as any).connectSocket();
256
+
await session.attach();
257
+
258
+
// The script should still be running and eventually finish
259
+
const ss = await session.waitForText("TICKS-DONE", 15000);
260
+
// Output produced during disconnection should be present
261
+
// At 100ms intervals, in 500ms about 5 ticks should have been produced
262
+
// while disconnected. All should be in the scrollback now.
263
+
expect(ss.text).toContain("TICK-0005");
264
+
expect(ss.text).toContain("TICK-0010");
265
+
},
266
+
30000
267
+
);
268
+
});
269
+
270
+
describe("scrollback-fidelity: rapid output stream + resize", () => {
271
+
it(
272
+
"resize during rapid output does not corrupt content",
273
+
async () => {
274
+
const dir = makeTmpDir();
275
+
const scriptPath = path.join(dir, "rapid-output.ts");
276
+
// Print numbered lines rapidly
277
+
fs.writeFileSync(
278
+
scriptPath,
279
+
`
280
+
let i = 0;
281
+
const timer = setInterval(() => {
282
+
process.stdout.write('NUM-' + String(i).padStart(5, '0') + '\\n');
283
+
i++;
284
+
if (i >= 200) {
285
+
clearInterval(timer);
286
+
process.stdout.write('RAPID-DONE\\n');
287
+
setTimeout(() => {}, 300000);
288
+
}
289
+
}, 10);
290
+
`
291
+
);
292
+
293
+
const session = await createSession(process.execPath, [scriptPath], {
294
+
rows: 24,
295
+
cols: 80,
296
+
cwd: dir,
297
+
});
298
+
299
+
// Wait for some output
300
+
await session.waitForText("NUM-00010", 10000);
301
+
302
+
// Resize while output is still streaming
303
+
session.resize(30, 120);
304
+
305
+
// Wait for output to finish
306
+
const ss = await session.waitForText("RAPID-DONE", 15000);
307
+
308
+
// Verify resize took effect (terminal should now be 120 cols)
309
+
expect(session.cols).toBe(120);
310
+
expect(session.rows).toBe(30);
311
+
312
+
// Verify no content corruption - lines should still match the pattern
313
+
// Check that some lines are present and correctly formatted
314
+
expect(ss.text).toContain("NUM-00001");
315
+
expect(ss.text).toContain("RAPID-DONE");
316
+
317
+
// Every visible NUM- line should match the expected pattern
318
+
const numLines = ss.lines.filter((l) => l.startsWith("NUM-"));
319
+
for (const line of numLines) {
320
+
expect(line).toMatch(/^NUM-\d{5}$/);
321
+
}
322
+
},
323
+
30000
324
+
);
325
+
});
326
+
327
+
describe("scrollback-fidelity: alt screen with scrollback", () => {
328
+
it(
329
+
"normal buffer scrollback and alt screen content both survive reconnect",
330
+
async () => {
331
+
const dir = makeTmpDir();
332
+
const scriptPath = path.join(dir, "alt-with-scrollback.ts");
333
+
// First produce scrollback in the normal buffer, then switch to alt screen
334
+
fs.writeFileSync(
335
+
scriptPath,
336
+
`
337
+
// Phase 1: Generate scrollback in normal buffer
338
+
for (let i = 0; i < 50; i++) {
339
+
process.stdout.write('NORMAL-LINE-' + String(i).padStart(3, '0') + '\\n');
340
+
}
341
+
// Phase 2: Enter alt screen and draw content
342
+
process.stdout.write('\\x1b[?1049h'); // enter alt screen
343
+
process.stdout.write('\\x1b[H\\x1b[2J'); // home + clear
344
+
process.stdout.write('ALT-SCREEN-MARKER\\n');
345
+
process.stdout.write('ALT-CONTENT-ROW2\\n');
346
+
setTimeout(() => {}, 300000);
347
+
`
348
+
);
349
+
350
+
const session = await createSession(process.execPath, [scriptPath], {
351
+
rows: 24,
352
+
cols: 80,
353
+
cwd: dir,
354
+
});
355
+
356
+
// Wait for alt screen content
357
+
await session.waitForText("ALT-SCREEN-MARKER", 10000);
358
+
359
+
// Reconnect
360
+
await session.reconnect();
361
+
362
+
// Alt screen content should be visible
363
+
const ss = await session.waitForText("ALT-SCREEN-MARKER", 10000);
364
+
expect(ss.text).toContain("ALT-SCREEN-MARKER");
365
+
expect(ss.text).toContain("ALT-CONTENT-ROW2");
366
+
367
+
// The normal buffer scrollback should NOT appear in the alt screen
368
+
// (this is correct terminal behavior - alt screen is a separate buffer)
369
+
// But the normal buffer data is preserved internally.
370
+
// We verify the alt screen is clean of normal buffer content.
371
+
expect(ss.text).not.toContain("NORMAL-LINE-000");
372
+
},
373
+
30000
374
+
);
375
+
});
376
+
377
+
describe("scrollback-fidelity: Unicode and wide characters", () => {
378
+
it(
379
+
"CJK, emoji, box-drawing, and combining marks survive reconnect",
380
+
async () => {
381
+
const dir = makeTmpDir();
382
+
const scriptPath = path.join(dir, "unicode-scrollback.ts");
383
+
fs.writeFileSync(
384
+
scriptPath,
385
+
`
386
+
// CJK characters (2-cell width)
387
+
process.stdout.write('CJK:\u4e16\u754c\u4f60\u597d\\n');
388
+
// Emoji
389
+
process.stdout.write('EMOJI:\u{1f600}\u{1f680}\u{2764}\\n');
390
+
// Box drawing
391
+
process.stdout.write('BOX:\u250c\u2500\u2500\u2510\\n');
392
+
process.stdout.write('BOX:\u2502 \u2502\\n');
393
+
process.stdout.write('BOX:\u2514\u2500\u2500\u2518\\n');
394
+
// Combining marks: e + combining acute accent
395
+
process.stdout.write('COMBINING:e\\u0301 o\\u0308\\n');
396
+
process.stdout.write('UNICODE-DONE\\n');
397
+
setTimeout(() => {}, 300000);
398
+
`
399
+
);
400
+
401
+
const session = await createSession(process.execPath, [scriptPath], {
402
+
rows: 24,
403
+
cols: 80,
404
+
cwd: dir,
405
+
});
406
+
407
+
await session.waitForText("UNICODE-DONE", 10000);
408
+
409
+
// Verify before reconnect
410
+
let ss = session.screenshot();
411
+
expect(ss.text).toContain("CJK:");
412
+
expect(ss.text).toContain("EMOJI:");
413
+
expect(ss.text).toContain("BOX:");
414
+
expect(ss.text).toContain("COMBINING:");
415
+
416
+
// Reconnect
417
+
await session.reconnect();
418
+
419
+
ss = await session.waitForText("UNICODE-DONE", 10000);
420
+
// CJK characters preserved
421
+
expect(ss.text).toContain("\u4e16\u754c\u4f60\u597d");
422
+
// Emoji preserved (some terminals render these differently, but text should survive)
423
+
expect(ss.text).toContain("EMOJI:");
424
+
// Box drawing preserved
425
+
expect(ss.text).toContain("\u250c\u2500\u2500\u2510");
426
+
expect(ss.text).toContain("\u2514\u2500\u2500\u2518");
427
+
// Combining marks - the combined form should be present
428
+
expect(ss.text).toContain("COMBINING:");
429
+
},
430
+
30000
431
+
);
432
+
});
433
+
434
+
describe("scrollback-fidelity: cursor position preservation", () => {
435
+
it(
436
+
"cursor position set via CSI H is restored after reconnect",
437
+
async () => {
438
+
const dir = makeTmpDir();
439
+
const scriptPath = path.join(dir, "cursor-pos.ts");
440
+
// Enter alt screen, position cursor at a specific location, and write a marker
441
+
fs.writeFileSync(
442
+
scriptPath,
443
+
`
444
+
process.stdout.write('\\x1b[?1049h'); // enter alt screen
445
+
process.stdout.write('\\x1b[2J'); // clear screen
446
+
// Move cursor to row 10, col 20 and write a marker
447
+
process.stdout.write('\\x1b[10;20H');
448
+
process.stdout.write('CURSOR-HERE');
449
+
// Move cursor to row 15, col 5 (final resting position)
450
+
process.stdout.write('\\x1b[15;5H');
451
+
setTimeout(() => {}, 300000);
452
+
`
453
+
);
454
+
455
+
const session = await createSession(process.execPath, [scriptPath], {
456
+
rows: 24,
457
+
cols: 80,
458
+
cwd: dir,
459
+
});
460
+
461
+
await session.waitForText("CURSOR-HERE", 10000);
462
+
463
+
// Screenshot captures the screen state including where text was placed
464
+
let ss = session.screenshot();
465
+
// The marker should be at row 10 (0-indexed: 9)
466
+
expect(ss.lines.length).toBeGreaterThanOrEqual(10);
467
+
expect(ss.lines[9]).toContain("CURSOR-HERE");
468
+
469
+
// Reconnect
470
+
await session.reconnect();
471
+
472
+
ss = await session.waitForText("CURSOR-HERE", 10000);
473
+
// After reconnect, the text placed at row 10, col 20 should still be there
474
+
expect(ss.lines.length).toBeGreaterThanOrEqual(10);
475
+
expect(ss.lines[9]).toContain("CURSOR-HERE");
476
+
477
+
// Verify the text is at the correct column position
478
+
// Col 20 = index 19 in the string (0-indexed)
479
+
const markerIndex = ss.lines[9].indexOf("CURSOR-HERE");
480
+
expect(markerIndex).toBe(19);
481
+
},
482
+
30000
483
+
);
484
+
});
485
+
486
+
describe("scrollback-fidelity: multiple resize + reconnect with scrollback", () => {
487
+
it(
488
+
"scrollback survives resize to smaller, reconnect, resize to larger, and second reconnect",
489
+
async () => {
490
+
const session = await createSession("sh", [
491
+
"-c",
492
+
// Generate scrollback (more lines than the 24-row terminal)
493
+
"for i in $(seq -w 1 60); do echo \"SCROLL-LINE-$i\"; done; sleep 300",
494
+
]);
495
+
496
+
// Wait for all output
497
+
await session.waitForText("SCROLL-LINE-60", 10000);
498
+
499
+
// Verify initial content
500
+
let ss = session.screenshot();
501
+
expect(ss.text).toContain("SCROLL-LINE-01");
502
+
expect(ss.text).toContain("SCROLL-LINE-60");
503
+
504
+
// Step 1: Resize to smaller terminal
505
+
session.resize(10, 40);
506
+
await new Promise((r) => setTimeout(r, 200));
507
+
508
+
// Reconnect at smaller size
509
+
await session.reconnect();
510
+
511
+
ss = await session.waitForText("SCROLL-LINE-60", 10000);
512
+
// Content should still be present even in smaller terminal
513
+
expect(ss.text).toContain("SCROLL-LINE-01");
514
+
expect(ss.text).toContain("SCROLL-LINE-60");
515
+
516
+
// Step 2: Resize to larger terminal
517
+
session.resize(40, 132);
518
+
await new Promise((r) => setTimeout(r, 200));
519
+
520
+
// Reconnect again at larger size
521
+
await session.reconnect();
522
+
523
+
ss = await session.waitForText("SCROLL-LINE-60", 10000);
524
+
// All content should still survive the second reconnect
525
+
expect(ss.text).toContain("SCROLL-LINE-01");
526
+
expect(ss.text).toContain("SCROLL-LINE-30");
527
+
expect(ss.text).toContain("SCROLL-LINE-60");
528
+
},
529
+
30000
530
+
);
531
+
});