Fix clipboard issues in MCP Inspector extension#2144
Conversation
|
Warning Rate limit exceeded
To keep reviews running without waiting, you can enable usage-based add-on for your organization. This allows additional reviews beyond the hourly cap. Account admins can enable it under billing. ⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (4)
📝 WalkthroughWalkthroughImplements clipboard bridging between a VS Code webview iframe and the extension host. The runtime script intercepts clipboard operations (copy, cut, paste) inside the webview and patches the Clipboard API, while a new message relay mechanism routes clipboard read/write requests through the parent webview to the extension's clipboard access. Changes
Sequence DiagramssequenceDiagram
participant Iframe as Iframe Content
participant WebviewScript as Webview Script
participant ExtensionHost as Extension Host
participant ClipboardAPI as VS Code Clipboard API
rect rgba(100, 150, 200, 0.5)
Note over Iframe,ClipboardAPI: Paste Operation
Iframe->>WebviewScript: mcp-inspector-request-paste
WebviewScript->>ExtensionHost: onDidReceiveMessage (readText)
ExtensionHost->>ClipboardAPI: readText()
ClipboardAPI-->>ExtensionHost: clipboard content
ExtensionHost-->>WebviewScript: postMessage (paste-response)
WebviewScript-->>Iframe: mcp-inspector-paste-response
Iframe->>Iframe: Insert text & dispatch input event
end
rect rgba(150, 100, 200, 0.5)
Note over Iframe,ClipboardAPI: Copy/Cut Operation
Iframe->>Iframe: Capture selection
Iframe->>WebviewScript: mcp-inspector-request-clipboard-write
WebviewScript->>ExtensionHost: onDidReceiveMessage (writeText)
ExtensionHost->>ClipboardAPI: writeText()
ClipboardAPI-->>ExtensionHost: complete
ExtensionHost-->>WebviewScript: postMessage (write-result)
WebviewScript-->>Iframe: mcp-inspector-clipboard-write-result
end
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Review rate limit: 0/1 reviews remaining, refill in 22 minutes and 54 seconds.Comment |
6759ee8 to
70085e3
Compare
|
@CodeRabbit review |
✅ Actions performedReview triggered.
|
There was a problem hiding this comment.
Pull request overview
Fixes clipboard interoperability in the MCP Inspector VS Code extension by adding an extension-host clipboard bridge so the embedded cross-origin inspector iframe can reliably paste into form fields and copy server items.
Changes:
- Add an extension-host clipboard read/write bridge via
vscode.env.clipboardfor webviews. - Add parent-webview ↔ iframe
postMessageplumbing for clipboard operations. - Patch the inspector client (theme injection script) to intercept paste/copy/select-all and to provide clipboard write fallbacks.
Reviewed changes
Copilot reviewed 3 out of 3 changed files in this pull request and generated 5 comments.
| File | Description |
|---|---|
| workspaces/mcp-inspector/mcp-inspector-extension/src/extension.ts | Attaches clipboard bridge for the standalone inspector panel webview. |
| workspaces/mcp-inspector/mcp-inspector-extension/src/MCPInspectorViewProvider.ts | Attaches clipboard bridge for the view-container webview and relays clipboard messages between iframe and extension host. |
| workspaces/mcp-inspector/mcp-inspector-extension/scripts/inject-theme.js | Injects iframe-side keyboard interception + clipboard write fallback logic into the inspector client. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@workspaces/mcp-inspector/mcp-inspector-extension/scripts/inject-theme.js`:
- Around line 114-123: The cut handler currently deletes the selection
immediately and swallows clipboard errors; change it to perform the delete only
after the clipboard write succeeds by calling
window.__mcpInspectorWriteClipboard(ctx.text) and then, in the success callback
(or await the promise), call deleteSelection(ctx) only if k === 'x'. Make the
event handler use async/Promise flow so e.preventDefault()/e.stopPropagation()
still run but defer deletion until the write resolves; also ensure
getSelectionContext() returns a cloned Range (e.g., include
ctx.range.cloneRange()) for contenteditable selections so that
deleteSelection(ctx) applied later still targets the original selection. Ensure
you do not delete on rejection/timeouts and continue to swallow or surface
errors per existing policy.
- Around line 38-58: isPasteableInput currently includes 'number' but
insertTextAt unconditionally uses selection APIs
(selectionStart/selectionEnd/setSelectionRange) which aren't supported for
input[type="number"]; update the logic so paste won't fail by either removing
'number' from the pasteableTypes array in isPasteableInput or by guarding
insertTextAt with a type check (e.g., skip
selectionStart/selectionEnd/setSelectionRange and fallback to
appending/replacing value when el.type === 'number'), and ensure you still use
the native setter (the existing nativeSetter.call(...) logic) so React onChange
behavior is preserved; reference isPasteableInput and insertTextAt when making
the change.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: b49e396d-63ae-4826-afde-bd56dc2da067
📒 Files selected for processing (3)
workspaces/mcp-inspector/mcp-inspector-extension/scripts/inject-theme.jsworkspaces/mcp-inspector/mcp-inspector-extension/src/MCPInspectorViewProvider.tsworkspaces/mcp-inspector/mcp-inspector-extension/src/extension.ts
7e5502b to
dc4d631
Compare
Purpose
Fixes wso2/product-integrator#1325
This PR fixes clipboard issues in the MCP inspector extension, where we cannot paste values into the form fields, and use the
Server FIlesandServer Entriescopy buttons to copy items to the clipboard.Screen.Recording.2026-04-30.at.10.53.21.AM.mov
Summary by CodeRabbit