跳到正文
cccskills
免费在 GitHub 公开

aipex-browser

AI-powered browser automation using the AIPex Chrome Extension via MCP bridge. Use this skill when the agent needs to control a Chrome browser — navigating pages, clicking elements, filling forms, capturing screenshots, managing tabs, or downloading content — by connecting to the AIPex MCP bridge.

中文简介正在准备中。当前显示原文说明。

查看安装方法

包含的文件(2)

  • SKILL.md7.1 KB
  • references/tools-reference.md12.4 KB

SKILL.md(原文)

安装前可以查看交给 AI 代理的指令内容。

AIPex Browser Control

AIPex is a Chrome extension that exposes 30+ browser automation tools over the Model Context Protocol (MCP). Once connected, the agent can control any Chrome tab using natural language — clicking, typing, navigating, capturing screenshots, downloading content, and more.

Architecture:

Agent (MCP client) ──stdio──▶ aipex-mcp-bridge ──WebSocket──▶ AIPex Chrome Extension ──▶ Browser APIs

When to Use This Skill

Use this skill when the user wants to:

  • Navigate to URLs, click links, fill forms, or interact with any web page
  • Automate multi-step browser workflows
  • Extract or download data from web pages
  • Capture screenshots of browser tabs
  • Manage multiple tabs across browser windows
  • Perform browser-assisted testing (accessibility, UX, regression)

Prerequisites

  • AIPex Chrome extension installed (available on the Chrome Web Store or via developer build)
  • Node.js >= 18 installed on the local machine

The user is assumed to have AIPex installed. The agent only needs to complete the two connection steps below.


Step 1: Register the MCP Server

Add the following to the agent's MCP configuration. No manual installation is needed — npx downloads and runs aipex-mcp-bridge automatically.

Cursor (.cursor/mcp.json)

{
  "mcpServers": {
    "aipex-browser": {
      "command": "npx",
      "args": ["-y", "aipex-mcp-bridge"]
    }
  }
}

Claude Desktop (claude_desktop_config.json)

{
  "mcpServers": {
    "aipex-browser": {
      "command": "npx",
      "args": ["-y", "aipex-mcp-bridge"]
    }
  }
}

Claude Code (CLI)

claude mcp add aipex-browser -- npx -y aipex-mcp-bridge

VS Code Copilot (.vscode/mcp.json)

{
  "servers": {
    "aipex-browser": {
      "command": "npx",
      "args": ["-y", "aipex-mcp-bridge"]
    }
  }
}

Windsurf (mcp_config.json)

{
  "mcpServers": {
    "aipex-browser": {
      "command": "npx",
      "args": ["-y", "aipex-mcp-bridge"]
    }
  }
}

Custom port (optional)

The bridge listens on localhost:9223 by default. To use a different port:

{
  "mcpServers": {
    "aipex-browser": {
      "command": "npx",
      "args": ["-y", "aipex-mcp-bridge", "--port", "9224"]
    }
  }
}

Then use ws://localhost:9224 in Step 2.


Step 2: Connect the AIPex Extension to the Bridge

After the MCP server is registered and running:

  1. Open Chrome and click the AIPex extension icon
  2. Go to Options (or right-click the icon → "Extension options")
  3. Find the WebSocket Connection section
  4. Enter: ws://localhost:9223
  5. Click Connect

The bridge and extension will handshake, and all browser tools will become available to the agent.

Verifying the connection: If only a single tool called check_aipex_connection is visible, the extension has not yet connected. Follow Step 2 again, then reload the MCP server in agent settings.


Tool Usage Strategy (IMPORTANT)

Always follow this priority order to minimize token cost and latency:

Priority 1 — search_elements (always try first)

Query the page's accessibility tree to find elements and get their UIDs. Fast, cheap, requires no screenshot.

search_elements(tabId, "{button,input,textarea,select,a}*")

Priority 2 — UID-based interaction (preferred)

Use UIDs returned by search_elements to interact directly:

  • click(tabId, uid) — click any element
  • fill_element_by_uid(tabId, uid, value) — type into inputs
  • hover_element_by_uid(tabId, uid) — reveal menus or tooltips

Priority 3 — capture_screenshot + computer (high-cost fallback only)

Use only when search_elements fails after two different query attempts, or when pixel-level interaction is required (canvas, drag-and-drop, sliders).

  1. capture_screenshot(sendToLLM=true) — see the page
  2. computer(action, coordinate) — click/type at pixel coordinates

Standard Workflow

get_all_tabs()
  → search_elements(tabId, "<pattern>")
  → click(tabId, uid)  OR  fill_element_by_uid(tabId, uid, value)
  → [capture_screenshot(sendToLLM=true) to verify if needed]

Available Tool Categories

CategoryToolsDescription
Tab Management8 toolsOpen, close, switch, pin, group tabs
UI Interaction7 toolsClick, fill, hover, keyboard, coordinate-based
Page Content4 toolsMetadata, scroll, highlight elements/text
Screenshots2 toolsCapture visible tab or specific tab
Downloads3 toolsSave text as markdown, download images
Human Intervention4 toolsRequest user input mid-automation

Key tools by category:

CategoryKey Tools
Tabget_all_tabs, switch_to_tab, create_new_tab, close_tab
UIsearch_elements, click, fill_element_by_uid, computer
Pageget_page_metadata, scroll_to_element, highlight_element
Screenshotcapture_screenshot, capture_tab_screenshot
Downloaddownload_text_as_markdown, download_image
Interventionrequest_intervention, list_interventions

To load complete parameter schemas and examples for every tool:

read_skill_reference("aipex-browser", "references/tools-reference.md")

Common Patterns

Navigate to a URL and click a button

create_new_tab("https://example.com")
→ search_elements(tabId, "*[Ss]ubmit*")
→ click(tabId, uid)

Fill a login form

get_all_tabs()
→ search_elements(tabId, "{input,textbox}*")
→ fill_element_by_uid(tabId, emailUid, "user@example.com")
→ fill_element_by_uid(tabId, passwordUid, "secret")
→ search_elements(tabId, "*[Ll]ogin*")
→ click(tabId, uid)

Extract page content to markdown

get_page_metadata()
→ download_text_as_markdown(content, "page-extract")

Visual verification

capture_screenshot(sendToLLM=true)

Troubleshooting

SymptomLikely CauseFix
Only check_aipex_connection visibleExtension not connected to bridgeOpen AIPex Options → set WebSocket URL → Connect
Port 9223 already in usePort conflict on machineUse --port 9224 in MCP config and ws://localhost:9224 in extension
search_elements returns 0 resultsPage uses canvas or non-semantic HTMLFall back to capture_screenshot(sendToLLM=true) + computer tool
Connection drops frequentlyService worker sleep cycleAIPex uses keepalive pings; reconnect extension from Options if needed
Tools appear but calls time outBridge not receiving WebSocket messagesRestart bridge: reload MCP server in agent settings

评价

还没有评价。欢迎分享你的使用感受。

评论

无需登录即可发表。欢迎分享使用感受、提问,或说明在哪些环境下无法运行。

还没有评论。来写第一条吧。

提交后会立即公开。请勿填写邮箱、电话等个人信息。URL 最多 2 个。

0 / 1000 字

此表单受 reCAPTCHA 保护,适用 Google 的隐私权政策和服务条款。

同一仓库的技能

Guide for creating effective skills. This skill should be used when users want to create a new skill (or update an existing skill) that extends AIPex's capabilities with specialized knowledge, workflows, or tool integrations.

中文简介正在准备中。当前显示原文说明。

AIPexStudio/AIPex12722026年8月26日 更新

Minimalist UX/Interaction Audit Expert that deconstructs complex interactions through cognitive load and operational efficiency lenses. Use this skill when you need to perform a UX walkthrough audit on a Figma prototype or web interface, evaluating usability based on principles like fewer clicks, less UI elements, no hidden logic, and self-explanatory design.

中文简介正在准备中。当前显示原文说明。

AIPexStudio/AIPex12722026年8月26日 更新

WCAG 2.2 Accessibility Audit skill that systematically evaluates web pages against 8 core Success Criteria (1.1.1, 1.4.3, 1.4.11, 2.1.1, 2.1.2, 2.4.3, 2.4.7, 4.1.2) using accessibility tree inspection and visual analysis. Use this skill when you need to perform accessibility testing/auditing on a live webpage.

中文简介正在准备中。当前显示原文说明。

AIPexStudio/AIPex12722026年8月26日 更新

查看 AIPexStudio 的全部技能

报告此技能的问题