[Bug] Web UI (V2) buttons unresponsive in browser mode (opencode serve) #37227

Bug: Web UI (V2) buttons unresponsive in browser mode (opencode serve)

Environment

• Version: 1.18.2
• OS: Linux (WSL2), accessing from Windows Chrome
• Command: opencode web --hostname=0.0.0.0
• Platform: Web (browser), NOT Tauri desktop app

Description

When running opencode serve (web server mode), the web UI loads and renders correctly (session list, header, icons all display), but all interactive buttons do nothing when clicked. Specifically:

• The "New session" (+) button renders but clicking has no effect (no API call, no navigation)
• Settings, Help, and other buttons similarly unresponsive
• No console errors or warnings
• No failed network requests

Root Cause Analysis

After extensive debugging with Playwright:

1. The JS bundle loads correctly (200, Content-Type: text/javascript, correct CORS headers)
2. 125 addEventListener calls ARE attached to document for event delegation
3. DOM elements render with correct data-component attributes (e.g., icon-button-v2, tooltip-v2-trigger)
4. Click events reach the button element (confirmed by intercepting click events)
5. However, the framework's event delegation handler does NOT process these clicks

The button's onclick property is null — the framework relies on document-level delegation but the delegation path fails to match and trigger actions. All UI components use -v2 suffix (icon-button-v2, tooltip-v2-trigger, etc.).

The JS bundle references window.__TAURI__ (function yw=()=>window.__TAURI__), suggesting the V2 UI was designed for the Tauri desktop app and some initialization path differs in pure browser mode.

Steps to Reproduce

1. Run opencode web --hostname=0.0.0.0
2. Open http://localhost:4096 in a browser
3. Observe the session list / empty state renders
4. Click the "+" button (New session) — nothing happens
5. Click Settings — nothing happens
6. Open DevTools console — no errors shown

Workaround

setTimeout(() => {
  const btn = document.querySelector('button[aria-label="New session"]');
  if (btn) {
    btn.addEventListener('click', async () => {
      const res = await fetch('/api/session', { method: 'POST', headers: {'Content-Type':'application/json'}, body:'{}' });
      const { data } = await res.json();
      window.location.href = '/?session=' + data.id;
    });
  }
}, 3000);

Related Issues

• Edit Project dialog crashes with useDialog must be used within a DialogProvider in browser web mode (opencode web) #35132 (Edit Project dialog crashes with useDialog in browser web mode)
• Copy button on code blocks in web UI does not copy to clipboard (V2 UI) #37189 (Copy button on code blocks in web UI does not copy to clipboard - V2 UI)