# Web Automation MCP Server

An MCP (Model Context Protocol) server that enables Claude Code CLI to interact with Cloud Desktop, ChatGPT, and Gemini web interfaces through browser automation.

## Features

- **Multi-Service Support**: Interact with Cloud Desktop, ChatGPT, and Gemini
- **Browser Automation**: Uses Playwright for reliable web automation
- **Session Persistence**: Maintains browser sessions across requests
- **Response Extraction**: Automatically extracts and returns responses
- **Conversation Management**: Clear conversation history when needed

## Installation

1. Clone the repository:
```bash
cd ~/web-automation-mcp
```

2. Install dependencies:
```bash
npm install
```

3. Build the project:
```bash
npm run build
```

## Configuration

Add the server to your Claude MCP settings (`~/Library/Application Support/Claude/claude_desktop_config.json`):

```json
{
  "mcpServers": {
    "web-automation": {
      "command": "node",
      "args": ["/Users/YOUR_USERNAME/web-automation-mcp/dist/index.js"]
    }
  }
}
```

## Usage

### Natural Language Support

The MCP server now supports natural language queries through the `web_automation_query` tool:

```
# Ask ChatGPT a question
"Ask ChatGPT: What is quantum computing?"

# Send to Gemini
"Send to Gemini: Explain machine learning"

# Clear conversation
"Clear ChatGPT conversation"

# Get latest response
"Get the latest response from Gemini"

# Browser control
"Initialize browser in visible mode"
"Close browser"
```

### Available Tools

1. **web_automation_query** - Process natural language queries
   - `query`: string - Natural language description of what you want to do

2. **initialize_browser** - Initialize the browser
   - `headless`: boolean (default: false) - Run in headless mode

3. **send_to_service** - Send input to a service and get response
   - `service`: "clouddesktop" | "chatgpt" | "gemini"
   - `content`: string - The message to send

4. **get_latest_response** - Get the latest response from a service
   - `service`: "clouddesktop" | "chatgpt" | "gemini"

5. **clear_conversation** - Clear conversation history
   - `service`: "clouddesktop" | "chatgpt" | "gemini"

6. **cleanup_browser** - Close all browser windows

### Example Usage in Claude Code

Natural language examples:
```
# Ask ChatGPT
Use web_automation_query with query: "Ask ChatGPT about the history of computing"

# Send to Gemini
Use web_automation_query with query: "Send to Gemini: write a Python function to sort a list"

# Clear conversation
Use web_automation_query with query: "Clear ChatGPT conversation"
```

Direct tool usage:
```
# Initialize browser (visible mode)
Use the initialize_browser tool with headless: false

# Send a message to ChatGPT
Use the send_to_service tool with service: "chatgpt" and content: "What is the capital of France?"

# Clean up when done
Use the cleanup_browser tool
```

## Important Notes

1. **Manual Login Required**: You must manually log in to each service in the browser window the first time
2. **Service URLs**: Update the URLs in the handler files if they change:
   - `src/handlers/cloudDesktop.ts` - Update Cloud Desktop URL
   - `src/handlers/chatgpt.ts` - ChatGPT URL
   - `src/handlers/gemini.ts` - Gemini URL

3. **Selectors**: The CSS selectors in handlers may need updates if the services change their UI

## Development

To run in development mode:
```bash
npm run dev
```

To modify service handlers, edit the files in `src/handlers/`.

## Troubleshooting

- **Login Required Error**: Open the browser in non-headless mode and log in manually
- **Selector Not Found**: The service UI may have changed - update selectors in the handler
- **Timeout Errors**: Increase timeout values in the handlers for slower connections

## License

MIT