Vscode Edit Links
Overview
When running the preview command in VS Code (local or remote), edit links in the documentation site will automatically open files in VS Code for editing instead of navigating to an external forge.
How It Works
-
Edit URL Detection: The
VSCodeDetectoridentifies when running in local preview mode (repository name is “local”) and generates special/_edit/<filepath>URLs instead of forge URLs. -
HTTP Handler: The preview server registers a
/_edit/endpoint that:- Extracts the file path from the URL
- Validates the path (prevents directory traversal attacks)
- Executes
code <filepath>to open the file in VS Code - Redirects back to the page you were viewing
-
Cross-Environment Support: Works in both:
- Local VS Code: Opens files in your local editor
- VS Code Remote/Dev Containers: The
codecommand works seamlessly in remote sessions
Usage
Simply run the preview command:
Then navigate to the documentation site at http://localhost:1316. All “Edit this page” links will now open files directly in VS Code.
Implementation Details
Components
-
VSCodeDetector (
internal/hugo/editlink/vscode_detector.go)- Implements the
ForgeDetectorinterface - Activated only when repository name is “local”
- Returns special “vscode” forge type
- Implements the
-
StandardEditURLBuilder (
internal/hugo/editlink/url_builder.go)- Handles “vscode” forge type
- Generates
/_edit/<filepath>URLs
-
HTTP Handler (
internal/daemon/vscode_edit_handler.go)- Registered at
/_edit/endpoint - Validates paths against docs directory
- Executes
codecommand with timeout - Redirects to referer
- Registered at
Security
- Path Validation: Ensures requested paths are within the docs directory
- Path Traversal Prevention: Uses
filepath.Clean()and prefix checking - Command Timeout: 5-second timeout on
codecommand execution - Context Awareness: Uses request context for cancellation
Testing
Tests verify:
- VS Code detector activates only for “local” repositories
- URL builder generates correct
/_edit/URLs - Non-local repositories continue using forge URLs
Run tests:
Example Flow
- User navigates to
http://localhost:1316/how-to/release-process/ - User clicks “Edit this page” link:
http://localhost:1316/_edit/how-to/release-process.md - Server receives request at
/_edit/handler - Handler validates path:
/workspaces/docbuilder/docs/how-to/release-process.md - Handler executes:
code /workspaces/docbuilder/docs/how-to/release-process.md - VS Code opens the file for editing
- Browser redirects back to
http://localhost:1316/how-to/release-process/ - User edits file in VS Code
- File watcher detects change and rebuilds site automatically
Troubleshooting
Edit Links Not Opening Files
Symptom: Clicking edit links logs success but files don’t open in VS Code.
Cause: The VSCODE_IPC_HOOK_CLI environment variable is not available. This typically happens when:
- DocBuilder is started via a system startup script (e.g.,
/etc/bash.bashrc) - DocBuilder starts before VS Code completes its initialization
- The process doesn’t inherit VS Code’s environment variables
Solution:
-
Manual Start: Run DocBuilder from a VS Code terminal instead of auto-start scripts:
-
Delayed Auto-Start: If using auto-start scripts, add a delay to ensure VS Code is fully initialized:
-
Check Environment: Verify the IPC socket is available:
Note: This is a preview-mode development feature only. Daemon mode (production) uses forge web editors and is not affected by this limitation.
Future Enhancements
Potential improvements:
- Add
--edit-line <number>support to open files at specific lines - Support other editors via configuration (
vim,emacs, etc.) - Add visual feedback in the UI when file opens successfully
- Cache file path mappings for faster lookups
- Detect VS Code readiness before starting the server
[vscode-edit-links](https://docs.home.luguber.info/_uid/4b36f3b0-fb0f-4c79-9ef2-1140347fdbf7/)