xterm.js/test_alt_minus.html

<!DOCTYPE html>
<html>
<head>
    <title>Alt+- Key Test</title>
    <link rel="stylesheet" href="../css/xterm.css" />
    <script src="../lib/xterm.js"></script>
</head>
<body>
    <div id="terminal"></div>
    <div id="output">
        <h3>Key Events:</h3>
        <div id="keyEvents"></div>
    </div>

    <script>
        // Create terminal
        const terminal = new Terminal({
            cols: 80,
            rows: 24
        });
        
        // Open terminal in DOM
        terminal.open(document.getElementById('terminal'));
        
        // Track key events
        const keyEventsDiv = document.getElementById('keyEvents');
        let eventCount = 0;
        
        terminal.onKey((event) => {
            eventCount++;
            const eventInfo = document.createElement('div');
            eventInfo.textContent = `${eventCount}: Key="${event.key}" (hex: ${event.key.split('').map(c => '\\x' + c.charCodeAt(0).toString(16).padStart(2, '0')).join('')}) - keyCode: ${event.domEvent.keyCode}, altKey: ${event.domEvent.altKey}`;
            keyEventsDiv.appendChild(eventInfo);
            console.log('onKey fired:', event);
        });
        
        // Also listen to raw DOM events for comparison
        document.addEventListener('keydown', (event) => {
            if (event.altKey && event.keyCode === 189) {
                console.log('Raw keydown for Alt+- detected:', event);
                const rawInfo = document.createElement('div');
                rawInfo.style.color = 'blue';
                rawInfo.textContent = `RAW: keydown Alt+- detected - keyCode: ${event.keyCode}, key: "${event.key}"`;
                keyEventsDiv.appendChild(rawInfo);
            }
        });
        
        // Instructions
        const instructions = document.createElement('div');
        instructions.innerHTML = `
            <h3>Test Instructions:</h3>
            <p>1. Click in the terminal area</p>
            <p>2. Press Alt+- (Alt plus minus)</p>
            <p>3. Check if key events are logged below</p>
            <p style="color: red;">Expected: You should see a key event with key="\\x1b-"</p>
        `;
        document.body.insertBefore(instructions, document.getElementById('terminal'));
    </script>
</body>
</html>