skills.rest
Chensihakniroth
ChensihaknirothCOMMUNITY
Explore all skills by this author →
GitHub

page-agent

Embed alibaba/page-agent into web applications for natural-language in-page UI control.

Updated Jun 7, 2026
Search Tags:#javascript#llm#web#copilot#dom#page-agent#gui agent
One-click install
npx skills add https://github.com/Chensihakniroth/ANAKOT-AGENT --skill page-agent-chensihakniroth
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: page-agent
Source: https://github.com/Chensihakniroth/ANAKOT-AGENT/tree/main/optional-skills/web-development/page-agent
Command: npx skills add https://github.com/Chensihakniroth/ANAKOT-AGENT --skill page-agent-chensihakniroth

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires page-agent.

What problem does it solve? Web developers want to add an AI copilot to their own SaaS, admin panel, or legacy web app so end-users can drive the interface with natural language instead of clicking through screens, without building browser automation infrastructure. ## Core Features & Use Cases - In-page GUI agent: alibaba/page-agent runs inside the webpage, reads the DOM as text, and executes instructions like "click login, fill username as John" against the live page. - Three integration paths: a 30-second CDN demo for evaluation, an npm package wired to any OpenAI-compatible LLM endpoint (Qwen, OpenAI, Ollama, OpenRouter), or a full source clone for hacking on the agent itself. - Use Case: A developer adds a script tag to their B2B dashboard so users can type "create invoice for Acme Corp and email it" instead of navigating five screens. ## Quick Start Add the page-agent CDN script tag to an HTML page and type a natural-language instruction in the panel that appears.

Frequently Asked Questions about page-agent

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add an AI copilot to my web app with page-agent?▼

Install the page-agent npm package, create a PageAgent instance with your model, baseURL, and apiKey, then call agent.panel.show() for end users or agent.execute() programmatically. Any OpenAI-compatible LLM endpoint works.

How do I test page-agent without installing anything?▼

Add the CDN script tag for page-agent.demo.js to any HTML page or run it as a bookmarklet. A panel appears where you can type instructions, using alibaba's free testing LLM proxy for evaluation only.

Does page-agent work with local LLMs like Ollama?▼

Yes, page-agent supports Ollama by setting baseURL to http://localhost:11434/v1 and choosing a local model such as qwen3:14b. It also works with Qwen DashScope, OpenAI, and OpenRouter endpoints.

Is it safe to put my LLM API key in page-agent client-side code?▼

No, any apiKey passed to PageAgent ships in your JavaScript bundle. For production, proxy LLM calls through your own backend and point baseURL at that proxy instead of exposing keys.

When should I use page-agent versus Playwright or browser automation?▼

Use page-agent when embedding an agent inside your own site for end-users. For server-side browser automation, cross-tab control, or screenshot-based visual grounding, use Playwright, browser-use, or a multimodal browser agent instead.

Related Skills

Explore More Software Engineering Skills→
m4an5you6m4an5you6

page-agent

Embed alibaba/page-agent into web applications for natural-language UI control.

Community
Intermediate
NzettodessNzettodess

phoenix-observability

Trace, evaluate, and monitor LLM applications using the Phoenix observability platform.

Community
Advanced
emilneuraz-aiemilneuraz-ai

data-quality-frameworks

Enforce data quality across pipelines with Great Expectations, dbt tests, and data contracts.

Community
Advanced
hafiznaveedchuhan-ctrlhafiznaveedchuhan-ctrl

browser-use

Automate browser navigation, form filling, and data extraction via Playwright MCP.

Community
Intermediate