Website Snapshot
About
A MCP server that provides comprehensive website snapshot capabilities using Playwright. This server enables LLMs to capture and analyze web pages through structured accessibility snapshots, network monitoring, and console message collection.
Details
- License
- MIT
Explore
- 🚀 Fast and lightweight: Uses Playwright's accessibility tree for efficient snapshots
- 🎯 LLM-optimized: Structured data output designed specifically for AI consumption
- 📊 Comprehensive monitoring: Captures network requests, responses, and console messages
- 🔍 Element references: Adds unique identifiers to interactive elements for precise targeting
- 🛡️ Production-ready: Built-in error handling, resource limits, and timeout management
- ✅ Well-tested: Comprehensive test suite with code coverage
Setting up with Highlight
This MCP is not yet compatible with Highlight’s one-click setup. However, you can still use it with Highlight by following these steps:
- Download and install Highlight from highlightai.com/download
- Navigate to the plugins tab and select "Add Custom Plugin"
-
Configure the plugin with the settings below
Plugin Name
Website SnapshotCommand (node, npx, python, etc.)Please refer to the README for specific instructions on how to obtain API keys or other required environment variables.
- Enable "Start Automatically" if you want the plugin to start when Highlight launches
From the repository
- Python 3.11 or newer
- VS Code, Cursor, Windsurf, Claude Desktop or any other MCP client
You can install the MCP Web Snapshot server using the VS Code CLI:
Go to Cursor Settings → MCP → Add new MCP Server. Name to your liking, use command type with the command uv and args ["--directory", "/path/to/mcp-web-snapshot", "run", "python", "src/server.py"].
{
"mcpServers": {
"mcp-web-snapshot": {
"command": "uv",
"args": [
"--directory",
"/path/to/mcp-web-snapshot",
"run",
"python",
"src/server.py"
]
}
}
}
1. Clone this repository:
git clone https://github.com/your-username/mcp-web-snapshot.git
cd mcp-web-snapshot
2. Install dependencies using uv:
uv sync
3. Install Playwright browsers:
uv run playwright install
4. Run the server:
uv run python src/server.py
Generate test scenarios based on captured interactions:
"Snapshot https://myapp.com/checkout and help me create comprehensive test cases that cover all the interactive elements and user workflows."
```
Claude Desktop / Cursor
Paste into your MCP client config file to install this server.
{
"mcpServers": {
"website snapshot": {
"mcp-web-snapshot": {
"command": "uv",
"args": [
"--directory",
"/path/to/mcp-web-snapshot",
"run",
"python",
"src/server.py"
]
}
}
}
}McpServers
{
"mcp-web-snapshot": {
"command": "uv",
"args": [
"--directory",
"/path/to/mcp-web-snapshot",
"run",
"python",
"src/server.py"
]
}
}MCP Web Snapshot
A Model Context Protocol (MCP) server that provides comprehensive website snapshot capabilities using Playwright. This server enables LLMs to capture and analyze web pages through structured accessibility snapshots, network monitoring, and console message collection.
Key Features
- 🚀 Fast and lightweight: Uses Playwright's accessibility tree for efficient snapshots
- 🎯 LLM-optimized: Structured data output designed specifically for AI consumption
- 📊 Comprehensive monitoring: Captures network requests, responses, and console messages
- 🔍 Element references: Adds unique identifiers to interactive elements for precise targeting
- 🛡️ Production-ready: Built-in error handling, resource limits, and timeout management
- ✅ Well-tested: Comprehensive test suite with code coverage
Requirements
- Python 3.11 or newer
- VS Code, Cursor, Windsurf, Claude Desktop or any other MCP client
Getting Started
First, install the MCP Web Snapshot server with your client. A typical configuration looks like this:
{
"mcpServers": {
"mcp-web-snapshot": {
"command": "uv",
"args": [
"--directory",
"/path/to/mcp-web-snapshot",
"run",
"python",
"src/server.py"
]
}
}
}
Install in VS Code
You can install the MCP Web Snapshot server using the VS Code CLI:
```bash
Sign in to leave a review
Use Google, GitHub, or an email account so ratings stay tied to real people.
No reviews posted yet.
