fix(terminal): use height stabilisation instead of fixed threshold for resize

Replace the hardcoded `expectedHeight < 700` heuristic with a
frame-to-frame height comparison. The loop now exits as soon as the
container height stops changing (within 1px tolerance), which works
correctly on all screen sizes. Previously, on viewports taller than
~1140px the non-fullscreen height exceeded 700px so the condition was
never satisfied and the loop exhausted all attempts, introducing a
~1s delay on large screens.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
suraj-markup 2026-03-01 19:22:44 +05:30
parent dc3b864a67
commit b96eafeb31
1 changed files with 10 additions and 10 deletions

View File

@ -279,22 +279,19 @@ export function DirectTerminal({
const maxAttempts = 60;
let cancelled = false;
let rafId = 0;
let lastHeight = -1;
const resizeTerminal = () => {
if (cancelled) return;
resizeAttempts++;
// Get container dimensions
const rect = container.getBoundingClientRect();
const expectedHeight = rect.height;
// Wait for the container height to stabilise (CSS transition finished)
const currentHeight = container.getBoundingClientRect().height;
const settled = lastHeight >= 0 && Math.abs(currentHeight - lastHeight) < 1;
lastHeight = currentHeight;
// Check if container has reached target dimensions (within 10px tolerance)
const isFullscreenTarget = fullscreen
? expectedHeight > window.innerHeight - 100
: expectedHeight < 700;
if (!isFullscreenTarget && resizeAttempts < maxAttempts) {
// Container hasn't reached target size yet, try again
if (!settled && resizeAttempts < maxAttempts) {
// Container is still transitioning, try again next frame
rafId = requestAnimationFrame(resizeTerminal);
return;
}
@ -322,6 +319,7 @@ export function DirectTerminal({
if (cancelled) return;
if (e.target === container.parentElement) {
resizeAttempts = 0;
lastHeight = -1;
setTimeout(() => {
if (!cancelled) rafId = requestAnimationFrame(resizeTerminal);
}, 50);
@ -335,11 +333,13 @@ export function DirectTerminal({
const timer1 = setTimeout(() => {
if (cancelled) return;
resizeAttempts = 0;
lastHeight = -1;
resizeTerminal();
}, 300);
const timer2 = setTimeout(() => {
if (cancelled) return;
resizeAttempts = 0;
lastHeight = -1;
resizeTerminal();
}, 600);