diff --git a/frontend/src/components/Terminal/Terminal.tsx b/frontend/src/components/Terminal/Terminal.tsx index dbb13685..4f5e1229 100644 --- a/frontend/src/components/Terminal/Terminal.tsx +++ b/frontend/src/components/Terminal/Terminal.tsx @@ -33,6 +33,7 @@ export const Terminal: React.FC = ({ onSplitInGroup, }) => { const terminalRef = useRef(null); + const wrapperRef = useRef(null); // 最外层容器 const instanceRef = useRef | null>(null); const [fontSize, setFontSize] = useState(display?.fontSize ?? 14); @@ -121,12 +122,23 @@ export const Terminal: React.FC = ({ setTimeout(() => { const fitAddon = instanceRef.current?.getFitAddon(); if (fitAddon && instanceRef.current) { + // 检查各层容器尺寸 + if (wrapperRef.current && terminalRef.current) { + console.log(`[Terminal ${id}] 📦 Wrapper尺寸: ${wrapperRef.current.clientWidth}px × ${wrapperRef.current.clientHeight}px`); + console.log(`[Terminal ${id}] 📦 Content尺寸: ${terminalRef.current.clientWidth}px × ${terminalRef.current.clientHeight}px`); + } + fitAddon.fit(); // 发送新的尺寸给后端 - const cols = instanceRef.current.getXTerm().cols; - const rows = instanceRef.current.getXTerm().rows; + const xterm = instanceRef.current.getXTerm(); + const cols = xterm.cols; + const rows = xterm.rows; + console.log(`[Terminal ${id}] FitAddon计算结果: ${cols} cols x ${rows} rows`); instanceRef.current.sendResize(cols, rows); - console.log(`[Terminal ${id}] Tab activated, resized and notified: ${cols}x${rows}`); + // 重要:让XTerm获取焦点,否则无法输入 + xterm.focus(); + const hasFocus = xterm.textarea?.matches(':focus'); + console.log(`[Terminal ${id}] Tab activated, resized: ${cols}x${rows}, focused: ${hasFocus}`); } }, 100); } @@ -135,10 +147,20 @@ export const Terminal: React.FC = ({ // 监听窗口大小变化,自动调整终端尺寸 useEffect(() => { const handleResize = () => { + console.log(`[Terminal ${id}] 🔄 Window resize event`); + if (wrapperRef.current && terminalRef.current) { + console.log(`[Terminal ${id}] 📦 Resize - Wrapper: ${wrapperRef.current.clientWidth}px × ${wrapperRef.current.clientHeight}px`); + console.log(`[Terminal ${id}] 📦 Resize - Content: ${terminalRef.current.clientWidth}px × ${terminalRef.current.clientHeight}px`); + } + const fitAddon = instanceRef.current?.getFitAddon(); if (fitAddon) { setTimeout(() => { fitAddon.fit(); + if (instanceRef.current) { + const xterm = instanceRef.current.getXTerm(); + console.log(`[Terminal ${id}] 🔄 Resize后: ${xterm.cols} cols × ${xterm.rows} rows`); + } }, 100); } }; @@ -269,7 +291,7 @@ export const Terminal: React.FC = ({ }, []); return ( -
+
{/* 工具栏 */} = ({ orie ? (orientation === 'horizontal' ? container.clientWidth : container.clientHeight) : undefined; - console.log(`[TerminalSplitDivider] onResize, orientation: ${orientation}, delta: ${delta}, containerSize: ${containerSize}`); onResize(delta, containerSize); lastMousePosRef.current = currentMousePos; }; @@ -81,7 +80,6 @@ export const TerminalSplitDivider: React.FC = ({ orie const handleMouseDown = (e: React.MouseEvent) => { e.preventDefault(); - console.log(`[TerminalSplitDivider] mouseDown, orientation: ${orientation}`); const initialPos = orientation === 'horizontal' ? e.clientX : e.clientY; startPosRef.current = initialPos; lastMousePosRef.current = initialPos; diff --git a/frontend/src/components/Terminal/TerminalToolbar.tsx b/frontend/src/components/Terminal/TerminalToolbar.tsx index 89b66d37..d215ff83 100644 --- a/frontend/src/components/Terminal/TerminalToolbar.tsx +++ b/frontend/src/components/Terminal/TerminalToolbar.tsx @@ -168,7 +168,7 @@ export const TerminalToolbar: React.FC = ({ <>