Vibe Eyes Client MCP Server

What is Vibe Eyes Client?

Vibe Eyes Client is a lightweight JavaScript library that integrates browser games with the Vibe Eyes MCP debug server for real-time debugging, visualization, and analysis. It captures canvas screenshots, console logs, and errors, and displays SVG visualizations sent back from the server, allowing an AI to see the game it is working on in real time.

How to use Vibe Eyes Client?

Install via npm (npm install vibe-eyes-client) or include the <script> tag from unpkg. Call initializeVibeEyes() with optional configuration to begin auto-capturing. Use the returned client instance to enable an SVG debug window with client.enableSvgDisplay(), toggle it, or stop/restart the capture loop. Configuration options include server URL, capture delay, canvas ID, and debug window position/size.

Key features of Vibe Eyes Client

• Automatic canvas screenshot capture and streaming
• Console log and error collection with timestamps
• Global error and unhandled promise rejection handling
• SVG visualization display in a dedicated debug window
• Complete debug statistics including SVG size measurements
• Minimal performance impact on games
• Graceful connection recovery and error handling
• Multiple build formats (UMD, ESM, IIFE)

Use cases of Vibe Eyes Client

• Debugging browser games in real time with an AI assistant
• Providing visual feedback to an AI coding agent while it modifies game code
• Monitoring game state changes through live SVG visualizations
• Logging and analyzing runtime errors and console output during development