Summary
The "Copy Config" button (copies full MCP JSON config) and the copy icon button (copies the raw API key) on the API Keys page (/api-keys) do not reliably copy to clipboard. Clicking them appears to do nothing — no content lands on the clipboard and no error is shown to the user.
Context
Both copy actions use navigator.clipboard.writeText() exclusively, with errors caught silently via console.error only. The Clipboard API can fail in several legitimate scenarios (modal focus trap, permission denied, non-secure context), and there is no fallback mechanism or user-visible error feedback.
Location: src/frontend/src/views/ApiKeys.vue
copyMcpConfig() — line 542
copyApiKey() — line 530
Root cause:
navigator.clipboard.writeText() can throw when the document does not have focus (e.g., inside a modal overlay), when clipboard permission is denied, or on non-HTTPS non-localhost contexts
- No
execCommand('copy') fallback
- Error is swallowed silently — user sees no feedback that copy failed
- The "Copied!" visual state may flip even on failure (before the async rejection)
Steps to Reproduce
- Go to
/api-keys
- Create a new key or trigger the key display modal
- Click Copy Config or the copy icon button next to the key
- Attempt to paste — clipboard is empty or still holds previous content
Acceptance Criteria
Technical Notes
Add a shared copyToClipboard(text) utility (e.g., in src/frontend/src/utils/clipboard.js) that:
- Tries
navigator.clipboard.writeText(text)
- Falls back to
document.execCommand('copy') via a temporary off-screen <textarea>
- Returns a boolean indicating success
Both copyMcpConfig and copyApiKey should use this utility and surface an error toast on false.
Summary
The "Copy Config" button (copies full MCP JSON config) and the copy icon button (copies the raw API key) on the API Keys page (
/api-keys) do not reliably copy to clipboard. Clicking them appears to do nothing — no content lands on the clipboard and no error is shown to the user.Context
Both copy actions use
navigator.clipboard.writeText()exclusively, with errors caught silently viaconsole.erroronly. The Clipboard API can fail in several legitimate scenarios (modal focus trap, permission denied, non-secure context), and there is no fallback mechanism or user-visible error feedback.Location:
src/frontend/src/views/ApiKeys.vuecopyMcpConfig()— line 542copyApiKey()— line 530Root cause:
navigator.clipboard.writeText()can throw when the document does not have focus (e.g., inside a modal overlay), when clipboard permission is denied, or on non-HTTPS non-localhost contextsexecCommand('copy')fallbackSteps to Reproduce
/api-keysAcceptance Criteria
execCommand('copy')via a temporary textarea) is attemptedTechnical Notes
Add a shared
copyToClipboard(text)utility (e.g., insrc/frontend/src/utils/clipboard.js) that:navigator.clipboard.writeText(text)document.execCommand('copy')via a temporary off-screen<textarea>Both
copyMcpConfigandcopyApiKeyshould use this utility and surface an error toast onfalse.