[FEATURE] VS Code extension: no keyboard scrolling in the Claude panel transcript

Preflight Checklist

• [x] I have searched existing requests and this feature hasn't been requested yet
• [x] This is a single feature request (not multiple features)

Problem Statement

The Claude panel in the VS Code extension has no way to scroll the transcript from the keyboard. The input box traps focus, so with the mouse away from the panel, there's no way to page through earlier output.

Requested keys, matching VS Code editor conventions:

• PageUp / PageDown: scroll one page
• Ctrl+Home / Ctrl+End: jump to top/bottom
• Ctrl+Up / Ctrl+Down: scroll a few lines

Platform: VS Code on Linux, extension 2.1.198.

Proposed Solution

I am applying this patch here every time I open VS Code to give me the behaviour I'm asking for. Ironically, I generated it with Claude Code.

# ===========================================================================
# Claude Code panel keyboard scrolling (PageUp/PageDown, Ctrl+Home/End)
# ===========================================================================
# Adds keyboard scrolling to the Claude Code VS Code webview transcript.
# PageUp/PageDown scroll a page; Ctrl+Home / Ctrl+End jump top/bottom;
# Ctrl+Up / Ctrl+Down scroll a few lines with a smooth glide.
# The extension ships no keyboard scrolling and traps Tab focus in the
# input, so we inject a capture-phase keydown handler into the webview
# bundle. Re-run after the extension updates (update overwrites the bundle).
#
# Patch injected into the Claude Code extension's webview bundle. A Claude
# Code extension update wipes it. If scrolling stops working: reload the
# window, then re-apply with: ~/.local/bin/claude-vscode-scroll-patch.sh
# ---------------------------------------------------------------------------

#!/usr/bin/env bash
set -euo pipefail
MARKER="CLAUDE_KBD_SCROLL_PATCH"
EXT_GLOB="$HOME/.vscode/extensions/anthropic.claude-code-"*
shopt -s nullglob; dirs=( $EXT_GLOB ); shopt -u nullglob
if [ ${#dirs[@]} -eq 0 ]; then
echo "No anthropic.claude-code extension found under ~/.vscode/extensions" >&2
exit 1
fi
patched_any=0
for d in "${dirs[@]}"; do
f="$d/webview/index.js"
[ -f "$f" ] || continue
if grep -q "$MARKER" "$f"; then echo "already patched: $f"; continue; fi
cat >> "$f" <<'PATCH'

// CLAUDE_KBD_SCROLL_PATCH
(function(){
if (window.__claudeKbdScrollPatch) return;
window.__claudeKbdScrollPatch = true;
function findScroller(){
    var best=null, bestArea=0;
    var els=document.querySelectorAll('*');
    for (var i=0;i<els.length;i++){
    var el=els[i];
    if (el.scrollHeight <= el.clientHeight + 8) continue;
    var s=getComputedStyle(el);
    if (s.overflowY!=='auto' && s.overflowY!=='scroll') continue;
    var area=el.clientHeight*el.clientWidth;
    if (area>bestArea){ bestArea=area; best=el; }
    }
    return best || document.scrollingElement || document.documentElement;
}
window.addEventListener('keydown', function(e){
    var pageUp=e.key==='PageUp', pageDown=e.key==='PageDown';
    var top=e.ctrlKey && e.key==='Home', bottom=e.ctrlKey && e.key==='End';
    var lineUp=e.ctrlKey && e.key==='ArrowUp', lineDown=e.ctrlKey && e.key==='ArrowDown';
    if(!pageUp && !pageDown && !top && !bottom && !lineUp && !lineDown) return;
    var sc=findScroller(); if(!sc) return;
    var page=Math.max(40, sc.clientHeight*0.5);
    var step=120; // ~6 lines
    if(lineUp) sc.scrollBy({top:-step, behavior:'smooth'});
    else if(lineDown) sc.scrollBy({top:step, behavior:'smooth'});
    else if(pageUp) sc.scrollTop -= page;
    else if(pageDown) sc.scrollTop += page;
    else if(top) sc.scrollTop = 0;
    else if(bottom) sc.scrollTop = sc.scrollHeight;
    e.preventDefault(); e.stopPropagation();
}, true);
})();
PATCH
echo "patched: $f"; patched_any=1
done
if [ "$patched_any" = 1 ]; then
echo; echo "Done. Reload the VS Code window, then use PageUp/PageDown, Ctrl+Home/End."
fi

Alternative Solutions

_No response_

Priority

Medium - Would be very helpful

Feature Category

Interactive mode (TUI)

Use Case Example

I switch to my Claude Code in the VS Code editor with control+esc, type a message, get output, then scroll through the output produced or previous messages without touching the mouse.

Additional Context

_No response_