diff --git a/apps/web/src/components/terminal.tsx b/apps/web/src/components/terminal.tsx index 6403cc6..7d8fa0e 100644 --- a/apps/web/src/components/terminal.tsx +++ b/apps/web/src/components/terminal.tsx @@ -74,6 +74,7 @@ export const TerminalComponent: React.FC = ({ wsRef.current = ws; ws.onopen = () => { + console.log("[Terminal] WebSocket connected"); setStatus("connected"); setError(null); reconnectAttemptsRef.current = 0; @@ -106,8 +107,10 @@ export const TerminalComponent: React.FC = ({ if (!termRef.current) return; if (event.data instanceof Blob) { + console.log("[Terminal] Received blob:", event.data.size, "bytes"); event.data.arrayBuffer().then((buffer) => { const data = new Uint8Array(buffer); + console.log("[Terminal] Writing data to terminal"); termRef.current?.write(data); }); } else if (typeof event.data === "string") { @@ -228,18 +231,25 @@ export const TerminalComponent: React.FC = ({ // Define fitTerminal before connectWebSocket so it's available in onmessage const fitTerminal = () => { - if (!fitAddonRef.current || !termRef.current) return; + if (!fitAddonRef.current || !termRef.current) { + console.log("[Terminal] fitTerminal: missing refs"); + return; + } // Ensure terminal is opened and has valid dimensions - if (termRef.current.cols === 0 || termRef.current.rows === 0) return; + if (termRef.current.cols === 0 || termRef.current.rows === 0) { + console.log("[Terminal] fitTerminal: zero dimensions", termRef.current.cols, termRef.current.rows); + return; + } const oldCols = termRef.current.cols; const oldRows = termRef.current.rows; try { fitAddonRef.current.fit(); - } catch { - // Ignore fit errors during initialization + } catch (err) { + console.error("[Terminal] fit error:", err); return; } const { cols, rows } = termRef.current; + console.log("[Terminal] fitTerminal:", oldCols, "x", oldRows, "->", cols, "x", rows); // Force refresh if dimensions changed and are valid if ((cols !== oldCols || rows !== oldRows) && cols > 0 && rows > 0) { try { @@ -255,7 +265,10 @@ export const TerminalComponent: React.FC = ({ }; // Open xterm first (must happen before fit) + console.log("[Terminal] Before open - container:", container.clientWidth, "x", container.clientHeight); term.open(container); + console.log("[Terminal] After open - container:", container.clientWidth, "x", container.clientHeight); + console.log("[Terminal] Term dimensions after open:", term.cols, "x", term.rows); ws = connectWebSocket(); // Initial fit after layout settles (terminal must be opened first)