alex/headquarter
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

debug: add console logging to trace mobile terminal black screen issue

Browse Source
This commit is contained in:
Fusion
2026-05-24 22:46:48 +02:00
parent 77b7c82563
commit 22f736ce20
1 changed files with 29 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/src/components/terminal.tsx
+29 -6
View File
@@ -74,6 +74,7 @@ export const TerminalComponent: React.FC<TerminalProps> = ({
wsRef.current = ws;
ws.onopen = () => {
console.log("[Terminal] WebSocket connected");
setStatus("connected");
setError(null);
reconnectAttemptsRef.current = 0;
@@ -106,13 +107,16 @@ export const TerminalComponent: React.FC<TerminalProps> = ({
if (!termRef.current) return;
if (event.data instanceof Blob) {
console.log("[Terminal] Received blob data:", event.data.size, "bytes");
event.data.arrayBuffer().then((buffer) => {
const data = new Uint8Array(buffer);
console.log("[Terminal] Writing", data.length, "bytes to terminal");
termRef.current?.write(data);
});
} else if (typeof event.data === "string") {
try {
const msg = JSON.parse(event.data);
console.log("[Terminal] Received JSON message:", msg);
if (msg.type === "status") {
if (msg.status === "connected") {
setStatus("connected");
@@ -184,7 +188,12 @@ export const TerminalComponent: React.FC<TerminalProps> = ({
}, [instanceId]);
useEffect(() => {
if (!terminalRef.current) return;
if (!terminalRef.current) {
console.error("[Terminal] terminalRef is null");
return;
}
console.log("[Terminal] Initializing terminal for instance", instanceId, "isMobile:", isMobile);
// Initialize terminal
const currentFontSize = calculateFontSize();
@@ -228,18 +237,25 @@ export const TerminalComponent: React.FC<TerminalProps> = ({
// 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,17 +271,24 @@ export const TerminalComponent: React.FC<TerminalProps> = ({
};
// Open xterm first (must happen before fit)
console.log("[Terminal] Opening xterm in container", container.clientWidth, "x", container.clientHeight);
term.open(container);
ws = connectWebSocket();
// Initial fit after layout settles (terminal must be opened first)
const doInitialFit = () => {
if (!container.isConnected) return;
if (!container.isConnected) {
console.log("[Terminal] Container not connected yet");
return;
}
// Ensure container has dimensions before fitting
console.log("[Terminal] Container dimensions:", container.clientWidth, "x", container.clientHeight);
if (container.clientWidth > 0 && container.clientHeight > 0) {
console.log("[Terminal] Calling initial fit");
fitTerminal();
} else {
// Container not ready yet, try again
console.log("[Terminal] Container has no dimensions, retrying...");
requestAnimationFrame(doInitialFit);
}
};