fix(extension): route clipboard image reading through extension host

[jeonghun-jj-lee]

Summary

The outer webview's navigator.clipboard.read() requires user activation (a keystroke on THAT document), but the user types inside the sandboxed iframe — so the async Clipboard API throws silently in newer Chromium/Electron, causing image paste to do nothing.

Fix

Forward clipboard-image-request to the extension host, which reads the clipboard image using platform-native tools:

Platform	File manager copy	Screenshot/browser copy
macOS	public.file-url → resolve path → read file	osascript + NSPasteboard (PNG/TIFF)
Linux	text/uri-list via xclip → read file	xclip image/png
Windows	PowerShell GetFileDropList → read file	PowerShell GetImage → PNG

Changes

• chat_bridge.ts: new clipboard-image-read handler with native readers
• chat_panel.ts: forward to extension host (both webview variants)
• deck/shell.ts: same forwarding for deck shell
• Tests for bridge handler and panel relay

Companion: harmoniqs/opencode#254

Summary by CodeRabbit

• New Features

  • Added support for inserting images from the system clipboard into chat across macOS, Linux, and Windows.
  • Clipboard images are handled through the extension for improved compatibility, including PNG and TIFF images and copied file images.
  • Image requests are processed only for visible panels, helping prevent unintended responses from hidden views.

• Bug Fixes

  • Improved clipboard image handling when browser-based clipboard access is unavailable or unsupported.

[coderabbitai]

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 60a9b516-7cec-4012-9c2a-3740bc7d02cb

📥 Commits

Reviewing files that changed from the base of the PR and between 5cf69b6 and 663ef81.

📒 Files selected for processing (5)

• packages/extension/src/chat_bridge.ts
• packages/extension/src/chat_panel.ts
• packages/extension/src/deck/shell.ts
• packages/extension/test/chat_bridge.test.ts
• packages/extension/test/chat_panel.test.ts

---

📝 Walkthrough

Walkthrough

The extension adds a visibility-gated clipboard-image-read bridge. Chat and shell webviews forward image requests to the extension host, which reads clipboard images through macOS, Linux, or Windows native tools and returns image metadata.

Changes

Clipboard image flow

Layer / File(s)	Summary
Native clipboard reading and bridge response packages/extension/src/chat_bridge.ts, packages/extension/test/chat_bridge.test.ts	The bridge validates panel visibility, reads clipboard images with platform-specific tools, and returns nullable image metadata. Tests cover visible and hidden panels, asynchronous replies, and data URL validation.
Webview request forwarding packages/extension/src/chat_panel.ts, packages/extension/src/deck/shell.ts, packages/extension/test/chat_panel.test.ts	Chat and shell webviews send clipboard-image-read requests to the extension host. Client-side navigator.clipboard.read handling was removed. Tests verify the relay behavior.

Estimated code review effort: 4 (Complex) | ~45 minutes

Sequence Diagram(s)

sequenceDiagram
  participant ChatWebview
  participant ExtensionHost
  participant NativeClipboard
  ChatWebview->>ExtensionHost: Send clipboard-image-read
  ExtensionHost->>NativeClipboard: Read image with platform tools
  NativeClipboard-->>ExtensionHost: Return image data or null
  ExtensionHost-->>ChatWebview: Send clipboard-image metadata

Loading

Suggested reviewers: aarontrowbridge, gennadiryan

✨ Finishing Touches 💡 1

🛠️ Fix failing CI checks 💡

• Create stacked PR
• Commit on current branch

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch fix/image-paste-webview

---

_{Comment @coderabbitai help to get the list of available commands.}