Bug: iOS Chrome — page scroll broken (touch-action/pointer-events conflict)

[buallen]

Environment

• Device: iPhone (iOS 16+)
• Browser: Chrome 117.x (CriOS)
• Reproduced on: iOS 16.x + Chrome 117.0.5938.108

Problem

On iOS Chrome, the terminal page cannot be scrolled by finger swipe. The viewport is completely locked.

Root Cause

src/public/style.css applies pointer-events: none on the xterm canvas/screen elements to prevent accidental touches. On iOS Chrome (WKWebView), this has a side effect: it also blocks the native touch scroll gesture propagation to the parent .xterm-viewport element, making the entire terminal non-scrollable.

Additionally, body { overflow: hidden } without a proper touch-action policy causes iOS to swallow all scroll attempts at the document level.

Steps to Reproduce

1. Open claude-code-web on iPhone with Chrome
2. Start a session and produce enough output to require scrolling
3. Attempt to swipe up/down on the terminal — page does not scroll

Expected Behavior

Finger swipe should scroll the terminal output naturally with iOS momentum scrolling.

Fix

Replace pointer-events: none on canvas with touch-action: pan-y:

/* WRONG — breaks scroll on iOS */
#terminal .xterm-screen * {
  pointer-events: none;
}

/* CORRECT — passes vertical swipes to scrollable viewport */
#terminal .xterm-screen canvas {
  touch-action: pan-y;
}

.xterm .xterm-viewport {
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-y: contain;
}

Also add to prevent iOS from locking the body scroll:

@media (hover: none) and (pointer: coarse) {
  html, body {
    position: fixed;
    overscroll-behavior: none;
  }
}