Fix terminal size on connect — send dimensions after handshake
Root cause: The PTY is allocated at 80x24 during the SSH handshake. The frontend xterm.js fits correctly to the container (e.g. 120x35), but term.onResize fires before the backend connection is ready, so the ResizeSession call is silently rejected. When the connection completes, fitAddon.fit() sees the terminal already has the right cols/rows and does NOT fire another onResize event. The PTY stays at 80x24. Fix: On 'session:state → connected', explicitly read the current terminal cols/rows and send them to the backend via ResizeSession, bypassing the onResize event dependency. Also fix empty-state ordering in addTab() — hide the empty-state BEFORE activating the panel so the panel-container gets the full workspace height immediately (empty-state has flex:1 and was stealing half the height during initial layout). Simplify createTerminal() fit logic — force a synchronous reflow via offsetHeight access, then fit immediately.
This commit is contained in:
+16
-5
@@ -134,13 +134,24 @@ class App {
|
|||||||
window.runtime.EventsOn('session:state', (payload) => {
|
window.runtime.EventsOn('session:state', (payload) => {
|
||||||
this.tabs.updateSessionState(payload.sessionID, payload.state, payload.error);
|
this.tabs.updateSessionState(payload.sessionID, payload.state, payload.error);
|
||||||
this.updateStatusBar();
|
this.updateStatusBar();
|
||||||
// Re-fit the terminal once connected so it picks up the final container size.
|
// Once connected, ensure the backend PTY has the correct dimensions.
|
||||||
// Use multiple delays because the panel layout may still be settling.
|
// The initial fit happens before the SSH handshake completes, so the
|
||||||
|
// onResize callback fires when the backend isn't ready. By the time
|
||||||
|
// the connection is established, xterm already has the right cols/rows
|
||||||
|
// and fitAddon.fit() won't trigger a new resize event. We must
|
||||||
|
// explicitly send the current terminal size to the backend.
|
||||||
if (payload.state === 'connected') {
|
if (payload.state === 'connected') {
|
||||||
|
const entry = this.terminals.terminals.get(payload.sessionID);
|
||||||
|
if (entry) {
|
||||||
|
const { cols, rows } = entry.term;
|
||||||
|
try {
|
||||||
|
window.go.api.Service.ResizeSession(payload.sessionID, cols, rows);
|
||||||
|
} catch (_) { /* noop */ }
|
||||||
|
}
|
||||||
|
// Also re-fit to catch any layout changes that occurred while connecting.
|
||||||
const fit = () => this.terminals.fitSession(payload.sessionID);
|
const fit = () => this.terminals.fitSession(payload.sessionID);
|
||||||
setTimeout(fit, 30);
|
setTimeout(fit, 50);
|
||||||
setTimeout(fit, 150);
|
setTimeout(fit, 300);
|
||||||
setTimeout(fit, 500);
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -47,8 +47,10 @@ class TabManager {
|
|||||||
panel.style.display = 'none';
|
panel.style.display = 'none';
|
||||||
this.panelContainer.appendChild(panel);
|
this.panelContainer.appendChild(panel);
|
||||||
|
|
||||||
this.setActive(sessionInfo.id);
|
// Hide the empty-state BEFORE activating the panel so the
|
||||||
|
// panel-container gets the full workspace height immediately.
|
||||||
this._updateEmptyState();
|
this._updateEmptyState();
|
||||||
|
this.setActive(sessionInfo.id);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
@@ -67,23 +67,15 @@ class TerminalManager {
|
|||||||
const container = document.getElementById(containerId);
|
const container = document.getElementById(containerId);
|
||||||
term.open(container);
|
term.open(container);
|
||||||
|
|
||||||
// Fit the terminal once the container has real dimensions.
|
// Force a synchronous layout reflow so the container reports its
|
||||||
// The panel may have just transitioned from display:none, so we
|
// true dimensions, then fit the terminal to fill the space.
|
||||||
// poll until the container reports a non-trivial size.
|
// eslint-disable-next-line no-unused-expressions
|
||||||
|
container.offsetHeight;
|
||||||
const doFit = () => { try { fitAddon.fit(); } catch (_) { /* noop */ } };
|
const doFit = () => { try { fitAddon.fit(); } catch (_) { /* noop */ } };
|
||||||
let fitAttempts = 0;
|
|
||||||
const tryFit = () => {
|
|
||||||
fitAttempts++;
|
|
||||||
const rect = container.getBoundingClientRect();
|
|
||||||
if (rect.width > 10 && rect.height > 10) {
|
|
||||||
doFit();
|
doFit();
|
||||||
} else if (fitAttempts < 20) {
|
// Belt-and-braces: retry once after a paint in case the initial
|
||||||
// Container still has no size — retry
|
// reflow dimensions were still stale.
|
||||||
setTimeout(tryFit, 50);
|
requestAnimationFrame(doFit);
|
||||||
return;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
requestAnimationFrame(tryFit);
|
|
||||||
|
|
||||||
// Forward user keystrokes to the backend
|
// Forward user keystrokes to the backend
|
||||||
term.onData((data) => {
|
term.onData((data) => {
|
||||||
|
|||||||
Reference in New Issue
Block a user