Agent skill
tabz-browser
Browser automation via 70 tabz MCP tools. Use when taking screenshots, filling forms, debugging network requests, testing responsive design, or using text-to-speech notifications.
Install this agent skill to your Project
npx add-skill https://github.com/GGPrompts/TabzChrome/tree/main/.claude/skills/tabz-browser
SKILL.md
TabzChrome Browser Automation
Control Chrome via MCP tools for screenshots, interaction, debugging, and notifications.
Quick Start
Use mcp-cli to discover and call tools:
# Get tool schema (REQUIRED before calling)
mcp-cli info tabz/tabz_screenshot
# Call tool
mcp-cli call tabz/tabz_screenshot '{}'
Core Workflows
Screenshot a Page
# Get current tab info
mcp-cli call tabz/tabz_get_page_info '{}'
# Take screenshot
mcp-cli call tabz/tabz_screenshot '{}'
# Returns file path - use Read tool to view
Debug Network/API Issues
# 1. Enable capture BEFORE triggering action
mcp-cli call tabz/tabz_enable_network_capture '{}'
# 2. Trigger the action on page
# 3. Get failed requests (status >= 400)
mcp-cli call tabz/tabz_get_network_requests '{"statusMin": 400}'
# 4. Check console for JS errors
mcp-cli call tabz/tabz_get_console_logs '{"level": "error"}'
Test Responsive Design
# Emulate device
mcp-cli call tabz/tabz_emulate_device '{"device": "iPhone 14"}'
# Take screenshot
mcp-cli call tabz/tabz_screenshot '{}'
# Clear emulation
mcp-cli call tabz/tabz_emulate_clear '{}'
Fill and Submit Form
mcp-cli call tabz/tabz_fill '{"selector": "#email", "value": "test@example.com"}'
mcp-cli call tabz/tabz_click '{"selector": "button[type=submit]"}'
Notify User (TTS)
mcp-cli call tabz/tabz_speak '{"text": "Task complete"}'
Performance Profiling
mcp-cli call tabz/tabz_profile_performance '{}'
# Returns: DOM nodes, JS heap, event listeners, timing
DOM Tree Inspection
mcp-cli call tabz/tabz_get_dom_tree '{"maxDepth": 3}'
Tool Categories
| Category | Count | Key Tools |
|---|---|---|
| Screenshots | 2 | screenshot, screenshot_full |
| Interaction | 4 | click, fill, get_element |
| Network | 3 | enable_network_capture, get_network_requests |
| DOM/Debug | 4 | get_dom_tree, get_console_logs, profile_performance |
| Emulation | 6 | emulate_device, emulate_geolocation |
| Audio/TTS | 3 | speak, list_voices, play_audio |
| Tabs | 5 | list_tabs, open_url, switch_tab |
| Cookies | 5 | cookies_get, cookies_list |
Important Notes
- Always run
mcp-cli info tabz/<tool>before calling - Use explicit
tabIdwhen possible - don't rely on "active" tab - Tab IDs are large integers (e.g.,
1762561083) tabz_screenshotcannot capture Chrome sidebar
References
See references/ for detailed workflows:
screenshot-workflows.md- Viewport vs full pagenetwork-debugging.md- API request inspectionform-automation.md- Clicks, fills, selectorstts-notifications.md- Audio feedback patterns
Recommended Agent Skills
Expand your agent's capabilities with these related and highly-rated skills.
tabz-terminals
Spawn and manage terminal tabs via TabzChrome REST API. Use when spawning workers, creating terminals programmatically, setting up worktrees for parallel work, or crafting prompts for Claude workers.
tabz-development
Patterns for building and debugging TabzChrome itself. Use when working on Terminal.tsx, xterm.js integration, WebSocket I/O, resize handling, or any TabzChrome extension/backend code.
tabz-integration
Integrate projects with TabzChrome terminals via HTML attributes, WebSocket, JS API, or Spawn API
integration
Integrate projects with TabzChrome terminals via Markdown links, HTML attributes, WebSocket, JS API, or Spawn API
terminals
Spawn and manage terminal tabs via TabzChrome REST API. Use when spawning workers, creating terminals programmatically, setting up worktrees for parallel work, or crafting prompts for Claude workers.
browser
Browser automation via 70 tabz MCP tools. Use when taking screenshots, filling forms, debugging network requests, testing responsive design, or using text-to-speech notifications.
Didn't find tool you were looking for?