API Reference

API Reference

Configuration File

devmirror.config.json

The configuration file supports these options:

{
  "url": "string",            // Target URL (optional, auto-detected)
  "outputDir": "string",      // Log output directory (default: "./devmirror-logs")
  "chromePath": "string",     // Path to Chrome executable (optional)
  "mode": "string",           // "cdp" or "cef" (default: "cdp")
  "cefPort": "number",        // CEF debug port (required for CEF mode)
  "autoDetectPort": "boolean", // Auto-detect dev server port
  "autoOpenBrowser": "boolean", // Open browser in CEF mode (v0.4.52+)
  "throttle": {
    "maxPerSecond": "number",  // Max messages per second (default: 100)
    "suppressAfter": "number"  // Suppress after N repeats (default: 100)
  }
}

VS Code Commands

Commands available via Command Palette (Cmd/Ctrl+Shift+P):

Command	Description
DevMirror: Setup Project	Create initial configuration
DevMirror: Start Capture	Start capturing manually
DevMirror: Stop Capture	Stop current capture session
DevMirror: Show Logs	Open logs directory
DevMirror: Open Settings	Open VS Code settings
DevMirror: Refresh Scripts	Reload package.json scripts tree

Note: Additional commands are available via context menus in the DevMirror Scripts panel.

Tree View Actions

Actions available in DevMirror Scripts panel:

Icon	Action	Description
+	Add Mirror Script	Quick setup with defaults
⚙️	Setup Wizard	Advanced configuration
↩	Undo Changes	Revert script modifications
▶	Run Script	Execute the script
🔄	Refresh	Reload script list

Script Modifications

Generated Script Patterns

DevMirror generates scripts following these patterns:

Standard Mode

"script:mirror": "concurrently \"npx devmirror-cli\" \"npm run script\""

Background Mode (for interactive CLIs)

"script:mirror": "node scripts/devmirror-background.js & npm run script"

The background script is created automatically when needed.

CLI Tool

DevMirror includes a CLI tool (devmirror-cli) that is invoked by the generated scripts. The CLI:

• Reads the devmirror.config.json file
• Connects to the target using CDP or CEF mode
• Captures console output to log files
• Communicates with the VS Code extension via HTTP

Note: The CLI is primarily invoked through generated scripts, not directly.

Log File Format

File Naming

YYYY-MM-DD-HHMMSS.log
Example: 2025-09-22-143052.log

Log Entry Format

[YYMMDD'T'HH:MM:SS.ms] [LEVEL] Message
[250922T14:30:52.12] [LOG] Application started
[250922T14:30:52.13] [ERROR] Error message
[250922T14:30:52.14] [NETWORK:ERROR] Connection failed
    URL: http://example.com

Log Levels

• LOG, ERROR, WARN, INFO, DEBUG - Console methods
• NETWORK:ERROR - Network failures
• BROWSER:WARNING/ERROR - Browser events
• LIFECYCLE - Page load events

Special Files

• current.log - Symlink to active log file
• .devmirror.lock - Lock file for single instance

Configuration Examples

Basic Configuration

{
  "outputDir": "./devmirror-logs",
  "mode": "cdp"
}

CEF Configuration

{
  "mode": "cef",
  "cefPort": 8555,
  "outputDir": "./logs",
  "autoOpenBrowser": true
}

Custom Chrome Path

{
  "chromePath": "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome",
  "outputDir": "./devmirror-logs"
}

Package.json Integration

DevMirror adds scripts with :mirror suffix:

{
  "scripts": {
    "dev": "vite",
    "dev:mirror": "concurrently \"npx devmirror-cli\" \"npm run dev\""
  }
}

For interactive CLIs, it may create a background script in scripts/ folder.

VS Code Settings

Available in VS Code settings (Preferences → Settings → Search for "devmirror"):

Setting	Description	Default
devmirror.chromePath	Path to Chrome executable	Auto-detect

Note: Most settings are managed through the devmirror.config.json file.

Status Bar

DevMirror shows status in VS Code's status bar:

• Hidden when idle
• Shows 🟢 DevMirror | package-name | X logs | duration when active
• Click to open logs directory

Supported Browsers

Browser	CDP Port	Support
Chrome	9222	Full
Chromium	9222	Full
Edge	9222	Full
Brave	9222	Full
Opera	9222	Partial
Vivaldi	9222	Partial

Debug Protocols

Protocol	Default Port	Status
CDP	9222	✅ Supported
CEF	8555	✅ Supported
Node Inspector	9229	🔄 Planned

Version History

Version	Key Changes
0.4.65	Browser auto-refresh on CEF reconnection
0.4.64	Auto-navigation to CEF DevTools
0.4.63	Fixed autoOpenBrowser implementation
0.4.62	autoOpenBrowser setting in configs
0.4.61	Fixed CEF reconnection context tracking
0.4.60	CEF disconnect/reconnect logging
0.4.59	Fixed extension activation in all windows
0.4.58	Fixed status bar in correct window
0.4.57	Fixed recursive folding loop
0.4.56	Working log folding
0.4.51	Fixed reconnect loop, added autoOpenBrowser
0.4.50	Setup Wizard, undo functionality
0.4.49	WebviewView implementation
0.4.48	Wizard panel closing behavior
0.4.47	Quick add button (+)

Known Limitations

1. Node.js debugging not yet supported
2. Advanced filtering options not yet implemented
3. WebSocket API for external tools not available
4. Backup/restore system limited to package.json changes via undo button

Future Features (Planned)

• Node.js Inspector support
• Advanced log filtering
• Pattern-based exclusions
• Source file filtering
• Performance tuning options
• WebSocket event API
• Programmatic extension API

---

For issues or feature requests, visit: https://github.com/ivg-design/devMirror/issues