cli-tunnel 1.3.1-beta.3 → 1.3.1-beta.5

package/dist/index.js

@@ -23,10 +23,6 @@ import http from 'node:http';
 import readline from 'node:readline';
 import { WebSocketServer, WebSocket } from 'ws';
 import os from 'node:os';
-import headlessPkg from '@xterm/headless';
-const HeadlessTerminal = headlessPkg.Terminal;
-import serializePkg from '@xterm/addon-serialize';
-const SerializeAddon = serializePkg.SerializeAddon;
 import { redactSecrets } from './redact.js';
 // F-15: Global error handlers to prevent unclean crashes
 process.on('uncaughtException', (err) => {
@@ -83,12 +79,13 @@ pass through to the underlying app. cli-tunnel's own flags
 const hasLocal = args.includes('--local');
 const hasTunnel = !hasLocal;
 const hasReplay = !args.includes('--no-replay');
+const noWait = args.includes('--no-wait');
 const portIdx = args.indexOf('--port');
 const port = (portIdx !== -1 && args[portIdx + 1]) ? parseInt(args[portIdx + 1], 10) : 0;
 const nameIdx = args.indexOf('--name');
 const sessionName = (nameIdx !== -1 && args[nameIdx + 1]) ? args[nameIdx + 1] : '';
 // Everything that's not our flags is the command
-const ourFlags = new Set(['--local', '--tunnel', '--port', '--name', '--no-replay']);
+const ourFlags = new Set(['--local', '--tunnel', '--port', '--name', '--no-replay', '--no-wait']);
 const cmdArgs = [];
 let skip = false;
 for (let i = 0; i < args.length; i++) {
@@ -100,7 +97,7 @@ for (let i = 0; i < args.length; i++) {
         skip = true;
         continue;
     }
-    if (args[i] === '--local' || args[i] === '--tunnel' || args[i] === '--no-replay')
+    if (args[i] === '--local' || args[i] === '--tunnel' || args[i] === '--no-replay' || args[i] === '--no-wait')
         continue;
     cmdArgs.push(args[i]);
 }
@@ -529,11 +526,6 @@ wss.on('connection', (ws, req) => {
     // F-10: WS ping/pong heartbeat
     ws._isAlive = true;
     ws.on('pong', () => { ws._isAlive = true; });
-    // Send current screen state so new clients see what's on the terminal now
-    const screenState = getScreenState();
-    if (screenState) {
-        ws.send(JSON.stringify({ type: 'pty', data: screenState }));
-    }
     ws.on('message', (data) => {
         // F-13: Enforce WS message rate limit (100 msg/sec)
         const now = Date.now();
@@ -559,16 +551,10 @@ wss.on('connection', (ws, req) => {
                     ptyProcess.write(msg.data);
                 }
             }
-            // #7: NaN guard on pty_resize — remote resize only if local hasn't resized recently
+            // pty_resize from remote clients is ignored — PTY stays at local terminal size
+            // The phone's xterm.js handles display via its own viewport/scrolling
             if (msg.type === 'pty_resize') {
-                const cols = Number(msg.cols);
-                const rows = Number(msg.rows);
-                const localRecentlyResized = Date.now() - localResizeAt < 2000;
-                if (Number.isFinite(cols) && Number.isFinite(rows) && ptyProcess && !localRecentlyResized) {
-                    ptyProcess.resize(Math.max(1, Math.min(500, cols)), Math.max(1, Math.min(200, rows)));
-                    if (screenTerminal)
-                        screenTerminal.resize(Math.max(1, Math.min(500, cols)), Math.max(1, Math.min(200, rows)));
-                }
+                // Only log, don't resize — prevents breaking local terminal layout
             }
         }
         catch {
@@ -590,25 +576,8 @@ setInterval(() => {
         ws.ping();
     }
 }, 30000);
-// Screen buffer: headless xterm.js terminal that tracks the current screen state
-// On client connect, serialize the screen and send it — renders correctly regardless of dimensions
-let screenTerminal = null;
-let serializeAddon = null;
-function initScreenBuffer(cols, rows) {
-    screenTerminal = new HeadlessTerminal({ cols, rows, scrollback: 1000, allowProposedApi: true });
-    serializeAddon = new SerializeAddon();
-    screenTerminal.loadAddon(serializeAddon);
-}
-function getScreenState() {
-    if (!serializeAddon)
-        return '';
-    return serializeAddon.serialize();
-}
 function broadcast(data) {
     const redacted = redactSecrets(data);
-    // Feed into headless terminal to track screen state
-    if (screenTerminal)
-        screenTerminal.write(redacted);
     const msg = JSON.stringify({ type: 'pty', data: redacted });
     for (const [, ws] of connections) {
         if (ws.readyState === WebSocket.OPEN)
@@ -810,7 +779,7 @@ async function main() {
         await new Promise(() => { });
     }
     // Wait for user to scan QR / copy URL before starting the CLI tool
-    if (hasTunnel) {
+    if (hasTunnel && !noWait) {
         console.log(`  ${BOLD}Press any key to start ${command}...${RESET}`);
         await new Promise((resolve) => {
             if (process.stdin.isTTY)
@@ -878,8 +847,6 @@ async function main() {
         cols, rows, cwd,
         env: safeEnv,
     });
-    // Initialize headless terminal for screen state tracking
-    initScreenBuffer(cols, rows);
     // Detect CSPRNG crash (rare Node.js + PTY issue) and show helpful message
     let earlyExitCode = null;
     const earlyExitCheck = new Promise((resolve) => {
@@ -917,7 +884,6 @@ async function main() {
         process.stdin.setRawMode(true);
     process.stdin.resume();
     process.stdin.on('data', (data) => ptyProcess.write(data.toString()));
-    process.stdout.on('resize', () => { localResizeAt = Date.now(); const c = process.stdout.columns || 120; const r = process.stdout.rows || 30; ptyProcess.resize(c, r); if (screenTerminal)
-        screenTerminal.resize(c, r); });
+    process.stdout.on('resize', () => { localResizeAt = Date.now(); const c = process.stdout.columns || 120; const r = process.stdout.rows || 30; ptyProcess.resize(c, r); });
 }
 main().catch((err) => { console.error(err); process.exit(1); });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cli-tunnel",
-  "version": "1.3.1-beta.3",
+  "version": "1.3.1-beta.5",
   "description": "Tunnel any CLI app to your phone — PTY + devtunnel + xterm.js",
   "type": "module",
   "main": "dist/index.js",

package/remote-ui/app.js

@@ -63,9 +63,18 @@
     if (currentView === 'grid' && gridMode === 'fullscreen' && gridTerminals[focusedIndex]) {
       canvas = gridTerminals[focusedIndex].panel.querySelector('canvas');
     } else {
-      canvas = termContainer.querySelector('canvas');
+      var tc = document.getElementById('terminal-container');
+      if (tc) canvas = tc.querySelector('canvas');
+    }
+    if (!canvas) {
+      // Fallback: try to find any canvas in the xterm container
+      var xtermEl = document.querySelector('.xterm');
+      if (xtermEl) canvas = xtermEl.querySelector('canvas');
+    }
+    if (!canvas || !canvas.captureStream) {
+      if (statusText) { var prev = statusText.textContent; statusText.textContent = 'Recording not supported'; setTimeout(function() { statusText.textContent = prev; }, 3000); }
+      return false;
     }
-    if (!canvas) { console.warn('No terminal canvas found'); return false; }
     try {
       var stream = canvas.captureStream(30); // 30 fps
       var mimeType = MediaRecorder.isTypeSupported('video/webm;codecs=vp9') ? 'video/webm;codecs=vp9'
@@ -140,7 +149,13 @@
     if (currentView === 'grid' && gridMode === 'fullscreen' && gridTerminals[focusedIndex]) {
       canvas = gridTerminals[focusedIndex].panel.querySelector('canvas');
     } else {
-      canvas = termContainer.querySelector('canvas');
+      var tc = document.getElementById('terminal-container');
+      if (tc) canvas = tc.querySelector('canvas');
+    }
+    if (!canvas) {
+      // Fallback: try to find any canvas in the xterm container
+      var xtermEl = document.querySelector('.xterm');
+      if (xtermEl) canvas = xtermEl.querySelector('canvas');
     }
     if (!canvas) {
       if (statusText) { var prev = statusText.textContent; statusText.textContent = 'No terminal to capture'; setTimeout(function() { statusText.textContent = prev; }, 2000); }
@@ -239,13 +254,15 @@
 
   async function loadSessions() {
     try {
-      const tokenParam = new URLSearchParams(window.location.search).get('token');
-      const headers = tokenParam ? { 'Authorization': 'Bearer ' + tokenParam } : {};
-      const resp = await fetch('/api/sessions', { headers });
-      const data = await resp.json();
+      var tokenParam = new URLSearchParams(window.location.search).get('token');
+      var headers = tokenParam ? { 'Authorization': 'Bearer ' + tokenParam } : {};
+      var resp = await fetch('/api/sessions', { headers: headers });
+      if (!resp.ok) throw new Error('Status ' + resp.status);
+      var data = await resp.json();
       renderDashboard(data.sessions || []);
     } catch (err) {
-      dashboard.innerHTML = '<div style="padding:12px;color:var(--red)">' + escapeHtml('Failed to load sessions: ' + err.message) + '</div>';
+      dashboard.innerHTML = '<div style="padding:20px 12px;color:var(--text-dim);text-align:center">' +
+        escapeHtml('Sessions unavailable. Use Hub mode (cli-tunnel with no command) to see all sessions.') + '</div>';
     }
   }