claude-code - 💡(How to fix) Fix [FEATURE] VS Code extension: click-to-copy affordance on code blocks in Claude responses [1 participants]

In the Claude Code VS Code extension, code blocks rendered in Claude's responses have no click-to-copy affordance. Copying requires manually selecting the text with the mouse, which is slow and error-prone for multi-line snippets.

TL;DR

Adding a click-to-copy feature or a copy button to code blocks in the Claude Code VS Code extension is likely the most straightforward fix.

Guidance

• Review the extension's code for rendering code blocks to identify where the copy functionality can be integrated, potentially leveraging existing libraries or VS Code APIs for syntax highlighting and user interaction.
• Consider implementing the "Copy button on hover" feature as it is a common pattern in similar applications, providing a clear and intuitive way for users to copy code snippets.
• Investigate if there are any existing VS Code extensions or open-source projects that implement similar functionality, which could serve as a reference or starting point for development.
• Test any implemented solution across different platforms, including macOS, to ensure consistency and compatibility.

Example

No specific code example can be provided without access to the extension's source code, but the implementation might involve adding an event listener to the code block elements for click events and using the clipboard API to copy the contents.

Notes

The exact implementation details may depend on the technologies and frameworks used by the Claude Code VS Code extension, such as React, Vue, or vanilla JavaScript, and how it interacts with the VS Code API.

Recommendation

Apply a workaround by integrating a click-to-copy feature directly into the extension, as this addresses the primary ergonomic gap identified and aligns with user expectations from similar applications.