This commit is contained in:
Josh at WLTechBlog
2025-10-19 10:07:47 -05:00
parent 1b01b1e857
commit 4f64dc879b
3 changed files with 740 additions and 40 deletions

View File

@@ -1,29 +1,77 @@
# Cremote MCP Tools - LLM Usage Guide
Cremote MCP server provides 66 web automation and accessibility testing tools. All tools accept optional `tab` (tab ID) and `timeout` (seconds, default varies) parameters unless otherwise noted.
Cremote MCP server provides 67 web automation and accessibility testing tools. All tools accept optional `tab` (tab ID) and `timeout` (seconds, default varies) parameters unless otherwise noted.
## 🚀 NEW: Optimized Workflows (Reduce Tool Calls by 50-70%)
### Key Optimizations
1. **web_navigate_cremotemcp** - Now supports cache clearing and data extraction in a single call
2. **Read-only tools** - Many tools now accept optional `url` and `clear_cache` parameters to navigate first
3. **web_accessibility_full_audit_cremotemcp** - NEW master tool: navigate + clear cache + full accessibility audit in one call
### Before vs After Examples
**Before (3 tool calls):**
```
web_navigate_cremotemcp: {url: "https://example.com"}
web_clear_cache_cremotemcp: {}
web_extract_cremotemcp: {type: "source"}
```
**After (1 tool call):**
```
web_navigate_cremotemcp: {
url: "https://example.com",
clear_cache: true,
extract: "source"
}
```
**Before (3 tool calls for accessibility):**
```
web_navigate_cremotemcp: {url: "https://example.com"}
web_clear_cache_cremotemcp: {}
web_page_accessibility_report_cremotemcp: {tests: ["all"]}
```
**After (1 tool call):**
```
web_accessibility_full_audit_cremotemcp: {
url: "https://example.com",
clear_cache: true,
tests: ["all"]
}
```
---
## Tool Categories
**Core Automation (12):** navigate, interact, extract, screenshot, tabs, iframe, console, file operations
**Element Inspection (2):** check state, get attributes
**Data Extraction (4):** multiple selectors, links, tables, text patterns
**Forms (3):** analyze, bulk fill, batch interact
**Page Intelligence (4):** page info, viewport, performance, content check
**Screenshots (3):** basic, element, enhanced with metadata
**File Management (3):** upload, download, bulk operations
**Cache Control (5):** enable/disable/clear cache, cookies, storage, all site data
**Mouse/Keyboard (11):** drag-drop (3 variants), right/double/middle/hover click, mouse move, scroll wheel, key combos, special keys, modifier clicks
**Accessibility Tree (3):** full tree, partial tree, query by role/name
**Accessibility Testing (18):** axe-core, contrast checks, keyboard nav, forms, WCAG compliance, media validation, OCR, animations, cross-page consistency, zoom/reflow tests
**Core Automation (12):** navigate, interact, extract, screenshot, tabs, iframe, console, file operations
**Element Inspection (2):** check state, get attributes
**Data Extraction (4):** multiple selectors, links, tables, text patterns
**Forms (3):** analyze, bulk fill, batch interact
**Page Intelligence (4):** page info, viewport, performance, content check
**Screenshots (3):** basic, element, enhanced with metadata
**File Management (3):** upload, download, bulk operations
**Cache Control (5):** enable/disable/clear cache, cookies, storage, all site data
**Mouse/Keyboard (11):** drag-drop (3 variants), right/double/middle/hover click, mouse move, scroll wheel, key combos, special keys, modifier clicks
**Accessibility Tree (3):** full tree, partial tree, query by role/name
**Accessibility Testing (19):** axe-core, contrast checks, keyboard nav, forms, WCAG compliance, media validation, OCR, animations, cross-page consistency, zoom/reflow tests, **NEW: full audit with navigation**
---
## Core Automation Tools
### web_navigate_cremotemcp
Navigate to URL, optionally take screenshot.
Navigate to URL with optional cache clearing, screenshot, and data extraction in a single call.
- `url` (required): URL to navigate to
- `clear_cache` (optional): boolean, clear cache before navigation (default: false)
- `screenshot` (optional): boolean, take screenshot after navigation
- `extract` (optional): "source", "element", or "javascript" - extract data after navigation
- `extract_selector` (optional): CSS selector for element extraction (required when extract="element")
- `extract_code` (optional): JavaScript code to execute (required when extract="javascript")
- Default timeout: 5s
### web_interact_cremotemcp
@@ -35,10 +83,12 @@ Interact with elements: click, fill, submit, upload, select.
- Default timeout: 5s
### web_extract_cremotemcp
Extract page data: source HTML, element content, or execute JavaScript.
Extract page data: source HTML, element content, or execute JavaScript. Optionally navigate to URL first with cache clearing.
- `type` (required): "source", "element", "javascript"
- `selector` (optional): required for "element" type
- `code` (optional): required for "javascript" type
- `url` (optional): navigate to URL before extraction
- `clear_cache` (optional): boolean, clear cache before operation (default: false)
- Default timeout: 5s
### web_screenshot_cremotemcp
@@ -100,17 +150,21 @@ File management: cleanup, list, get info.
## Element Inspection Tools
### web_element_check_cremotemcp
Check element state: exists, visible, enabled, focused, selected.
Check element state: exists, visible, enabled, focused, selected. Optionally navigate to URL first with cache clearing.
- `selector` (required): CSS selector
- `check_type` (optional): "exists", "visible", "enabled", "focused", "selected", "all" (default: "exists")
- `url` (optional): navigate to URL before checking element
- `clear_cache` (optional): boolean, clear cache before operation (default: false)
- Returns: JSON with boolean values for each check + count
- Default timeout: 5s
### web_element_attributes_cremotemcp
Get element attributes, properties, computed styles.
Get element attributes, properties, computed styles. Optionally navigate to URL first with cache clearing.
- `selector` (required): CSS selector
- `attributes` (optional): "all" or comma-separated list (default: "all")
- Prefixes: none=HTML attr, `style_`=computed CSS, `prop_`=JS property
- `url` (optional): navigate to URL before getting attributes
- `clear_cache` (optional): boolean, clear cache before operation (default: false)
- Default timeout: 5s
---
@@ -175,7 +229,9 @@ Batch interactions in one call.
## Page Intelligence Tools
### web_page_info_cremotemcp
Get page metadata and state.
Get page metadata and state. Optionally navigate to URL first with cache clearing.
- `url` (optional): navigate to URL before getting page info
- `clear_cache` (optional): boolean, clear cache before operation (default: false)
- Returns: {title, url, loading_state, ready_state, domain, protocol, charset, cookie_enabled, online_status}
- Default timeout: 5s
@@ -402,6 +458,17 @@ Comprehensive page assessment combining axe-core, contrast, keyboard, forms. Tok
- Returns: {compliance_status, overall_score, legal_risk, issues by severity, contrast_summary, keyboard_summary, form_summary, estimated_remediation_hours}
- Default timeout: 30s
### web_accessibility_full_audit_cremotemcp ⭐ NEW
**Master accessibility tool**: Navigate to URL, clear cache, and run comprehensive accessibility assessment in a single call. Combines navigation, cache clearing, and all accessibility tests. **Automatically injects axe-core if not already loaded.**
- `url` (required): URL to navigate to and test
- `clear_cache` (optional): boolean, clear cache before navigation (default: true)
- `tests` (optional): array of test types (e.g., ["wcag", "contrast", "keyboard", "forms"]) or ["all"]
- `standard` (optional): WCAG standard (default: "WCAG21AA")
- `include_screenshots` (optional): boolean (default: false)
- Returns: {compliance_status, overall_score, legal_risk, issues by severity, contrast_summary, keyboard_summary, form_summary, estimated_remediation_hours}
- Default timeout: 30s
- **Use this tool for single-call accessibility audits with navigation**
### web_media_validation_cremotemcp
Validate video/audio for WCAG compliance: captions, audio descriptions, transcripts, controls, autoplay.
- Returns: {videos[], audios[], embedded_players[], transcript_links[], critical_violations, total_violations, warnings}
@@ -522,12 +589,76 @@ web_extract_links_cremotemcp: {container_selector: "nav", href_pattern: "https:/
## Best Practices
1. **Use specific CSS selectors**: Prefer `input[name='email']` over `input`
2. **Batch operations**: Use `web_interact_multiple_cremotemcp` or `web_form_fill_bulk_cremotemcp` for efficiency
3. **Accessibility testing**: Use `web_page_accessibility_report_cremotemcp` for comprehensive assessment with minimal tokens
4. **File uploads**: Use `web_interact_cremotemcp` with action="upload" - auto-handles host-to-container transfer
5. **Timeouts**: Increase for slow pages or complex operations
6. **Screenshots**: Use `web_screenshot_enhanced_cremotemcp` for metadata, `web_screenshot_element_cremotemcp` for specific elements
1. **Use optimized workflows**: Combine navigation, cache clearing, and operations in single calls to reduce tool usage by 50-70%
2. **Use specific CSS selectors**: Prefer `input[name='email']` over `input`
3. **Batch operations**: Use `web_interact_multiple_cremotemcp` or `web_form_fill_bulk_cremotemcp` for efficiency
4. **Accessibility testing**: Use `web_accessibility_full_audit_cremotemcp` for single-call audits with navigation, or `web_page_accessibility_report_cremotemcp` for current page assessment
5. **File uploads**: Use `web_interact_cremotemcp` with action="upload" - auto-handles host-to-container transfer
6. **Timeouts**: Increase for slow pages or complex operations
7. **Screenshots**: Use `web_screenshot_enhanced_cremotemcp` for metadata, `web_screenshot_element_cremotemcp` for specific elements
---
## Optimized Workflow Examples
### Single-Call Accessibility Audit
```
# Before (3 calls):
web_navigate_cremotemcp: {url: "https://example.com"}
web_clear_cache_cremotemcp: {}
web_page_accessibility_report_cremotemcp: {tests: ["all"]}
# After (1 call):
web_accessibility_full_audit_cremotemcp: {
url: "https://example.com",
clear_cache: true,
tests: ["all"],
standard: "WCAG21AA"
}
```
### Navigate and Extract
```
# Before (2 calls):
web_navigate_cremotemcp: {url: "https://example.com"}
web_extract_cremotemcp: {type: "source"}
# After (1 call):
web_navigate_cremotemcp: {
url: "https://example.com",
extract: "source"
}
```
### Navigate, Clear Cache, and Check Element
```
# Before (3 calls):
web_navigate_cremotemcp: {url: "https://example.com"}
web_clear_cache_cremotemcp: {}
web_element_check_cremotemcp: {selector: "#login-button", check_type: "visible"}
# After (1 call):
web_element_check_cremotemcp: {
url: "https://example.com",
clear_cache: true,
selector: "#login-button",
check_type: "visible"
}
```
### Navigate, Clear Cache, and Get Page Info
```
# Before (3 calls):
web_navigate_cremotemcp: {url: "https://example.com"}
web_clear_cache_cremotemcp: {}
web_page_info_cremotemcp: {}
# After (1 call):
web_page_info_cremotemcp: {
url: "https://example.com",
clear_cache: true
}
```
---