{ "schemaVersion": "1.0", "item": { "slug": "browsermcp", "name": "BrowserMCP Skill", "source": "tencent", "type": "skill", "category": "开发工具", "sourceUrl": "https://clawhub.ai/frankausberlin/browsermcp", "canonicalUrl": "https://clawhub.ai/frankausberlin/browsermcp", "targetPlatform": "OpenClaw" }, "install": { "downloadMode": "redirect", "downloadUrl": "/downloads/browsermcp", "sourceDownloadUrl": "https://wry-manatee-359.convex.site/api/v1/download?slug=browsermcp", "sourcePlatform": "tencent", "targetPlatform": "OpenClaw", "installMethod": "Manual import", "extraction": "Extract archive", "prerequisites": [ "OpenClaw" ], "packageFormat": "ZIP package", "includedAssets": [ "SKILL.md", "templates/config-template.json", "references/setup.md", "references/tools.md", "references/workflows.md", "references/best-practices.md" ], "primaryDoc": "SKILL.md", "quickSetup": [ "Download the package from Yavira.", "Extract the archive and review SKILL.md first.", "Import or place the package into your OpenClaw setup." ], "agentAssist": { "summary": "Hand the extracted package to your coding agent with a concrete install brief instead of figuring it out manually.", "steps": [ "Download the package from Yavira.", "Extract it into a folder your agent can access.", "Paste one of the prompts below and point your agent at the extracted folder." ], "prompts": [ { "label": "New install", "body": "I downloaded a skill package from Yavira. Read SKILL.md from the extracted folder and install it by following the included instructions. Tell me what you changed and call out any manual steps you could not complete." }, { "label": "Upgrade existing", "body": "I downloaded an updated skill package from Yavira. Read SKILL.md from the extracted folder, compare it with my current installation, and upgrade it while preserving any custom configuration unless the package docs explicitly say otherwise. Summarize what changed and any follow-up checks I should run." } ] }, "sourceHealth": { "source": "tencent", "status": "healthy", "reason": "direct_download_ok", "recommendedAction": "download", "checkedAt": "2026-04-30T16:55:25.780Z", "expiresAt": "2026-05-07T16:55:25.780Z", "httpStatus": 200, "finalUrl": "https://wry-manatee-359.convex.site/api/v1/download?slug=network", "contentType": "application/zip", "probeMethod": "head", "details": { "probeUrl": "https://wry-manatee-359.convex.site/api/v1/download?slug=network", "contentDisposition": "attachment; filename=\"network-1.0.0.zip\"", "redirectLocation": null, "bodySnippet": null }, "scope": "source", "summary": "Source download looks usable.", "detail": "Yavira can redirect you to the upstream package for this source.", "primaryActionLabel": "Download for OpenClaw", "primaryActionHref": "/downloads/browsermcp" }, "validation": { "installChecklist": [ "Use the Yavira download entry.", "Review SKILL.md after the package is downloaded.", "Confirm the extracted package contains the expected setup assets." ], "postInstallChecks": [ "Confirm the extracted package includes the expected docs or setup files.", "Validate the skill or prompts are available in your target agent workspace.", "Capture any manual follow-up steps the agent could not complete." ] }, "downloadPageUrl": "https://openagent3.xyz/downloads/browsermcp", "agentPageUrl": "https://openagent3.xyz/skills/browsermcp/agent", "manifestUrl": "https://openagent3.xyz/skills/browsermcp/agent.json", "briefUrl": "https://openagent3.xyz/skills/browsermcp/agent.md" }, "agentAssist": { "summary": "Hand the extracted package to your coding agent with a concrete install brief instead of figuring it out manually.", "steps": [ "Download the package from Yavira.", "Extract it into a folder your agent can access.", "Paste one of the prompts below and point your agent at the extracted folder." ], "prompts": [ { "label": "New install", "body": "I downloaded a skill package from Yavira. Read SKILL.md from the extracted folder and install it by following the included instructions. Tell me what you changed and call out any manual steps you could not complete." }, { "label": "Upgrade existing", "body": "I downloaded an updated skill package from Yavira. Read SKILL.md from the extracted folder, compare it with my current installation, and upgrade it while preserving any custom configuration unless the package docs explicitly say otherwise. Summarize what changed and any follow-up checks I should run." } ] }, "documentation": { "source": "clawhub", "primaryDoc": "SKILL.md", "sections": [ { "title": "BrowserMCP Skill", "body": "This skill enables MCP Clients to automate browser interactions through the BrowserMCP protocol. It leverages a local MCP server and a Chrome extension to control the user's actual browser session, allowing for authenticated actions and bypassing common bot detection." }, { "title": "Key Features", "body": "⚡ Fast: Automation happens locally without network latency\n🔒 Private: Browser activity stays on the device\n👤 Logged In: Uses existing browser profile with active sessions\n🥷 Stealth: Avoids basic bot detection and CAPTCHAs via real browser fingerprint" }, { "title": "Prerequisites", "body": "Before using BrowserMCP automation:\n\nMCP Server: BrowserMCP server must be running (via npx)\nChrome Extension: Browser MCP Chrome extension must be installed and connected\nActive Tab: The target browser tab must be connected via the extension\n\n[!IMPORTANT]\nThe AI can only control tabs that are actively \"Connected\" via the Browser MCP extension. If you switch tabs, you must reconnect the new tab." }, { "title": "Core Workflow", "body": "The standard browser automation process follows an iterative approach:\n\nflowchart TD\n A[Navigate to URL] --> B[Take Snapshot]\n B --> C[Identify Elements]\n C --> D[Interact: Click/Type/etc]\n D --> E[Wait for Changes]\n E --> B\n E --> F[Verify: Screenshot/Logs]" }, { "title": "Standard Pattern", "body": "StepToolPurposeKey Consideration1navigateOpen the target URLEnsure extension is connected first2snapshotCapture ARIA tree to identify interactive elementsRefresh after any page changes3click / typeInteract with page elementsUse exact ref from snapshot4waitPause for dynamic content to loadEssential after navigation/clicks5screenshotVisually verify resultsUse when uncertain about state6get_console_logsDebug JavaScript errorsCheck when interactions fail" }, { "title": "Essential Tools", "body": "ToolUse WhenParametersnavigateOpening a new pageurl - full URL including protocolsnapshotUnderstanding page structureNone - returns ARIA accessibility treeclickActivating buttons/linkselement (description), ref (exact ID from snapshot)typeFilling input fieldselement, ref, text, submit (optional)hoverTriggering hover menuselement, refselect_optionChoosing from dropdownselement, ref, values (array)press_keyKeyboard shortcutskey - e.g., \"Enter\", \"Escape\", \"ArrowDown\"waitAllowing page to loadtime - seconds to waitscreenshotVisual verificationNone - returns PNG imageget_console_logsDebugging errorsNone - returns recent console outputgo_back / go_forwardNavigation historyNone" }, { "title": "Common Key Values", "body": "Navigation: Enter, Escape, Tab\nEditing: Backspace, Delete\nArrows: ArrowUp, ArrowDown, ArrowLeft, ArrowRight\nModifiers: Control, Alt, Shift, Meta (combine via modifiers array)\nFunction: F1-F12\nOther: Home, End, PageUp, PageDown, Space" }, { "title": "Example 1: Search on Google", "body": "// Step 1: Navigate to search engine\nnavigate(url=\"https://google.com\")\n\n// Step 2: Type search query (use snapshot to find the ref)\ntype(element=\"Google search box\", ref=\"e12\", text=\"BrowserMCP automation\", submit=true)\n\n// Alternative: Type then press Enter separately\ntype(element=\"Search box\", ref=\"e12\", text=\"BrowserMCP automation\")\npress_key(key=\"Enter\")" }, { "title": "Example 2: Fill and Submit a Login Form", "body": "// Step 1: Navigate to login page\nnavigate(url=\"https://example.com/login\")\n\n// Step 2: Get snapshot to identify form fields\nsnapshot()\n\n// Step 3: Fill username field\ntype(element=\"Username or email field\", ref=\"e5\", text=\"user@example.com\")\n\n// Step 4: Fill password field\ntype(element=\"Password field\", ref=\"e7\", text=\"password123\")\n\n// Step 5: Click login button\nclick(element=\"Sign in button\", ref=\"e9\")\n\n// Step 6: Wait for redirect\nwait(time=2)\n\n// Step 7: Verify successful login with screenshot\nscreenshot()" }, { "title": "Example 3: Navigate and Extract Information", "body": "// Navigate to documentation\nnavigate(url=\"https://docs.browsermcp.io\")\n\n// Wait for page load\nwait(time=1)\n\n// Capture accessibility tree to understand structure\nsnapshot()\n\n// Click on a documentation link\nclick(element=\"API Reference link\", ref=\"e15\")\n\n// Wait for content to load\nwait(time=1)\n\n// Take screenshot for verification\nscreenshot()\n\n// Check for any JavaScript errors\nget_console_logs()" }, { "title": "Example 4: Handle Dynamic Content", "body": "// Navigate to page with dynamic content\nnavigate(url=\"https://example.com/dashboard\")\n\n// Wait for initial load\nwait(time=2)\n\n// Take snapshot to see available elements\nsnapshot()\n\n// Click element that triggers dynamic content\nclick(element=\"Load more button\", ref=\"e22\")\n\n// Wait for new content to appear\nwait(time=2)\n\n// Refresh snapshot to see new elements\nsnapshot()\n\n// Interact with newly loaded element\nclick(element=\"New item\", ref=\"e45\")" }, { "title": "1. Always Use Snapshots for Element Identification", "body": "Good:\n\n// Take snapshot first, then use exact refs\nsnapshot()\nclick(element=\"Submit button\", ref=\"e12\")\n\nBad:\n\n// Guessing selectors without snapshot\nclick(element=\"button.submit\") // May not work with dynamic DOM" }, { "title": "2. Wait After Navigation and Major Actions", "body": "Dynamic web applications often load content asynchronously. Always wait after:\n\nNavigation to a new page\nClicking buttons that trigger requests\nSubmitting forms\n\nclick(element=\"Load data button\", ref=\"e8\")\nwait(time=2) // Wait for data to load\nsnapshot() // Then get fresh page structure" }, { "title": "3. Handle Connection Requirements", "body": "Before any automation:\n\nVerify the Browser MCP extension is installed\nEnsure the target tab is connected (user must click \"Connect\")\nIf connection errors occur, remind the user to reconnect" }, { "title": "4. Use Screenshots for Debugging", "body": "When interactions fail:\n\n// Take screenshot to see current page state\nscreenshot()\n\n// Check console for JavaScript errors\nget_console_logs()\n\n// Re-snapshot to see updated element refs\nsnapshot()" }, { "title": "5. Respect Privacy and Security", "body": "BrowserMCP uses the user's actual browser profile\nBe cautious with sensitive data\nUser remains logged into their services\nAll actions happen locally on the device" }, { "title": "Reference Navigation", "body": "FileContentsreferences/setup.mdDetailed installation and configuration for MCP server and Chrome extensionreferences/tools.mdComplete tool reference with parameters and detailed examplesreferences/best-practices.mdAdvanced patterns, error handling, and troubleshooting techniquesreferences/workflows.mdCommon workflow patterns (forms, authentication, scraping, etc.)" }, { "title": "Connection Errors", "body": "Error: \"No connection to browser extension\"\n\nSolution:\n\nUser must click the Browser MCP extension icon in Chrome toolbar\nClick \"Connect\" button on the target tab\nOnly connected tabs can be automated" }, { "title": "Element Not Found", "body": "Error: Element reference invalid or element not found\n\nSolution:\n\nTake a fresh snapshot() - the DOM may have changed\nUse the new ref values from the updated snapshot\nDynamic content may require wait() before snapshot" }, { "title": "Action Blocked or Failed", "body": "Error: Click/type action didn't work as expected\n\nSolution:\n\nTake a screenshot() to see current page state\nCheck get_console_logs() for JavaScript errors\nVerify element is visible and enabled in snapshot\nCheck for browser-level popups or security prompts\nEnsure the page has finished loading" }, { "title": "CAPTCHA or Bot Detection", "body": "Note: BrowserMCP helps avoid basic bot detection by using the real browser profile. However:\n\nSome sites may still present challenges\nRate limiting may apply to rapid interactions\nUser may need to manually solve some CAPTCHAs" }, { "title": "Comparison: BrowserMCP vs Playwright MCP", "body": "FeatureBrowserMCPPlaywright MCPBrowserUser's existing browserNew browser instanceProfileUses existing profile with cookiesIsolated profileAuthenticationAlready logged inMust log in each sessionBot DetectionLower (real fingerprint)HigherMulti-tabOne tab at a timeMultiple tabs supportedBest ForPersonal automation, testing logged-in flowsTesting, CI/CD, isolated sessions" }, { "title": "Tips for Effective Automation", "body": "Start with navigate + wait + snapshot - Establish baseline page state\nUse descriptive element names - Helps with debugging and clarity\nTake screenshots at checkpoints - Visual verification catches issues early\nCheck console logs after errors - JavaScript errors explain many failures\nWait strategically - Too short = flakiness, too long = slowness\nRefresh snapshots after interactions - DOM changes invalidate old refs\nUse submit=true for forms - Cleaner than separate press_key(\"Enter\")\nCombine actions efficiently - Group related operations to minimize round-trips" }, { "title": "Resources", "body": "BrowserMCP Website: https://browsermcp.io\nDocumentation: https://docs.browsermcp.io\nChrome Extension: Search \"Browser MCP\" in Chrome Web Store\nGitHub: https://github.com/browsermcp/mcp\nBased on: Playwright MCP" } ], "body": "BrowserMCP Skill\n\nThis skill enables MCP Clients to automate browser interactions through the BrowserMCP protocol. It leverages a local MCP server and a Chrome extension to control the user's actual browser session, allowing for authenticated actions and bypassing common bot detection.\n\nKey Features\n⚡ Fast: Automation happens locally without network latency\n🔒 Private: Browser activity stays on the device\n👤 Logged In: Uses existing browser profile with active sessions\n🥷 Stealth: Avoids basic bot detection and CAPTCHAs via real browser fingerprint\nPrerequisites\n\nBefore using BrowserMCP automation:\n\nMCP Server: BrowserMCP server must be running (via npx)\nChrome Extension: Browser MCP Chrome extension must be installed and connected\nActive Tab: The target browser tab must be connected via the extension\n\n[!IMPORTANT] The AI can only control tabs that are actively \"Connected\" via the Browser MCP extension. If you switch tabs, you must reconnect the new tab.\n\nCore Workflow\n\nThe standard browser automation process follows an iterative approach:\n\nflowchart TD\n A[Navigate to URL] --> B[Take Snapshot]\n B --> C[Identify Elements]\n C --> D[Interact: Click/Type/etc]\n D --> E[Wait for Changes]\n E --> B\n E --> F[Verify: Screenshot/Logs]\n\nStandard Pattern\nStep\tTool\tPurpose\tKey Consideration\n1\tnavigate\tOpen the target URL\tEnsure extension is connected first\n2\tsnapshot\tCapture ARIA tree to identify interactive elements\tRefresh after any page changes\n3\tclick / type\tInteract with page elements\tUse exact ref from snapshot\n4\twait\tPause for dynamic content to load\tEssential after navigation/clicks\n5\tscreenshot\tVisually verify results\tUse when uncertain about state\n6\tget_console_logs\tDebug JavaScript errors\tCheck when interactions fail\nQuick Reference\nEssential Tools\nTool\tUse When\tParameters\nnavigate\tOpening a new page\turl - full URL including protocol\nsnapshot\tUnderstanding page structure\tNone - returns ARIA accessibility tree\nclick\tActivating buttons/links\telement (description), ref (exact ID from snapshot)\ntype\tFilling input fields\telement, ref, text, submit (optional)\nhover\tTriggering hover menus\telement, ref\nselect_option\tChoosing from dropdowns\telement, ref, values (array)\npress_key\tKeyboard shortcuts\tkey - e.g., \"Enter\", \"Escape\", \"ArrowDown\"\nwait\tAllowing page to load\ttime - seconds to wait\nscreenshot\tVisual verification\tNone - returns PNG image\nget_console_logs\tDebugging errors\tNone - returns recent console output\ngo_back / go_forward\tNavigation history\tNone\nCommon Key Values\nNavigation: Enter, Escape, Tab\nEditing: Backspace, Delete\nArrows: ArrowUp, ArrowDown, ArrowLeft, ArrowRight\nModifiers: Control, Alt, Shift, Meta (combine via modifiers array)\nFunction: F1-F12\nOther: Home, End, PageUp, PageDown, Space\n\nUsage Examples\nExample 1: Search on Google\n// Step 1: Navigate to search engine\nnavigate(url=\"https://google.com\")\n\n// Step 2: Type search query (use snapshot to find the ref)\ntype(element=\"Google search box\", ref=\"e12\", text=\"BrowserMCP automation\", submit=true)\n\n// Alternative: Type then press Enter separately\ntype(element=\"Search box\", ref=\"e12\", text=\"BrowserMCP automation\")\npress_key(key=\"Enter\")\n\nExample 2: Fill and Submit a Login Form\n// Step 1: Navigate to login page\nnavigate(url=\"https://example.com/login\")\n\n// Step 2: Get snapshot to identify form fields\nsnapshot()\n\n// Step 3: Fill username field\ntype(element=\"Username or email field\", ref=\"e5\", text=\"user@example.com\")\n\n// Step 4: Fill password field\ntype(element=\"Password field\", ref=\"e7\", text=\"password123\")\n\n// Step 5: Click login button\nclick(element=\"Sign in button\", ref=\"e9\")\n\n// Step 6: Wait for redirect\nwait(time=2)\n\n// Step 7: Verify successful login with screenshot\nscreenshot()\n\nExample 3: Navigate and Extract Information\n// Navigate to documentation\nnavigate(url=\"https://docs.browsermcp.io\")\n\n// Wait for page load\nwait(time=1)\n\n// Capture accessibility tree to understand structure\nsnapshot()\n\n// Click on a documentation link\nclick(element=\"API Reference link\", ref=\"e15\")\n\n// Wait for content to load\nwait(time=1)\n\n// Take screenshot for verification\nscreenshot()\n\n// Check for any JavaScript errors\nget_console_logs()\n\nExample 4: Handle Dynamic Content\n// Navigate to page with dynamic content\nnavigate(url=\"https://example.com/dashboard\")\n\n// Wait for initial load\nwait(time=2)\n\n// Take snapshot to see available elements\nsnapshot()\n\n// Click element that triggers dynamic content\nclick(element=\"Load more button\", ref=\"e22\")\n\n// Wait for new content to appear\nwait(time=2)\n\n// Refresh snapshot to see new elements\nsnapshot()\n\n// Interact with newly loaded element\nclick(element=\"New item\", ref=\"e45\")\n\nBest Practices\n1. Always Use Snapshots for Element Identification\n\nGood:\n\n// Take snapshot first, then use exact refs\nsnapshot()\nclick(element=\"Submit button\", ref=\"e12\")\n\n\nBad:\n\n// Guessing selectors without snapshot\nclick(element=\"button.submit\") // May not work with dynamic DOM\n\n2. Wait After Navigation and Major Actions\n\nDynamic web applications often load content asynchronously. Always wait after:\n\nNavigation to a new page\nClicking buttons that trigger requests\nSubmitting forms\nclick(element=\"Load data button\", ref=\"e8\")\nwait(time=2) // Wait for data to load\nsnapshot() // Then get fresh page structure\n\n3. Handle Connection Requirements\n\nBefore any automation:\n\nVerify the Browser MCP extension is installed\nEnsure the target tab is connected (user must click \"Connect\")\nIf connection errors occur, remind the user to reconnect\n4. Use Screenshots for Debugging\n\nWhen interactions fail:\n\n// Take screenshot to see current page state\nscreenshot()\n\n// Check console for JavaScript errors\nget_console_logs()\n\n// Re-snapshot to see updated element refs\nsnapshot()\n\n5. Respect Privacy and Security\nBrowserMCP uses the user's actual browser profile\nBe cautious with sensitive data\nUser remains logged into their services\nAll actions happen locally on the device\nReference Navigation\nFile\tContents\nreferences/setup.md\tDetailed installation and configuration for MCP server and Chrome extension\nreferences/tools.md\tComplete tool reference with parameters and detailed examples\nreferences/best-practices.md\tAdvanced patterns, error handling, and troubleshooting techniques\nreferences/workflows.md\tCommon workflow patterns (forms, authentication, scraping, etc.)\nTroubleshooting\nConnection Errors\n\nError: \"No connection to browser extension\"\n\nSolution:\n\nUser must click the Browser MCP extension icon in Chrome toolbar\nClick \"Connect\" button on the target tab\nOnly connected tabs can be automated\nElement Not Found\n\nError: Element reference invalid or element not found\n\nSolution:\n\nTake a fresh snapshot() - the DOM may have changed\nUse the new ref values from the updated snapshot\nDynamic content may require wait() before snapshot\nAction Blocked or Failed\n\nError: Click/type action didn't work as expected\n\nSolution:\n\nTake a screenshot() to see current page state\nCheck get_console_logs() for JavaScript errors\nVerify element is visible and enabled in snapshot\nCheck for browser-level popups or security prompts\nEnsure the page has finished loading\nCAPTCHA or Bot Detection\n\nNote: BrowserMCP helps avoid basic bot detection by using the real browser profile. However:\n\nSome sites may still present challenges\nRate limiting may apply to rapid interactions\nUser may need to manually solve some CAPTCHAs\nComparison: BrowserMCP vs Playwright MCP\nFeature\tBrowserMCP\tPlaywright MCP\nBrowser\tUser's existing browser\tNew browser instance\nProfile\tUses existing profile with cookies\tIsolated profile\nAuthentication\tAlready logged in\tMust log in each session\nBot Detection\tLower (real fingerprint)\tHigher\nMulti-tab\tOne tab at a time\tMultiple tabs supported\nBest For\tPersonal automation, testing logged-in flows\tTesting, CI/CD, isolated sessions\nTips for Effective Automation\nStart with navigate + wait + snapshot - Establish baseline page state\nUse descriptive element names - Helps with debugging and clarity\nTake screenshots at checkpoints - Visual verification catches issues early\nCheck console logs after errors - JavaScript errors explain many failures\nWait strategically - Too short = flakiness, too long = slowness\nRefresh snapshots after interactions - DOM changes invalidate old refs\nUse submit=true for forms - Cleaner than separate press_key(\"Enter\")\nCombine actions efficiently - Group related operations to minimize round-trips\nResources\nBrowserMCP Website: https://browsermcp.io\nDocumentation: https://docs.browsermcp.io\nChrome Extension: Search \"Browser MCP\" in Chrome Web Store\nGitHub: https://github.com/browsermcp/mcp\nBased on: Playwright MCP" }, "trust": { "sourceLabel": "tencent", "provenanceUrl": "https://clawhub.ai/frankausberlin/browsermcp", "publisherUrl": "https://clawhub.ai/frankausberlin/browsermcp", "owner": "frankausberlin", "version": "1.0.0", "license": null, "verificationStatus": "Indexed source record" }, "links": { "detailUrl": "https://openagent3.xyz/skills/browsermcp", "downloadUrl": "https://openagent3.xyz/downloads/browsermcp", "agentUrl": "https://openagent3.xyz/skills/browsermcp/agent", "manifestUrl": "https://openagent3.xyz/skills/browsermcp/agent.json", "briefUrl": "https://openagent3.xyz/skills/browsermcp/agent.md" } }