Compare commits
7 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 Simon
|
eede819ea8 | ||
|
Simon
|
ce3047428a | ||
|
Simon
|
3456f45590 | ||
|
Simon
|
4f71f065df | ||
|
zfangqijun
|
cd2d33a9f6 | ||
|
Simon
|
80e96d0b9e | ||
|
Simon
|
2c3b27e337 |
@@ -25,8 +25,8 @@ The GUI Agent Living in Your Webpage. Control web interfaces with natural langua
|
||||
- **📖 Text-based DOM manipulation**
|
||||
- No screenshots. No multi-modal LLMs or special permissions needed.
|
||||
- **🧠 Bring your own LLMs**
|
||||
- **🎨 Pretty UI with human-in-the-loop**
|
||||
- **🐙 Optional [chrome extension](https://alibaba.github.io/page-agent/docs/features/chrome-extension) for multi-page tasks.**
|
||||
- [MCP Server (Beta)](https://alibaba.github.io/page-agent/docs/features/mcp-server)
|
||||
|
||||
## 💡 Use Cases
|
||||
|
||||
@@ -49,8 +49,8 @@ Fastest way to try PageAgent with our free Demo LLM:
|
||||
|
||||
| Mirrors | URL |
|
||||
| ------- | ---------------------------------------------------------------------------------- |
|
||||
| Global | https://cdn.jsdelivr.net/npm/page-agent@1.6.0/dist/iife/page-agent.demo.js |
|
||||
| China | https://registry.npmmirror.com/page-agent/1.6.0/files/dist/iife/page-agent.demo.js |
|
||||
| Global | https://cdn.jsdelivr.net/npm/page-agent@1.6.1/dist/iife/page-agent.demo.js |
|
||||
| China | https://registry.npmmirror.com/page-agent/1.6.1/files/dist/iife/page-agent.demo.js |
|
||||
|
||||
### NPM Installation
|
||||
|
||||
|
||||
@@ -5,6 +5,31 @@ All notable changes to this project will be documented in this file.
|
||||
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
|
||||
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
||||
|
||||
## [1.6.0] - 2026-03-21
|
||||
|
||||
### Features
|
||||
|
||||
- **Beta MCP support** - New `@page-agent/mcp` package lets MCP clients such as Claude Desktop and Copilot control the browser through the Page Agent extension
|
||||
- **Better iframe handling** - Same-origin iframe elements are handled more reliably during DOM extraction and actions
|
||||
- **Extension history workflows** - Users can rerun past tasks, export history sessions as JSON, and approve MCP-triggered tasks before execution
|
||||
|
||||
### Improvements
|
||||
|
||||
- **Unified versioning across packages** - The extension now follows the root workspace version. Changelog entries are no longer split into a separate extension version section
|
||||
- **Configurable `stepDelay`** - Agent pacing between steps is now configurable via `stepDelay`
|
||||
- **Optional API key** - `apiKey` can now be omitted for compatible deployments that do not require one
|
||||
- **Optional named tool choice** - Tool invocation can disable named tool choice for providers that behave better without it
|
||||
- **Better rich-text input support** - Improved `contenteditable` handling with better event dispatching and `execCommand` fallback for more editors
|
||||
- **More flexible DOM extraction** - `includeAttributes` now supports wildcards, `contenteditable` is included by default, and heuristically interactive elements expose more useful attributes
|
||||
- **MiniMax model support** - Added MiniMax compatibility, with the default recommendation updated to `MiniMax-M2.7`
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
- Fixed Safari issues when `requestIdleCallback` is unavailable
|
||||
- Avoid throwing when `webgl2` initialization fails
|
||||
- Improved OpenAI-compatible request patches for GPT-5.4 chat tools and MiniMax temperature/tool-call compatibility
|
||||
- Fixed several UI polish issues in the extension and website, including cursor and layout regressions
|
||||
|
||||
## [1.5.1] - 2026-03-05
|
||||
|
||||
### Breaking Changes
|
||||
|
||||
+8
-9
@@ -20,17 +20,16 @@
|
||||
## ✨ Features
|
||||
|
||||
- **🎯 轻松集成**
|
||||
- 无需 `浏览器插件` / `Python` / `无头浏览器`。
|
||||
- 纯页面内 JavaScript，一切都在你的网页中完成。
|
||||
- 无需 `浏览器插件` / `Python` / `无头浏览器`，纯页面内 JavaScript
|
||||
- **📖 基于文本的 DOM 操作**
|
||||
- 无需截图，无需多模态模型或特殊权限。
|
||||
- **🧠 用你自己的 LLM**
|
||||
- **🎨 精美 UI，支持人机协同**
|
||||
- **🐙 可选的 [Chrome 扩展](https://alibaba.github.io/page-agent/docs/features/chrome-extension)，支持跨页面任务。**
|
||||
- 无需截图，无需多模态模型或特殊权限
|
||||
- **🧠 自备 LLM**
|
||||
- 🐙 可选的 [Chrome 扩展](https://alibaba.github.io/page-agent/docs/features/chrome-extension)，支持跨页面任务
|
||||
- [MCP Server (Beta)](https://alibaba.github.io/page-agent/docs/features/mcp-server)
|
||||
|
||||
## 💡 应用场景
|
||||
|
||||
- **SaaS AI 副驾驶** — 几行代码为你的产品加上 AI 副驾驶，无需重写后端。
|
||||
- **SaaS AI Copilot** — 几行代码为你的产品加上 AI 副驾驶，无需重写后端。
|
||||
- **智能表单填写** — 把 20 次点击变成一句话。ERP、CRM、管理后台的最佳拍档。
|
||||
- **无障碍增强** — 用自然语言让任何网页无障碍。语音指令、屏幕阅读器，零门槛。
|
||||
- **跨页面 Agent** — 通过可选的 [Chrome 扩展](https://alibaba.github.io/page-agent/docs/features/chrome-extension)，让你自己的 Agent 跨标签页工作。
|
||||
@@ -49,8 +48,8 @@
|
||||
|
||||
| Mirrors | URL |
|
||||
| ------- | ---------------------------------------------------------------------------------- |
|
||||
| Global | https://cdn.jsdelivr.net/npm/page-agent@1.6.0/dist/iife/page-agent.demo.js |
|
||||
| China | https://registry.npmmirror.com/page-agent/1.6.0/files/dist/iife/page-agent.demo.js |
|
||||
| Global | https://cdn.jsdelivr.net/npm/page-agent@1.6.1/dist/iife/page-agent.demo.js |
|
||||
| China | https://registry.npmmirror.com/page-agent/1.6.1/files/dist/iife/page-agent.demo.js |
|
||||
|
||||
### NPM 安装
|
||||
|
||||
|
||||
Generated
+20
-20
@@ -1,12 +1,12 @@
|
||||
{
|
||||
"name": "root",
|
||||
"version": "1.6.0",
|
||||
"version": "1.6.1",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "root",
|
||||
"version": "1.6.0",
|
||||
"version": "1.6.1",
|
||||
"license": "MIT",
|
||||
"workspaces": [
|
||||
"packages/page-controller",
|
||||
@@ -11799,11 +11799,11 @@
|
||||
},
|
||||
"packages/core": {
|
||||
"name": "@page-agent/core",
|
||||
"version": "1.6.0",
|
||||
"version": "1.6.1",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@page-agent/llms": "1.6.0",
|
||||
"@page-agent/page-controller": "1.6.0",
|
||||
"@page-agent/llms": "1.6.1",
|
||||
"@page-agent/page-controller": "1.6.1",
|
||||
"chalk": "^5.6.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
@@ -11815,13 +11815,13 @@
|
||||
},
|
||||
"packages/extension": {
|
||||
"name": "@page-agent/ext",
|
||||
"version": "1.6.0",
|
||||
"version": "1.6.1",
|
||||
"hasInstallScript": true,
|
||||
"dependencies": {
|
||||
"@page-agent/core": "1.6.0",
|
||||
"@page-agent/llms": "1.6.0",
|
||||
"@page-agent/page-controller": "1.6.0",
|
||||
"@page-agent/ui": "1.6.0",
|
||||
"@page-agent/core": "1.6.1",
|
||||
"@page-agent/llms": "1.6.1",
|
||||
"@page-agent/page-controller": "1.6.1",
|
||||
"@page-agent/ui": "1.6.1",
|
||||
"ai-motion": "^0.4.8",
|
||||
"chalk": "^5.6.2"
|
||||
},
|
||||
@@ -11858,7 +11858,7 @@
|
||||
},
|
||||
"packages/llms": {
|
||||
"name": "@page-agent/llms",
|
||||
"version": "1.6.0",
|
||||
"version": "1.6.1",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"chalk": "^5.6.2"
|
||||
@@ -11872,7 +11872,7 @@
|
||||
},
|
||||
"packages/mcp": {
|
||||
"name": "@page-agent/mcp",
|
||||
"version": "1.6.0",
|
||||
"version": "1.6.1",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@modelcontextprotocol/sdk": "^1.27.1",
|
||||
@@ -11887,13 +11887,13 @@
|
||||
}
|
||||
},
|
||||
"packages/page-agent": {
|
||||
"version": "1.6.0",
|
||||
"version": "1.6.1",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@page-agent/core": "1.6.0",
|
||||
"@page-agent/llms": "1.6.0",
|
||||
"@page-agent/page-controller": "1.6.0",
|
||||
"@page-agent/ui": "1.6.0",
|
||||
"@page-agent/core": "1.6.1",
|
||||
"@page-agent/llms": "1.6.1",
|
||||
"@page-agent/page-controller": "1.6.1",
|
||||
"@page-agent/ui": "1.6.1",
|
||||
"chalk": "^5.6.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
@@ -11905,7 +11905,7 @@
|
||||
},
|
||||
"packages/page-controller": {
|
||||
"name": "@page-agent/page-controller",
|
||||
"version": "1.6.0",
|
||||
"version": "1.6.1",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"ai-motion": "^0.4.8"
|
||||
@@ -11913,12 +11913,12 @@
|
||||
},
|
||||
"packages/ui": {
|
||||
"name": "@page-agent/ui",
|
||||
"version": "1.6.0",
|
||||
"version": "1.6.1",
|
||||
"license": "MIT"
|
||||
},
|
||||
"packages/website": {
|
||||
"name": "@page-agent/website",
|
||||
"version": "1.6.0",
|
||||
"version": "1.6.1",
|
||||
"devDependencies": {
|
||||
"@radix-ui/react-icons": "^1.3.2",
|
||||
"@radix-ui/react-separator": "^1.1.8",
|
||||
|
||||
+1
-1
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "root",
|
||||
"private": true,
|
||||
"version": "1.6.0",
|
||||
"version": "1.6.1",
|
||||
"type": "module",
|
||||
"workspaces": [
|
||||
"packages/page-controller",
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@page-agent/core",
|
||||
"private": false,
|
||||
"version": "1.6.0",
|
||||
"version": "1.6.1",
|
||||
"type": "module",
|
||||
"main": "./dist/esm/page-agent-core.js",
|
||||
"module": "./dist/esm/page-agent-core.js",
|
||||
@@ -44,8 +44,8 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"chalk": "^5.6.2",
|
||||
"@page-agent/llms": "1.6.0",
|
||||
"@page-agent/page-controller": "1.6.0"
|
||||
"@page-agent/llms": "1.6.1",
|
||||
"@page-agent/page-controller": "1.6.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"zod": "^3.25.0 || ^4.0.0"
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@page-agent/ext",
|
||||
"private": true,
|
||||
"version": "1.6.0",
|
||||
"version": "1.6.1",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "wxt",
|
||||
@@ -37,10 +37,10 @@
|
||||
"wxt": "^0.20.19"
|
||||
},
|
||||
"dependencies": {
|
||||
"@page-agent/core": "1.6.0",
|
||||
"@page-agent/llms": "1.6.0",
|
||||
"@page-agent/page-controller": "1.6.0",
|
||||
"@page-agent/ui": "1.6.0",
|
||||
"@page-agent/core": "1.6.1",
|
||||
"@page-agent/llms": "1.6.1",
|
||||
"@page-agent/page-controller": "1.6.1",
|
||||
"@page-agent/ui": "1.6.1",
|
||||
"ai-motion": "^0.4.8",
|
||||
"chalk": "^5.6.2"
|
||||
},
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@page-agent/llms",
|
||||
"version": "1.6.0",
|
||||
"version": "1.6.1",
|
||||
"type": "module",
|
||||
"main": "./dist/lib/page-agent-llms.js",
|
||||
"module": "./dist/lib/page-agent-llms.js",
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@page-agent/mcp",
|
||||
"private": false,
|
||||
"version": "1.6.0",
|
||||
"version": "1.6.1",
|
||||
"type": "module",
|
||||
"bin": {
|
||||
"page-agent-mcp": "src/index.js"
|
||||
|
||||
@@ -35,11 +35,14 @@ const mcpServer = new McpServer({ name: 'page-agent', version: '1.5.8' })
|
||||
mcpServer.registerTool(
|
||||
'execute_task',
|
||||
{
|
||||
description:
|
||||
'Execute a browser automation task described in natural language. ' +
|
||||
'The Page Agent extension will control the browser to complete the task. ' +
|
||||
'Blocks until the task is complete.',
|
||||
inputSchema: { task: z.string().describe('Task description in natural language') },
|
||||
description: "Execute a task in user's browser.",
|
||||
inputSchema: {
|
||||
task: z
|
||||
.string()
|
||||
.describe(
|
||||
'Task description. Give specific instructions for the task. Steps preferable. And the information you want to get after the task is done.'
|
||||
),
|
||||
},
|
||||
},
|
||||
async ({ task }) => {
|
||||
try {
|
||||
@@ -50,7 +53,7 @@ mcpServer.registerTool(
|
||||
{
|
||||
type: 'text',
|
||||
text: result.success
|
||||
? `Task completed successfully.\n\n${result.data}`
|
||||
? `Task completed.\n\n${result.data}`
|
||||
: `Task failed.\n\n${result.data}`,
|
||||
},
|
||||
],
|
||||
@@ -67,7 +70,7 @@ mcpServer.registerTool(
|
||||
mcpServer.registerTool(
|
||||
'get_status',
|
||||
{
|
||||
description: 'Check the current status of the Page Agent hub connection and agent.',
|
||||
description: 'Check the current status of the Page Agent hub.',
|
||||
},
|
||||
async () => ({
|
||||
content: [
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "page-agent",
|
||||
"private": false,
|
||||
"version": "1.6.0",
|
||||
"version": "1.6.1",
|
||||
"type": "module",
|
||||
"main": "./dist/esm/page-agent.js",
|
||||
"module": "./dist/esm/page-agent.js",
|
||||
@@ -44,10 +44,10 @@
|
||||
"postpublish": "node -e \"['README.md','LICENSE'].forEach(f=>{try{require('fs').unlinkSync(f)}catch{}})\""
|
||||
},
|
||||
"dependencies": {
|
||||
"@page-agent/core": "1.6.0",
|
||||
"@page-agent/llms": "1.6.0",
|
||||
"@page-agent/page-controller": "1.6.0",
|
||||
"@page-agent/ui": "1.6.0",
|
||||
"@page-agent/core": "1.6.1",
|
||||
"@page-agent/llms": "1.6.1",
|
||||
"@page-agent/page-controller": "1.6.1",
|
||||
"@page-agent/ui": "1.6.1",
|
||||
"chalk": "^5.6.2"
|
||||
},
|
||||
"peerDependencies": {
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@page-agent/page-controller",
|
||||
"version": "1.6.0",
|
||||
"version": "1.6.1",
|
||||
"type": "module",
|
||||
"main": "./dist/lib/page-controller.js",
|
||||
"module": "./dist/lib/page-controller.js",
|
||||
|
||||
@@ -424,3 +424,5 @@ export class PageController extends EventTarget {
|
||||
this.mask = null
|
||||
}
|
||||
}
|
||||
|
||||
export * from './actions'
|
||||
|
||||
@@ -15,6 +15,7 @@ import {
|
||||
|
||||
/**
|
||||
* Get the HTMLElement by index from a selectorMap.
|
||||
* @private Internal method, subject to change at any time.
|
||||
*/
|
||||
export function getElementByIndex(
|
||||
selectorMap: Map<number, InteractiveElementDomNode>,
|
||||
@@ -54,6 +55,7 @@ function blurLastClickedElement() {
|
||||
|
||||
/**
|
||||
* Simulate a click on the element
|
||||
* @private Internal method, subject to change at any time.
|
||||
*/
|
||||
export async function clickElement(element: HTMLElement) {
|
||||
blurLastClickedElement()
|
||||
@@ -89,6 +91,9 @@ export async function clickElement(element: HTMLElement) {
|
||||
await waitFor(0.2) // Wait to ensure click event processing completes
|
||||
}
|
||||
|
||||
/**
|
||||
* @private Internal method, subject to change at any time.
|
||||
*/
|
||||
export async function inputTextElement(element: HTMLElement, text: string) {
|
||||
const isContentEditable = element.isContentEditable
|
||||
if (!isInputElement(element) && !isTextAreaElement(element) && !isContentEditable) {
|
||||
@@ -196,6 +201,7 @@ export async function inputTextElement(element: HTMLElement, text: string) {
|
||||
|
||||
/**
|
||||
* @todo browser-use version is very complex and supports menu tags, need to follow up
|
||||
* @private Internal method, subject to change at any time.
|
||||
*/
|
||||
export async function selectOptionElement(selectElement: HTMLSelectElement, optionText: string) {
|
||||
if (!isSelectElement(selectElement)) {
|
||||
@@ -219,6 +225,9 @@ interface ScrollableElement extends Element {
|
||||
scrollIntoViewIfNeeded?: (centerIfNeeded?: boolean) => void
|
||||
}
|
||||
|
||||
/**
|
||||
* @private Internal method, subject to change at any time.
|
||||
*/
|
||||
export async function scrollIntoViewIfNeeded(element: Element) {
|
||||
const el = element as ScrollableElement
|
||||
if (typeof el.scrollIntoViewIfNeeded === 'function') {
|
||||
@@ -231,6 +240,9 @@ export async function scrollIntoViewIfNeeded(element: Element) {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @private Internal method, subject to change at any time.
|
||||
*/
|
||||
export async function scrollVertically(
|
||||
down: boolean,
|
||||
scroll_amount: number,
|
||||
@@ -359,6 +371,9 @@ export async function scrollVertically(
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @private Internal method, subject to change at any time.
|
||||
*/
|
||||
export async function scrollHorizontally(
|
||||
right: boolean,
|
||||
scroll_amount: number,
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@page-agent/ui",
|
||||
"version": "1.6.0",
|
||||
"version": "1.6.1",
|
||||
"type": "module",
|
||||
"main": "./dist/lib/page-agent-ui.js",
|
||||
"module": "./dist/lib/page-agent-ui.js",
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@page-agent/website",
|
||||
"private": true,
|
||||
"version": "1.6.0",
|
||||
"version": "1.6.1",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite --host 0.0.0.0",
|
||||
|
||||
@@ -8,8 +8,8 @@ export default function LanguageSwitcher() {
|
||||
const dropdownRef = useRef<HTMLDivElement>(null)
|
||||
|
||||
const languages = [
|
||||
{ code: 'zh-CN' as const, label: '中文' },
|
||||
{ code: 'en-US' as const, label: 'English' },
|
||||
{ code: 'zh-CN' as const, label: '中文' },
|
||||
]
|
||||
|
||||
const currentLanguage = languages.find((lang) => lang.code === language) || languages[0]
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
// Demo build (auto-init with demo LLM, for quick testing)
|
||||
export const CDN_DEMO_URL =
|
||||
'https://cdn.jsdelivr.net/npm/page-agent@1.6.0/dist/iife/page-agent.demo.js'
|
||||
'https://cdn.jsdelivr.net/npm/page-agent@1.6.1/dist/iife/page-agent.demo.js'
|
||||
export const CDN_DEMO_CN_URL =
|
||||
'https://registry.npmmirror.com/page-agent/1.6.0/files/dist/iife/page-agent.demo.js'
|
||||
'https://registry.npmmirror.com/page-agent/1.6.1/files/dist/iife/page-agent.demo.js'
|
||||
|
||||
// Demo LLM for website testing (homepage quick trial uses flash)
|
||||
export const DEMO_MODEL = 'qwen3.5-flash'
|
||||
|
||||
@@ -45,6 +45,7 @@ export default function DocsLayout({ children }: DocsLayoutProps) {
|
||||
{ title: isZh ? '知识注入' : 'Instructions', path: '/features/custom-instructions' },
|
||||
{ title: isZh ? '数据脱敏' : 'Data Masking', path: '/features/data-masking' },
|
||||
{ title: isZh ? 'Chrome 扩展' : 'Chrome Extension', path: '/features/chrome-extension' },
|
||||
{ title: 'MCP Server (Beta)', path: '/features/mcp-server' },
|
||||
{
|
||||
title: isZh ? '接入第三方 Agent' : 'Third-party Agent',
|
||||
path: '/features/third-party-agent',
|
||||
|
||||
@@ -0,0 +1,70 @@
|
||||
import BetaNotice from '@/components/BetaNotice'
|
||||
import CodeEditor from '@/components/CodeEditor'
|
||||
import { Heading } from '@/components/Heading'
|
||||
|
||||
export default function McpServerPage() {
|
||||
return (
|
||||
<div>
|
||||
<h1 className="text-4xl font-bold mb-6">MCP Server (Beta)</h1>
|
||||
<BetaNotice />
|
||||
<p className="text-xl text-gray-600 dark:text-gray-300 mb-8 leading-relaxed">
|
||||
Use the MCP server to let your local agent send natural-language browser tasks to Page Agent
|
||||
Ext.
|
||||
</p>
|
||||
|
||||
<section className="mb-10">
|
||||
<Heading id="quick-start" className="text-2xl font-bold mb-4">
|
||||
How to use
|
||||
</Heading>
|
||||
<div className="space-y-4">
|
||||
<div className="p-4 bg-blue-50 dark:bg-blue-950/20 rounded-lg border border-blue-200 dark:border-blue-800">
|
||||
<p className="text-sm text-blue-900 dark:text-blue-200 leading-7">
|
||||
1. Install Page Agent Ext in Chrome.
|
||||
<br />
|
||||
2. Add the MCP server to your local agent client.
|
||||
<br />
|
||||
3. Start the client and approve the Hub connection in the browser when prompted.
|
||||
<br />
|
||||
4. Ask your agent to do something in the browser. The client will call execute_task
|
||||
for you.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<CodeEditor
|
||||
code={`{
|
||||
"mcpServers": {
|
||||
"page-agent": {
|
||||
"command": "npx",
|
||||
"args": ["-y", "@page-agent/mcp"],
|
||||
"env": {
|
||||
"LLM_BASE_URL": "https://api.openai.com/v1",
|
||||
"LLM_API_KEY": "sk-xxx",
|
||||
"LLM_MODEL_NAME": "gpt-5.2"
|
||||
}
|
||||
}
|
||||
}
|
||||
}`}
|
||||
language="json"
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section className="mb-10">
|
||||
<Heading id="the-hub" className="text-2xl font-bold mb-4">
|
||||
The Hub
|
||||
</Heading>
|
||||
|
||||
<p className="text-gray-700 dark:text-gray-300 leading-relaxed">
|
||||
The Hub is the control center for communication between Page Agent Ext and external
|
||||
callers.
|
||||
</p>
|
||||
<p className="text-gray-700 dark:text-gray-300 leading-relaxed">
|
||||
When the MCP server starts, it opens a local launcher page. The launcher asks the
|
||||
extension to open the Hub tab, and the Hub receives tasks from your local agent. MCP uses
|
||||
this path, but the Hub itself is the extension's general external communication entry
|
||||
point.
|
||||
</p>
|
||||
</section>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -33,8 +33,8 @@ const MODEL_GROUPS: Record<string, string[]> = {
|
||||
'claude-haiku-4.5',
|
||||
'claude-sonnet-3.5',
|
||||
],
|
||||
xAI: ['grok-4.1-fast', 'grok-4', 'grok-code-fast'],
|
||||
MiniMax: ['MiniMax-M2.7', 'MiniMax-M2.7-highspeed', 'MiniMax-M2.5', 'MiniMax-M2.5-highspeed'],
|
||||
xAI: ['grok-4.1-fast', 'grok-4', 'grok-code-fast'],
|
||||
MoonshotAI: ['kimi-k2.5'],
|
||||
'Z.AI': ['glm-5', 'glm-4.7'],
|
||||
}
|
||||
|
||||
@@ -13,6 +13,7 @@ import ChromeExtension from './features/chrome-extension/page'
|
||||
import Instructions from './features/custom-instructions/page'
|
||||
import CustomTools from './features/custom-tools/page'
|
||||
import DataMasking from './features/data-masking/page'
|
||||
import McpServerPage from './features/mcp-server/page'
|
||||
import Models from './features/models/page'
|
||||
import ThirdPartyAgent from './features/third-party-agent/page'
|
||||
import Limitations from './introduction/limitations/page'
|
||||
@@ -80,6 +81,11 @@ export default function DocsRouter() {
|
||||
<ChromeExtension />
|
||||
</DocsPage>
|
||||
</Route>
|
||||
<Route path="/features/mcp-server">
|
||||
<DocsPage>
|
||||
<McpServerPage />
|
||||
</DocsPage>
|
||||
</Route>
|
||||
<Route path="/features/third-party-agent">
|
||||
<DocsPage>
|
||||
<ThirdPartyAgent />
|
||||
|
||||
@@ -97,6 +97,7 @@ export default function LimitationsPage() {
|
||||
isZh ? '点击、文本输入、选择' : 'Click, text input, select',
|
||||
isZh ? '页面滚动（垂直 / 水平）' : 'Scroll (vertical / horizontal)',
|
||||
isZh ? '表单提交、焦点切换' : 'Form submit, focus',
|
||||
isZh ? '同源 iframe（仅单层）' : 'Same-origin iframe (single level only)',
|
||||
isZh ? '执行 JavaScript（可选）' : 'Execute JavaScript (opt-in)',
|
||||
].map((text) => (
|
||||
<li key={text} className="flex items-center text-gray-700 dark:text-gray-300">
|
||||
@@ -115,6 +116,7 @@ export default function LimitationsPage() {
|
||||
isZh ? '悬停、拖拽、右键菜单' : 'Hover, drag & drop, right-click',
|
||||
isZh ? '键盘快捷键' : 'Keyboard shortcuts',
|
||||
isZh ? '坐标定位操作' : 'Position-based control',
|
||||
isZh ? '嵌套 iframe、跨域 iframe' : 'Nested iframes, cross-origin iframes',
|
||||
isZh ? '绘图操作' : 'Drawing',
|
||||
isZh
|
||||
? 'Monaco、CodeMirror 等需要通过 JS 实例控制的编辑器'
|
||||
|
||||
@@ -103,10 +103,7 @@ export default function HeroSection() {
|
||||
}
|
||||
|
||||
return (
|
||||
<section
|
||||
className="relative px-6 pt-24 py-20 pb-18 lg:py-22 lg:pt-28 overflow-hidden"
|
||||
aria-labelledby="hero-heading"
|
||||
>
|
||||
<section className="relative px-6 pt-18 pb-14 lg:pb-20 lg:pt-24" aria-labelledby="hero-heading">
|
||||
<div className="max-w-7xl mx-auto text-center">
|
||||
{/* Background Pattern + Particles */}
|
||||
<div className="absolute inset-0 opacity-30" aria-hidden="true">
|
||||
@@ -122,7 +119,7 @@ export default function HeroSection() {
|
||||
/>
|
||||
|
||||
<div className="relative z-10">
|
||||
<div className="inline-flex items-center px-4 py-2 mb-8 text-sm font-medium bg-white/90 dark:bg-gray-800/90 rounded-full shadow-lg border border-gray-200 dark:border-gray-700">
|
||||
<div className="inline-flex items-center px-4 py-2 mb-4 text-sm font-medium bg-white/90 dark:bg-gray-800/90 rounded-full shadow-lg border border-gray-200 dark:border-gray-700">
|
||||
<span
|
||||
className="w-2 h-2 bg-blue-500 rounded-full mr-2 animate-pulse"
|
||||
aria-hidden="true"
|
||||
@@ -134,7 +131,7 @@ export default function HeroSection() {
|
||||
|
||||
<h1
|
||||
id="hero-heading"
|
||||
className="text-5xl lg:text-7xl font-bold mb-14 mt-8 bg-linear-to-r from-blue-600 to-purple-600 bg-clip-text text-transparent pb-1"
|
||||
className="text-5xl lg:text-7xl font-bold mb-10 mt-8 bg-linear-to-r from-blue-600 to-purple-600 bg-clip-text text-transparent pb-1"
|
||||
>
|
||||
{isZh ? (
|
||||
<>
|
||||
|
||||
@@ -58,6 +58,22 @@ export default function OneMoreThingSection() {
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<div className="mb-10 rounded-2xl border border-blue-200/70 dark:border-blue-800/70 bg-linear-to-r from-blue-50 to-white dark:from-blue-950/30 dark:to-gray-900 px-5 py-4 max-w-3xl mx-auto text-left sm:text-center">
|
||||
<p className="text-sm text-gray-700 dark:text-gray-300 leading-7">
|
||||
{isZh
|
||||
? '从 Claude Desktop、Copilot 或其他本地 Agent 直接发起浏览器任务？'
|
||||
: 'Using Claude Desktop, Copilot, or another local agent? Connect it to the extension with the MCP server.'}
|
||||
</p>
|
||||
<p>
|
||||
<Link
|
||||
href="/docs/features/mcp-server"
|
||||
className="font-medium text-blue-700 dark:text-blue-300 underline underline-offset-4"
|
||||
>
|
||||
{isZh ? '查看 MCP 文档' : 'Read the MCP docs'}
|
||||
</Link>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="grid sm:grid-cols-3 gap-5 text-left max-w-3xl mx-auto">
|
||||
{[
|
||||
{
|
||||
@@ -67,16 +83,16 @@ export default function OneMoreThingSection() {
|
||||
: 'Run tasks across multiple pages and tabs without being limited to a single page context',
|
||||
},
|
||||
{
|
||||
title: isZh ? '页面内发起控制' : 'Control from Your Page',
|
||||
title: isZh ? '从页面发起控制' : 'Control from a WebPage',
|
||||
desc: isZh
|
||||
? '在页面 JS 中发起任务，驱动整个浏览器完成跨标签操作'
|
||||
: 'Trigger tasks from page JS to drive the entire browser across tabs',
|
||||
: 'Trigger tasks from in-page JS to drive the entire browser across tabs',
|
||||
},
|
||||
{
|
||||
title: isZh ? '外部发起任务' : 'External Triggers',
|
||||
title: isZh ? '外部发起任务' : 'External Caller',
|
||||
desc: isZh
|
||||
? '页面 JS、本地 Agent 或云端 Agent 均可通过扩展发起任务'
|
||||
: 'Page JS, local agents, or cloud agents can trigger tasks through the extension',
|
||||
: 'Local agents and cloud agents can control user browser through the extension',
|
||||
},
|
||||
].map((item) => (
|
||||
<MagicCard
|
||||
|
||||
@@ -27,6 +27,7 @@ const SPA_ROUTES = [
|
||||
'docs/features/custom-instructions',
|
||||
'docs/features/models',
|
||||
'docs/features/chrome-extension',
|
||||
'docs/features/mcp-server',
|
||||
'docs/features/third-party-agent',
|
||||
'docs/advanced/page-agent',
|
||||
'docs/advanced/page-agent-core',
|
||||
|
||||
Reference in New Issue
Block a user