electron-mcp-server

๐Ÿš€ A powerful MCP server for debugging Electron applications with deep Chrome DevTools Protocol integration. Control, monitor, and debug Electron apps through a standardized API.

GitHub Stars

24

User Rating

Not Rated

Favorites

0

Views

29

Forks

8

Issues

2

README
๐Ÿš€ Electron Debug MCP Server

TypeScript
Electron
Chrome DevTools Protocol
Model Context Protocol

A powerful Model Context Protocol (MCP) server for debugging Electron applications with deep Chrome DevTools Protocol integration.

๐Ÿ“‹ Table of Contents
๐Ÿ” Overview

Electron Debug MCP Server provides a bridge between the Model Context Protocol (MCP) and Electron applications, enabling advanced debugging capabilities through a standardized API. It allows you to start, monitor, debug, and control Electron applications programmatically, with deep integration with Chrome DevTools Protocol for advanced debugging features.

โœจ Features
๐Ÿ”„ Core Functionality
  • Process Management
    • ๐Ÿš€ Start Electron applications with debugging enabled
    • ๐Ÿ›‘ Stop running Electron processes
    • ๐Ÿ“‹ List all active Electron processes
    • ๐Ÿ“Š Monitor process status and logs
๐Ÿ” Debugging Capabilities
  • Chrome DevTools Protocol Integration
    • ๐ŸŽฏ Discover and connect to debugging targets
    • ๐Ÿงฉ Execute CDP commands across domains
    • ๐Ÿ“ Evaluate JavaScript in the context of pages
    • ๐Ÿ”„ Reload pages or entire applications
    • โฏ๏ธ Pause and resume JavaScript execution
๐Ÿ“ก Resource Access
  • Structured Resource Endpoints
    • ๐Ÿ“Š Overview of all running Electron processes
    • ๐Ÿ“ Detailed debug information for specific processes
    • ๐Ÿ“œ Access to process logs
    • ๐ŸŽฏ List of available debugging targets
    • ๐Ÿ” Direct CDP access for specific targets
๐Ÿ“ฅ Installation
# Clone the repository
git clone https://github.com/yourusername/electron-mcp-server.git

# Navigate to the project directory
cd electron-mcp-server

# Install dependencies
npm install

# Build the project
npm run build
๐Ÿš€ Usage
Starting the Server
npm run start

This will start the MCP server using stdio for communication.

Connecting to the Server

The MCP server uses stdio for communication, so clients need to connect using the Model Context Protocol. You can:

  • Use an MCP client library
  • Connect directly via stdin/stdout
  • Use a tool that supports MCP
๐Ÿ“ก Resource Endpoints

The server exposes the following resource endpoints:

Resource Description
electron://info Overview of all running Electron processes
electron://process/{id} Detailed debug info for a specific process
electron://logs/{id} Access to logs for a specific process
electron://targets List of all available debug targets
electron://cdp/{processId}/{targetId} CDP access for a specific target
electron://operation/{operation} Operations to control Electron apps
Available Operations
Operation Description
start Start an Electron application
stop Stop a running Electron process
list List all running Electron processes
reload Reload a specific page or application
evaluate Execute JavaScript in a page context
pause Pause JavaScript execution
resume Resume JavaScript execution
๐Ÿ” Chrome DevTools Protocol Integration

The server integrates with Chrome DevTools Protocol to provide deep debugging capabilities:

Listing Available Targets
GET electron://targets

Returns all available debugging targets across all running Electron processes.

Inspecting a Specific Target
GET electron://cdp/{processId}/{targetId}

Provides information about the target and available CDP domains.

Executing CDP Commands
GET electron://cdp/{processId}/{targetId}/{domain}/{command}

Examples:

  • electron://cdp/electron-123456/page-1/Page/reload - Reload the page
  • electron://cdp/electron-123456/page-1/Runtime/evaluate - Evaluate JavaScript
  • electron://cdp/electron-123456/page-1/Debugger/pause - Pause execution
๐Ÿ“ Examples
Starting an Electron App
// Example request (using an MCP client)
const response = await mcpClient.readResource({
  uri: "electron://operation/start",
  content: JSON.stringify({
    appPath: "C:\\path\\to\\your\\electron\\app",
    debugPort: 9222  // Optional debugging port
  })
});
Getting Debug Information
// Get detailed info about a specific app
const processId = "electron-1234567890";
const infoResponse = await mcpClient.readResource({
  uri: `electron://process/${processId}`
});
Executing JavaScript in a Page
// Execute JavaScript in a page
const evalResponse = await mcpClient.readResource({
  uri: `electron://cdp/electron-123456/page-1/Runtime/evaluate`,
  content: JSON.stringify({
    expression: "document.title",
    returnByValue: true
  })
});
๐Ÿ› ๏ธ Development
Project Structure
electron-mcp-server/
โ”œโ”€โ”€ src/
โ”‚   โ”œโ”€โ”€ index.ts         # Main server implementation
โ”‚   โ””โ”€โ”€ types/           # TypeScript type definitions
โ”œโ”€โ”€ build/               # Compiled JavaScript output
โ”œโ”€โ”€ package.json         # Project dependencies and scripts
โ””โ”€โ”€ tsconfig.json        # TypeScript configuration
Building the Project
npm run build
Running in Development Mode
npm run dev
๐Ÿค Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

  1. Fork the repository
  2. Create your feature branch (git checkout -b feature/amazing-feature)
  3. Commit your changes (git commit -m 'Add some amazing feature')
  4. Push to the branch (git push origin feature/amazing-feature)
  5. Open a Pull Request
๐Ÿ“„ License

This project is licensed under the ISC License - see the LICENSE file for details.


Built with โค๏ธ using TypeScript, Electron, and Chrome DevTools Protocol.