Browser Automation MCP Server for AI Assistants
Set up a Model Context Protocol (MCP) server that gives your AI assistant direct control over a real Chromium browser via Playwright. Perfect for web scraping, testing, debugging, and automation tasks.
This script installs a Python-based MCP server that provides browser automation tools to AI assistants (like Continue in VSCodium). Your AI can then:
- 🌍 Open URLs and navigate websites
- 🖱️ Click elements, fill forms, and interact with pages
- 📸 Take screenshots of full pages or specific elements
- 🔍 Execute JavaScript and extract data
- 📊 Monitor console logs and network traffic
- ⚡ Wait for dynamic content to load
- 🤖 Automate repetitive browser tasks
- OS: Linux (Debian/Ubuntu), Raspberry Pi (aarch64), or macOS
- Python: 3.8 or higher
- VSCodium: Must be installed first (see ../codium-setup/)
- Python virtual environment
- MCP Python SDK (>=1.1.0)
- Playwright (>=1.47.0)
- Chromium browser (ARM64 build for Raspberry Pi)
- Continue extension for VSCodium
- MCP server script
cd chromium-setup
./mcp-chromium-setup.shThe script is idempotent - safe to run multiple times!
- ✅ Verifies VSCodium is installed
- ✅ Creates Python virtual environment at
~/.local/share/mcp-chromium/ - ✅ Installs MCP SDK and Playwright
- ✅ Downloads Chromium browser
- ✅ Generates MCP server script
- ✅ Configures Continue extension
- ✅ Updates VSCodium settings
Creating virtual environment...
Installing dependencies...
Writing MCP server...
Configuring Continue extension...
MCP Chromium server installed.
Path: ~/.local/share/mcp-chromium/mcp_chromium_server.py
The script automatically configures Continue extension. If you need to manually edit:
Continue Config (~/.continue/config.json):
{
"mcpServers": {
"chromium": {
"command": "/Users/tony/.local/share/mcp-chromium/venv/bin/python",
"args": ["/Users/tony/.local/share/mcp-chromium/mcp_chromium_server.py"],
"env": {}
}
}
}Once installed, your AI assistant has access to these browser automation tools:
Initialize a Chromium browser session.
# Headless mode (no window)
init_browser(headless=True)
# With visible window (for debugging)
init_browser(headless=False)Open a URL and wait for network to be idle.
open_url("https://example.com")Execute JavaScript in the page context.
eval_js("document.title")
eval_js("Array.from(document.querySelectorAll('a')).map(a => a.href)")Take a PNG screenshot, returns base64-encoded image.
# Full page screenshot
screenshot()
# Screenshot of specific element
screenshot("div.main-content")Click an element matching the CSS selector.
click("button#submit")
click("a.nav-link")Type text into an input element.
type("input#username", "myuser")
type("textarea", "Hello world", delay_ms=50)Wait for an element to appear on the page.
wait_for("div.loaded")
wait_for("img.thumbnail", timeout_ms=5000)Retrieve collected browser console messages.
get_console_logs()
# Returns: [{"type": "log", "text": "...", "location": {...}}, ...]Retrieve collected network requests and responses.
get_network_events()
# Returns: [{"type": "request", "method": "GET", "url": "...", ...}, ...]Start VSCodium and open the Continue sidebar. Example prompts:
Navigate and Screenshot:
Use the chromium MCP server to:
1. Open https://example.com
2. Take a screenshot
3. Show me the title
Form Interaction:
Use chromium tools to:
1. Open https://example.com/search
2. Type "MCP servers" in the search box with selector "input#q"
3. Click the search button
4. Wait for results to load
5. Screenshot the results
Data Extraction:
Use chromium to:
1. Open https://news.ycombinator.com
2. Evaluate this JS: document.querySelectorAll('.titleline > a').forEach(a => console.log(a.textContent))
3. Get console logs
Debugging:
Open https://myapp.local in chromium with headless=False
Then execute: console.log(window.myAppState)
Get console logs and show me the state
Solution: Restart VSCodium completely.
# Kill all VSCodium processes
pkill -9 codium
# Restart VSCodium
codiumSolution: Install VSCodium first.
cd ../codium-setup
./codium-setup.shSolution: Ensure the script and MCP server are executable.
chmod +x mcp-chromium-setup.sh
chmod +x ~/.local/share/mcp-chromium/mcp_chromium_server.pySolution: Install manually and re-run.
source ~/.local/share/mcp-chromium/venv/bin/activate
python -m playwright install chromium
deactivateSolution: Check logs in the Continue output panel or terminal.
# Run server manually to see errors
source ~/.local/share/mcp-chromium/venv/bin/activate
python ~/.local/share/mcp-chromium/mcp_chromium_server.pySolution: Use 127.0.0.1 instead of localhost in URLs, or configure network settings.
~/.local/share/mcp-chromium/
├── venv/ # Python virtual environment
├── logs/ # Log files (if configured)
└── mcp_chromium_server.py # MCP server script
~/.continue/
└── config.json # Continue MCP configuration
~/.mcp/
└── servers.json # Generic MCP registry (for other clients)
# Activate virtual environment
source ~/.local/share/mcp-chromium/venv/bin/activate
# Update dependencies
pip install --upgrade mcp playwright
# Reinstall Chromium
python -m playwright install chromium
deactivate# Remove MCP server
rm -rf ~/.local/share/mcp-chromium
# Remove Continue configuration (manual edit)
# Edit ~/.continue/config.json and remove "chromium" from mcpServers
# Remove Continue extension (optional)
codium --uninstall-extension continue.continueEdit the server script to add new tools:
nano ~/.local/share/mcp-chromium/mcp_chromium_server.pyAdd new @server.tool() functions following the existing patterns.
Run server with visible browser:
# In Continue, use:
init_browser(headless=False)Watch browser actions in real-time!
# Clear previous events
get_network_events()
# Navigate and perform actions
open_url("https://example.com")
click("button#load-more")
# Get all requests/responses since last clear
events = get_network_events()# Open page
open_url("https://example.com")
# Login
type("input#username", "user")
type("input#password", "pass")
click("button#login")
wait_for("div.dashboard")
# Navigate to section
click("a[href='/settings']")
wait_for("form#settings")
# Take screenshot
screenshot()- Runs locally: All browser automation happens on your machine
- No external calls: MCP communicates via stdio (standard in/out)
- Sandboxed: Chromium runs in its own process
- API keys: Never expose credentials through browser automation
Open https://quotes.toscrape.com
Evaluate: Array.from(document.querySelectorAll('.quote')).map(q => ({
text: q.querySelector('.text').textContent,
author: q.querySelector('.author').textContent
}))
Get console logs
Open http://localhost:3000
Type "admin" in input#username
Type "password" in input#password
Click button[type="submit"]
Wait for div.dashboard with timeout 5000ms
Screenshot div.dashboard
Evaluate: document.querySelector('.user-name').textContent
Clear network events
Open https://example.com
Wait 3 seconds
Get network events
Show me all requests with status >= 400
Improvements? Bug fixes? PRs welcome!
Part of the Modular Misfits Scripts Collection