skills.rest
loteiron
loteironCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

page-agent

Embed a natural-language GUI copilot inside web applications using DOM-based automation.

Updated Sep 10, 2026
Search Tags:#javascript#LLM integration#web automation#embed#page-agent#gui copilot#dom agent
One-click install
npx skills add https://github.com/loteiron/ZeusAgent --skill page-agent-loteiron
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: page-agent
Source: https://github.com/loteiron/ZeusAgent/tree/main/optional-skills/web-development/page-agent
Command: npx skills add https://github.com/loteiron/ZeusAgent --skill page-agent-loteiron

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires page-agent.

What problem does it solve? Web app users often click through many screens to complete routine tasks. This Skill guides you through embedding alibaba/page-agent, an in-page GUI agent that reads the DOM as text and executes natural-language instructions like "click the login button, then fill username as John" directly inside your existing web application. ## Core Features & Use Cases - In-page AI copilot: Add a floating panel to SaaS dashboards, admin panels, ERP, or CRM tools so end users type instructions instead of navigating menus. - Legacy modernization without rewrites: Drop the agent on top of an existing DOM — no frontend refactoring required. - Flexible LLM backends: Works with any OpenAI-compatible endpoint including Qwen/DashScope, OpenAI, Ollama, and OpenRouter. - Use Case: A B2B invoicing tool embeds page-agent so users can type "create invoice for Acme Corp and email it" instead of clicking through five screens. ## Quick Start Add the page-agent demo CDN script tag to any HTML page to see the copilot panel appear, then follow the npm install path with your own OpenAI-compatible LLM endpoint for production use.

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?▼

Install page-agent via npm, instantiate PageAgent with your model, baseURL, and apiKey, then call agent.panel.show() to display the UI. Users can then type natural-language instructions that execute against the page DOM.

What LLM providers work with page-agent?▼

page-agent works with any OpenAI-compatible endpoint, including Qwen via DashScope, OpenAI, local Ollama models, and OpenRouter. Non-compatible providers like native Anthropic or Gemini APIs need a compatibility proxy such as LiteLLM.

Can I use the page-agent demo CDN in production?▼

No. The demo CDN uses alibaba's free testing LLM proxy, which is rate-limited and restricted to evaluation by their terms. For production, install via npm and proxy LLM calls through your own backend.

Does page-agent work without screenshots or vision models?▼

Yes. page-agent reads the DOM as text rather than capturing screenshots, so it works with standard text-only LLMs. If you need visual grounding, use a multimodal browser agent instead.

Why does page-agent fail to load on some websites?▼

Strict Content-Security-Policy headers can block the CDN script or inline eval. Self-host the bundle from your own origin, and check the browser console for CORS errors on the LLM endpoint or incorrect baseURL values.

When should I use Playwright instead of page-agent?▼

Use Playwright or browser-use for cross-tab automation and external browser control without embedding code. page-agent is designed for the opposite direction: an agent living inside your own webpage for end users.

Related Skills

Explore More Software Engineering Skills→
syeda-hoorain-alisyeda-hoorain-ali

llm-provider-configuration

Configure the OpenAI Agents SDK with a custom base URL and API key for alternative LLM providers.

Community
Intermediate
tylern91tylern91

ai-coding-agent-guardrails

Enforce permission boundaries, secret scanning, and audit trails for AI coding agents.

Community
Advanced
hafidzlvmhafidzlvm
1

e2e

Generate and run end-to-end tests with Playwright.

Community
Basic
23000311472300031147

pair-agent

Shares your authenticated local browser with remote AI agents via isolated, timed sessions.

Community
Advanced