How does this skill handle tmux output corruption?

It provides specific configuration guidance for disabling EOL conversion (convertEol: false) when multiple xterm instances share a single tmux session to prevent line-ending conflicts.

What is the correct way to handle terminal detachment?

The skill recommends using specific API endpoints for detachment rather than destructive WebSocket 'close' messages, which can inadvertently kill the underlying PTY or tmux session.

Can I use this for multi-window terminal setups?

Yes, it includes critical architecture patterns for backend output routing and ownership tracking to prevent terminal output from broadcasting to the wrong browser windows.

Why shouldn't I use display: none for xterm.js containers?

xterm.js requires non-zero dimensions to initialize properly. Using display: none gives the container 0x0 dimensions; use visibility: hidden and absolute positioning instead to maintain layout dimensions while hiding the UI.

Xterm.js Terminal Integration

Name: Xterm.js Terminal Integration
Author: GGPrompts

byGGPrompts

•

Herramientas para Desarrolladores

Provides battle-tested patterns and debugging strategies for building production-grade terminal applications with xterm.js, React, and WebSockets.

Acerca de

This skill optimizes the development of terminal interfaces by providing deep architectural guidance on xterm.js integration within modern web stacks. It addresses complex challenges such as terminal lifecycle management, synchronized state and ref updates, WebSocket-based I/O, and tmux session persistence. By implementing these patterns, developers can avoid common pitfalls like output corruption in split panes, initialization failures in hidden containers, and destructive WebSocket operations, ensuring a robust and performant terminal experience within React applications.

Características Principales

Tmux session persistence and EOL conversion corruption fixes
Refactoring patterns for custom terminal hooks and shared refs
1 GitHub stars
Multi-window terminal output management and ownership tracking
WebSocket communication and message type routing strategies
Terminal lifecycle and initialization patterns for React-based layouts

Casos de Uso

Debugging WebSocket reconnection and terminal session detachment logic
Building a web-based IDE or cloud terminal interface with React
Implementing multi-pane or split terminal layouts using tmux backends

Acerca de

Características Principales

Tmux session persistence and EOL conversion corruption fixes
Refactoring patterns for custom terminal hooks and shared refs
1 GitHub stars
Multi-window terminal output management and ownership tracking
WebSocket communication and message type routing strategies
Terminal lifecycle and initialization patterns for React-based layouts

Casos de Uso

Debugging WebSocket reconnection and terminal session detachment logic
Building a web-based IDE or cloud terminal interface with React
Implementing multi-pane or split terminal layouts using tmux backends