Compare commits

..

13 Commits

Author SHA1 Message Date
Simon a834d37f28 fix(ext): inject versions 2026-02-02 21:11:23 +08:00
Simon 0c3be817c9 style(ext): attribution; dark mode 2026-02-02 21:07:31 +08:00
Simon b8999fdb7c style(ext): improve config panel 2026-02-02 19:51:48 +08:00
Simon 9ba95e96b6 feat(ext): detect user lang 2026-02-02 19:29:30 +08:00
Simon 4459026297 feat: set default lang to english; fix ext lang setting 2026-02-02 19:17:15 +08:00
Simon 98d3016395 style(ext): remove raw section from ResultCard 2026-02-02 19:16:07 +08:00
Simon 15ea488719 fix(ext): save config to storage 2026-02-02 18:48:16 +08:00
Simon 5b2a11c0b2 chore(version): bump version to 1.1.0 2026-02-02 17:28:40 +08:00
Simon c5c6340eb6 chore: ext version 2026-02-02 17:27:58 +08:00
Simon 74aea50875 feat: rename include_attributes to includeAttributes 2026-02-02 17:24:08 +08:00
Simon f86bb03745 Merge branch 'main' of https://github.com/alibaba/page-agent 2026-02-02 16:53:45 +08:00
Simon f6b4447ef7 docs: tips about Ollama 2026-02-02 16:51:51 +08:00
Simon d8ec4cf1ab feat: better action key in prompt example 2026-02-02 13:39:04 +08:00
28 changed files with 274 additions and 80 deletions
+10
View File
@@ -126,6 +126,16 @@ If your lame AI assistant does not support [AGENTS.md](https://agents.md/). Add
LLM_BASE_URL=https://api.your-llm-provider.com/v1
```
- **Ollama example** (tested on 0.15 + qwen3:14b, RTX3090 24GB):
```env
LLM_BASE_URL="http://localhost:11434/v1"
LLM_API_KEY="NA"
LLM_MODEL_NAME="qwen3:14b"
```
> ⚠️ Add `*` to `OLLAMA_ORIGINS` (403). Models < 10B unlikely strong enough. Requires tool_call support. Set context length > 15k (default 4k will NOT work): `$env:OLLAMA_CONTEXT_LENGTH=64000; ollama serve`
- Restart the dev server to load new env vars
- If not provided, the demo will the free testing proxy by default
+3 -3
View File
@@ -40,7 +40,7 @@
```html
<script
src="https://registry.npmmirror.com/page-agent/1.0.1/files/dist/iife/page-agent.demo.js"
src="https://registry.npmmirror.com/page-agent/1.1.0/files/dist/iife/page-agent.demo.js"
crossorigin="true"
></script>
```
@@ -50,8 +50,8 @@
| Mirrors | URL |
| ------- | ---------------------------------------------------------------------------------- |
| Global | https://cdn.jsdelivr.net/npm/page-agent@1.0.1/dist/iife/page-agent.demo.js |
| China | https://registry.npmmirror.com/page-agent/1.0.1/files/dist/iife/page-agent.demo.js |
| Global | https://cdn.jsdelivr.net/npm/page-agent@1.1.0/dist/iife/page-agent.demo.js |
| China | https://registry.npmmirror.com/page-agent/1.1.0/files/dist/iife/page-agent.demo.js |
### NPM 安装
+3 -3
View File
@@ -40,7 +40,7 @@ Fastest way to try PageAgent with our free Demo LLM:
```html
<script
src="https://cdn.jsdelivr.net/npm/page-agent@1.0.1/dist/iife/page-agent.demo.js"
src="https://cdn.jsdelivr.net/npm/page-agent@1.1.0/dist/iife/page-agent.demo.js"
crossorigin="true"
></script>
```
@@ -50,8 +50,8 @@ Fastest way to try PageAgent with our free Demo LLM:
| Mirrors | URL |
| ------- | ---------------------------------------------------------------------------------- |
| Global | https://cdn.jsdelivr.net/npm/page-agent@1.0.1/dist/iife/page-agent.demo.js |
| China | https://registry.npmmirror.com/page-agent/1.0.1/files/dist/iife/page-agent.demo.js |
| Global | https://cdn.jsdelivr.net/npm/page-agent@1.1.0/dist/iife/page-agent.demo.js |
| China | https://registry.npmmirror.com/page-agent/1.1.0/files/dist/iife/page-agent.demo.js |
### NPM Installation
+19 -19
View File
@@ -1,12 +1,12 @@
{
"name": "root",
"version": "1.0.1",
"version": "1.1.0",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "root",
"version": "1.0.1",
"version": "1.1.0",
"license": "MIT",
"workspaces": [
"packages/page-controller",
@@ -11322,24 +11322,24 @@
},
"packages/core": {
"name": "@page-agent/core",
"version": "1.0.1",
"version": "1.1.0",
"license": "MIT",
"dependencies": {
"@page-agent/llms": "1.0.1",
"@page-agent/page-controller": "1.0.1",
"@page-agent/llms": "1.1.0",
"@page-agent/page-controller": "1.1.0",
"chalk": "^5.6.2",
"zod": "^4.3.5"
}
},
"packages/extension": {
"name": "@page-agent/ext",
"version": "0.1.0-b4",
"version": "0.1.0",
"hasInstallScript": true,
"dependencies": {
"@page-agent/core": "1.0.1",
"@page-agent/llms": "1.0.1",
"@page-agent/page-controller": "1.0.1",
"@page-agent/ui": "1.0.1",
"@page-agent/core": "1.1.0",
"@page-agent/llms": "1.1.0",
"@page-agent/page-controller": "1.1.0",
"@page-agent/ui": "1.1.0",
"@radix-ui/react-hover-card": "^1.1.15",
"@radix-ui/react-icons": "^1.3.2",
"@radix-ui/react-label": "^2.1.8",
@@ -11377,7 +11377,7 @@
},
"packages/llms": {
"name": "@page-agent/llms",
"version": "1.0.1",
"version": "1.1.0",
"license": "MIT",
"dependencies": {
"chalk": "^5.6.2",
@@ -11385,20 +11385,20 @@
}
},
"packages/page-agent": {
"version": "1.0.1",
"version": "1.1.0",
"license": "MIT",
"dependencies": {
"@page-agent/core": "1.0.1",
"@page-agent/llms": "1.0.1",
"@page-agent/page-controller": "1.0.1",
"@page-agent/ui": "1.0.1",
"@page-agent/core": "1.1.0",
"@page-agent/llms": "1.1.0",
"@page-agent/page-controller": "1.1.0",
"@page-agent/ui": "1.1.0",
"chalk": "^5.6.2",
"zod": "^4.3.5"
}
},
"packages/page-controller": {
"name": "@page-agent/page-controller",
"version": "1.0.1",
"version": "1.1.0",
"license": "MIT",
"dependencies": {
"ai-motion": "^0.4.8"
@@ -11406,12 +11406,12 @@
},
"packages/ui": {
"name": "@page-agent/ui",
"version": "1.0.1",
"version": "1.1.0",
"license": "MIT"
},
"packages/website": {
"name": "@page-agent/website",
"version": "1.0.1",
"version": "1.1.0",
"dependencies": {
"@radix-ui/react-icons": "^1.3.2",
"@radix-ui/react-separator": "^1.1.8",
+1 -1
View File
@@ -1,7 +1,7 @@
{
"name": "root",
"private": true,
"version": "1.0.1",
"version": "1.1.0",
"type": "module",
"workspaces": [
"packages/page-controller",
+3 -3
View File
@@ -1,7 +1,7 @@
{
"name": "@page-agent/core",
"private": false,
"version": "1.0.1",
"version": "1.1.0",
"type": "module",
"main": "./dist/esm/page-agent-core.js",
"module": "./dist/esm/page-agent-core.js",
@@ -45,7 +45,7 @@
"dependencies": {
"chalk": "^5.6.2",
"zod": "^4.3.5",
"@page-agent/llms": "1.0.1",
"@page-agent/page-controller": "1.0.1"
"@page-agent/llms": "1.1.0",
"@page-agent/page-controller": "1.1.0"
}
}
+1 -3
View File
@@ -417,10 +417,8 @@ export class PageAgentCore extends EventTarget {
return this.config.customSystemPrompt
}
let systemPrompt = SYSTEM_PROMPT
const targetLanguage = this.config.language === 'zh-CN' ? '中文' : 'English'
systemPrompt = systemPrompt.replace(
const systemPrompt = SYSTEM_PROMPT.replace(
/Default working language: \*\*.*?\*\*/,
`Default working language: **${targetLanguage}**`
)
+2 -2
View File
@@ -10,7 +10,7 @@ You excel at following tasks:
</intro>
<language_settings>
- Default working language: **中文**
- Default working language: **English**
- Use the language that user is using. Return in user's language.
</language_settings>
@@ -150,6 +150,6 @@ You must ALWAYS respond with a valid JSON in this exact format:
"evaluation_previous_goal": "Concise one-sentence analysis of your last action. Clearly state success, failure, or uncertain.",
"memory": "1-3 concise sentences of specific memory of this step and overall progress. You should put here everything that will help you track progress in future steps. Like counting pages visited, items found, etc.",
"next_goal": "State the next immediate goal and action to achieve it, in one clear sentence."
"action":{"one_action_name": {// action-specific parameter}}
"action":{"action": {// action-specific parameter}}
}
</output>
+5 -5
View File
@@ -1,7 +1,7 @@
{
"name": "@page-agent/ext",
"private": true,
"version": "0.1.0-b4",
"version": "0.1.0",
"type": "module",
"scripts": {
"dev": "wxt",
@@ -27,10 +27,10 @@
"wxt": "^0.20.13"
},
"dependencies": {
"@page-agent/core": "1.0.1",
"@page-agent/llms": "1.0.1",
"@page-agent/page-controller": "1.0.1",
"@page-agent/ui": "1.0.1",
"@page-agent/core": "1.1.0",
"@page-agent/llms": "1.1.0",
"@page-agent/page-controller": "1.1.0",
"@page-agent/ui": "1.1.0",
"@radix-ui/react-hover-card": "^1.1.15",
"@radix-ui/react-icons": "^1.3.2",
"@radix-ui/react-label": "^2.1.8",
+16 -1
View File
@@ -5,6 +5,12 @@ import { TabsController } from './TabsController'
import SYSTEM_PROMPT from './system_prompt.md?raw'
import { createTabTools } from './tabTools'
/** Detect user language from browser settings */
function detectLanguage(): 'en-US' | 'zh-CN' {
const lang = navigator.language || navigator.languages?.[0] || 'en-US'
return lang.startsWith('zh') ? 'zh-CN' : 'en-US'
}
/**
* MultiPageAgent
* - use with extension
@@ -12,10 +18,19 @@ import { createTabTools } from './tabTools'
*/
export class MultiPageAgent extends PageAgentCore {
constructor(config: Omit<PageAgentConfig, 'pageController'>) {
// multi page controller
const tabsController = new TabsController()
const pageController = new RemotePageController(tabsController)
const customTools = createTabTools(tabsController)
// system prompt - auto-detect language if not specified
const language = config.language ?? detectLanguage()
const targetLanguage = language === 'zh-CN' ? '中文' : 'English'
const systemPrompt = SYSTEM_PROMPT.replace(
/Default working language: \*\*.*?\*\*/,
`Default working language: **${targetLanguage}**`
)
/**
* When the agent is in side-panel and user closed the side-panel.
* There is no chance for isAgentRunning to be set false.
@@ -29,7 +44,7 @@ export class MultiPageAgent extends PageAgentCore {
...config,
pageController: pageController as any,
customTools: customTools,
customSystemPrompt: SYSTEM_PROMPT,
customSystemPrompt: systemPrompt,
onBeforeTask: async (agent) => {
await tabsController.init(agent.task)
@@ -10,7 +10,7 @@ You excel at following tasks:
</intro>
<language_settings>
- Default working language: **中文**
- Default working language: **English**
- Use the language that user is using. Return in user's language.
</language_settings>
@@ -142,6 +142,6 @@ You must ALWAYS respond with a valid JSON in this exact format:
"evaluation_previous_goal": "Concise one-sentence analysis of your last action. Clearly state success, failure, or uncertain.",
"memory": "1-3 concise sentences of specific memory of this step and overall progress. You should put here everything that will help you track progress in future steps. Like counting pages visited, items found, etc.",
"next_goal": "State the next immediate goal and action to achieve it, in one clear sentence."
"action":{"one_action_name": {// action-specific parameter}}
"action":{"action_name": {// action-specific parameter}}
}
</output>
+1
View File
@@ -88,6 +88,7 @@ export function useAgent(): UseAgentResult {
}, [])
const configure = useCallback(async (newConfig: LLMConfig) => {
await chrome.storage.local.set({ llmConfig: newConfig })
setConfig(newConfig)
}, [])
+1 -1
View File
@@ -40,7 +40,7 @@
}
.dark {
--background: oklch(0.145 0 0);
--background: oklch(0.19 0 0);
--foreground: oklch(0.985 0 0);
--card: oklch(0.145 0 0);
--card-foreground: oklch(0.985 0 0);
@@ -82,7 +82,12 @@ export default function App() {
</div>
<div className="flex items-center gap-3">
<StatusDot status={status} />
<Button variant="ghost" size="icon-sm" onClick={() => setShowConfig(true)}>
<Button
variant="ghost"
size="icon-sm"
onClick={() => setShowConfig(true)}
className="cursor-pointer"
>
<Settings className="size-3.5" />
</Button>
</div>
@@ -142,7 +147,7 @@ export default function App() {
variant="default"
onClick={() => handleSubmit()}
disabled={!inputValue.trim()}
className="size-7"
className="size-7 cursor-pointer"
>
<Send className="size-3" />
</InputGroupButton>
@@ -1,11 +1,15 @@
import type { LLMConfig } from '@page-agent/llms'
import { Copy, Loader2 } from 'lucide-react'
import { Copy, CornerUpLeft, Eye, EyeOff, HatGlasses, Home, Loader2, Scale } from 'lucide-react'
import { useEffect, useState } from 'react'
import { siGithub } from 'simple-icons'
import { DEMO_API_KEY, DEMO_BASE_URL, DEMO_MODEL } from '@/agent/constants'
import { Button } from '@/components/ui/button'
import { Input } from '@/components/ui/input'
declare const __EXT_VERSION__: string
declare const __CORE_VERSION__: string
interface ConfigPanelProps {
config: LLMConfig | null
onSave: (config: LLMConfig) => Promise<void>
@@ -19,6 +23,8 @@ export function ConfigPanel({ config, onSave, onClose }: ConfigPanelProps) {
const [saving, setSaving] = useState(false)
const [userAuthToken, setUserAuthToken] = useState<string>('')
const [copied, setCopied] = useState(false)
const [showToken, setShowToken] = useState(false)
const [showApiKey, setShowApiKey] = useState(false)
// Update local state when config prop changes
useEffect(() => {
@@ -69,8 +75,18 @@ export function ConfigPanel({ config, onSave, onClose }: ConfigPanelProps) {
}
return (
<div className="flex flex-col gap-4 p-4">
<h2 className="text-base font-semibold">Settings</h2>
<div className="flex flex-col gap-4 p-4 relative">
<div className="flex items-center justify-between">
<h2 className="text-base font-semibold">Settings</h2>
<Button
variant="ghost"
size="icon-sm"
onClick={onClose}
className="absolute top-2 right-3 cursor-pointer"
>
<CornerUpLeft className="size-3.5" />
</Button>
</div>
{/* User Auth Token Section */}
<div className="flex flex-col gap-1.5 p-3 bg-muted/50 rounded-md border">
@@ -81,9 +97,24 @@ export function ConfigPanel({ config, onSave, onClose }: ConfigPanelProps) {
<div className="flex gap-2 items-center">
<Input
readOnly
value={userAuthToken || 'Loading...'}
value={
userAuthToken
? showToken
? userAuthToken
: `${userAuthToken.slice(0, 4)}${''.repeat(userAuthToken.length - 8)}${userAuthToken.slice(-4)}`
: 'Loading...'
}
className="text-xs h-8 font-mono bg-background"
/>
<Button
variant="outline"
size="icon"
className="h-8 w-8 shrink-0 cursor-pointer"
onClick={() => setShowToken(!showToken)}
disabled={!userAuthToken}
>
{showToken ? <EyeOff className="size-3" /> : <Eye className="size-3" />}
</Button>
<Button
variant="outline"
size="icon"
@@ -118,23 +149,98 @@ export function ConfigPanel({ config, onSave, onClose }: ConfigPanelProps) {
<div className="flex flex-col gap-1.5">
<label className="text-xs text-muted-foreground">API Key</label>
<Input
type="password"
placeholder="sk-..."
value={apiKey}
onChange={(e) => setApiKey(e.target.value)}
className="text-xs h-8"
/>
<div className="flex gap-2 items-center">
<Input
type={showApiKey ? 'text' : 'password'}
placeholder="sk-..."
value={apiKey}
onChange={(e) => setApiKey(e.target.value)}
className="text-xs h-8"
/>
<Button
variant="outline"
size="icon"
className="h-8 w-8 shrink-0 cursor-pointer"
onClick={() => setShowApiKey(!showApiKey)}
>
{showApiKey ? <EyeOff className="size-3" /> : <Eye className="size-3" />}
</Button>
</div>
</div>
<div className="flex gap-2 mt-2">
<Button variant="outline" onClick={onClose} className="flex-1 h-8 text-xs">
<Button variant="outline" onClick={onClose} className="flex-1 h-8 text-xs cursor-pointer">
Cancel
</Button>
<Button onClick={handleSave} disabled={saving} className="flex-1 h-8 text-xs">
<Button
onClick={handleSave}
disabled={saving}
className="flex-1 h-8 text-xs cursor-pointer"
>
{saving ? <Loader2 className="size-3 animate-spin" /> : 'Save'}
</Button>
</div>
{/* Footer */}
<div className="mt-4 mb-4 pt-4 border-t border-border/50 flex gap-2 justify-between text-[10px] text-muted-foreground">
<div className="flex flex-col justify-between">
<a
href="https://github.com/alibaba/page-agent"
target="_blank"
rel="noopener noreferrer"
className="flex items-center gap-1 hover:text-foreground"
>
<svg role="img" viewBox="0 0 24 24" className="size-3 fill-current">
<path d={siGithub.path} />
</svg>
<span>Source Code</span>
</a>
<a
href="https://alibaba.github.io/page-agent/"
target="_blank"
rel="noopener noreferrer"
className="flex items-center gap-1 hover:text-foreground"
>
<Home className="size-3" />
<span>Home Page</span>
</a>
<a
href="https://github.com/alibaba/page-agent/blob/main/packages/extension/PRIVACY.md"
target="_blank"
rel="noopener noreferrer"
className="flex items-center gap-1 hover:text-foreground"
>
<HatGlasses className="size-3" />
<span>Privacy Policy</span>
</a>
</div>
<div className="flex flex-col items-end">
<span>
Extension <span className="font-mono">v{__EXT_VERSION__}</span>
</span>
<span>
PageAgent <span className="font-mono">v{__CORE_VERSION__}</span>
</span>
</div>
</div>
{/* attribute */}
<div className="text-[10px] text-muted-foreground bg-background fixed bottom-0 w-full flex justify-around">
<span className="leading-loose">
Built with ♥️ by{' '}
<a
href="https://github.com/gaomeng1900"
target="_blank"
rel="noopener noreferrer"
className="underline hover:text-foreground"
>
@Simon
</a>
</span>
</div>
</div>
)
}
@@ -315,9 +315,7 @@ export function EventCard({ event }: { event: HistoricalEvent }) {
<ResultCard
success={input?.success ?? true}
text={input?.text || event.action.output || ''}
>
<RawSection rawRequest={event.rawRequest} rawResponse={event.rawResponse} />
</ResultCard>
/>
</>
)
}
@@ -6,6 +6,16 @@ import { ErrorBoundary } from './components/ErrorBoundary'
import '@/assets/index.css'
// Sync dark mode with system preference
const syncDarkMode = () => {
document.documentElement.classList.toggle(
'dark',
matchMedia('(prefers-color-scheme: dark)').matches
)
}
syncDarkMode()
matchMedia('(prefers-color-scheme: dark)').addEventListener('change', syncDarkMode)
ReactDOM.createRoot(document.getElementById('root')!).render(
<React.StrictMode>
<ErrorBoundary>
+7 -1
View File
@@ -1,10 +1,12 @@
import tailwindcss from '@tailwindcss/vite'
import { mkdirSync } from 'node:fs'
import { mkdirSync, readFileSync } from 'node:fs'
import { defineConfig } from 'wxt'
const chromeProfile = '.wxt/chrome-data'
mkdirSync(chromeProfile, { recursive: true })
const pkg = JSON.parse(readFileSync('./package.json', 'utf-8'))
// See https://wxt.dev/api/config.html
export default defineConfig({
srcDir: 'src',
@@ -16,6 +18,10 @@ export default defineConfig({
},
vite: () => ({
plugins: [tailwindcss()],
define: {
__EXT_VERSION__: JSON.stringify(pkg.version),
__CORE_VERSION__: JSON.stringify(pkg.dependencies['@page-agent/core']),
},
optimizeDeps: {
force: true,
},
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@page-agent/llms",
"version": "1.0.1",
"version": "1.1.0",
"type": "module",
"main": "./dist/lib/page-agent-llms.js",
"module": "./dist/lib/page-agent-llms.js",
+5 -5
View File
@@ -1,7 +1,7 @@
{
"name": "page-agent",
"private": false,
"version": "1.0.1",
"version": "1.1.0",
"type": "module",
"main": "./dist/esm/page-agent.js",
"module": "./dist/esm/page-agent.js",
@@ -46,9 +46,9 @@
"dependencies": {
"chalk": "^5.6.2",
"zod": "^4.3.5",
"@page-agent/llms": "1.0.1",
"@page-agent/page-controller": "1.0.1",
"@page-agent/core": "1.0.1",
"@page-agent/ui": "1.0.1"
"@page-agent/llms": "1.1.0",
"@page-agent/page-controller": "1.1.0",
"@page-agent/core": "1.1.0",
"@page-agent/ui": "1.1.0"
}
}
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@page-agent/page-controller",
"version": "1.0.1",
"version": "1.1.0",
"type": "module",
"main": "./dist/lib/page-controller.js",
"module": "./dist/lib/page-controller.js",
@@ -194,7 +194,7 @@ export class PageController extends EventTarget {
interactiveBlacklist: blacklist,
})
this.simplifiedHTML = dom.flatTreeToString(this.flatTree, this.config.include_attributes)
this.simplifiedHTML = dom.flatTreeToString(this.flatTree, this.config.includeAttributes)
this.selectorMap.clear()
this.selectorMap = dom.getSelectorMap(this.flatTree)
+3 -3
View File
@@ -10,7 +10,7 @@ import {
export interface DomConfig {
interactiveBlacklist?: (Element | (() => Element))[]
interactiveWhitelist?: (Element | (() => Element))[]
include_attributes?: string[]
includeAttributes?: string[]
highlightOpacity?: number
highlightLabelOpacity?: number
}
@@ -117,7 +117,7 @@ interface TreeNode {
*
* @todo 数据脱敏过滤器
*/
export function flatTreeToString(flatTree: FlatDomTree, include_attributes?: string[]): string {
export function flatTreeToString(flatTree: FlatDomTree, includeAttributes?: string[]): string {
const DEFAULT_INCLUDE_ATTRIBUTES = [
'title',
'type',
@@ -146,7 +146,7 @@ export function flatTreeToString(flatTree: FlatDomTree, include_attributes?: str
'aria-owns',
]
const includeAttrs = [...(include_attributes || []), ...DEFAULT_INCLUDE_ATTRIBUTES]
const includeAttrs = [...(includeAttributes || []), ...DEFAULT_INCLUDE_ATTRIBUTES]
// Helper function to cap text length
const capTextLength = (text: string, maxLength: number): string => {
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "@page-agent/ui",
"version": "1.0.1",
"version": "1.1.0",
"type": "module",
"main": "./dist/lib/page-agent-ui.js",
"module": "./dist/lib/page-agent-ui.js",
+1 -1
View File
@@ -1,7 +1,7 @@
{
"name": "@page-agent/website",
"private": true,
"version": "1.0.1",
"version": "1.1.0",
"type": "module",
"scripts": {
"dev": "vite --host 0.0.0.0",
+2 -2
View File
@@ -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.0.1/dist/iife/page-agent.demo.js'
'https://cdn.jsdelivr.net/npm/page-agent@1.1.0/dist/iife/page-agent.demo.js'
export const CDN_DEMO_CN_URL =
'https://registry.npmmirror.com/page-agent/1.0.1/files/dist/iife/page-agent.demo.js'
'https://registry.npmmirror.com/page-agent/1.1.0/files/dist/iife/page-agent.demo.js'
// Demo LLM for website testing
export const DEMO_MODEL = 'PAGE-AGENT-FREE-TESTING-RANDOM'
@@ -307,7 +307,7 @@ const result = await agent.execute('Fill in the form with test data')`}
: 'Elements to force include for interaction',
},
{
name: 'include_attributes',
name: 'includeAttributes',
type: 'string[]',
description: isZh
? '在 DOM 提取中包含的额外属性'
@@ -136,8 +136,8 @@ const pageAgent = new PageAgent({
// Self-hosted models (e.g., Ollama)
const pageAgent = new PageAgent({
baseURL: 'http://localhost:11434/v1',
apiKey: 'N/A', // Ollama typically accepts any value
model: 'qwen3:latest'
apiKey: 'NA',
model: 'qwen3:14b'
});
// Free testing endpoint
@@ -149,6 +149,51 @@ const DEMO_API_KEY = 'PAGE-AGENT-FREE-TESTING-RANDOM'
`}
/>
</section>
{/* Ollama Section */}
<section className="mb-10">
<h2 className="text-2xl font-semibold mb-4">Ollama</h2>
<p className="text-sm text-gray-600 dark:text-gray-400 mb-4">
{isZh
? '已在 Ollama 0.15 + qwen3:14b (RTX3090 24GB) 上测试通过。'
: 'Tested on Ollama 0.15 with qwen3:14b (RTX3090 24GB).'}
</p>
<CodeEditor
code={`LLM_BASE_URL="http://localhost:11434/v1"
LLM_API_KEY="NA"
LLM_MODEL_NAME="qwen3:14b"`}
/>
<div className="mt-4 p-4 bg-amber-50 dark:bg-amber-950/20 rounded-lg border border-amber-200 dark:border-amber-800">
<h3 className="font-semibold text-amber-900 dark:text-amber-200 mb-2">
{isZh ? '⚠️ 注意事项' : '⚠️ Important Notes'}
</h3>
<ul className="text-sm text-gray-700 dark:text-gray-300 space-y-2 list-disc pl-5">
<li>
{isZh
? '确保 OLLAMA_ORIGINS 设置为 * 以避免 403 错误'
: 'Add * to OLLAMA_ORIGINS to avoid 403 errors'}
</li>
<li>
{isZh
? '小于 10B 参数的模型通常效果不佳'
: 'Models smaller than 10B are unlikely to be strong enough'}
</li>
<li>{isZh ? '需要支持 tool_call 的模型' : 'Requires tool_call capable models'}</li>
<li>
{isZh
? '确保上下文长度大于输入 token 数,否则 Ollama 会静默截断 prompt。普通页面约需 15k token,随步骤增加。默认 4k 上下文长度无法正常工作'
: 'Ensure context length exceeds input tokens, or Ollama will silently truncate prompts. ~15k tokens for a typical page, increases with steps. Default 4k context length will NOT work'}
<ul className="text-sm text-gray-700 dark:text-gray-300 space-y-2 list-disc pl-5">
<li>
<code className="text-xs bg-gray-200 dark:bg-gray-700 px-1 rounded">
$env:OLLAMA_CONTEXT_LENGTH=64000; ollama serve
</code>
</li>
</ul>
</li>
</ul>
</div>
</section>
</div>
)
}