Compare commits
36 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 Simon
|
3d014f15e7 | ||
|
Simon
|
ce8f0fdbd8 | ||
|
Simon
|
48fede38fd | ||
|
Simon
|
f303ed5fc5 | ||
|
Simon
|
6dbc33efd9 | ||
|
Simon
|
53628532df | ||
|
Simon
|
2aae34d74a | ||
|
Simon
|
e27d1fb57f | ||
|
Simon
|
0fa7dc0531 | ||
|
linked-danis
|
89546887bd | ||
|
linked-danis
|
b0bcba2922 | ||
|
Simon
|
618ae8bf14 | ||
|
Simon
|
5ed5d574fd | ||
|
Simon
|
bde9d9023a | ||
|
Simon
|
c8a8858d24 | ||
|
linked-danis
|
6491118cde | ||
|
linked-danis
|
b4acd02007 | ||
|
Simon
|
5695b3d6aa | ||
|
Simon
|
0a160697d1 | ||
|
Wen
|
11d3ca3d6e | ||
|
Simon
|
ee88b23891 | ||
|
Simon
|
ca68be7a56 | ||
|
Simon
|
4ad2abe997 | ||
|
Simon
|
8f08322721 | ||
|
Simon
|
fb043e5a81 | ||
|
Simon
|
1628d48c97 | ||
|
Simon
|
025cb3391e | ||
|
Simon
|
4aab7f991f | ||
|
Simon
|
67846db28f | ||
|
Simon
|
cac55fa2bf | ||
|
Simon
|
a74b7542ba | ||
|
Simon
|
a9f462ed37 | ||
|
Simon
|
c33b3d8278 | ||
|
caibing
|
de3a6e4660 | ||
|
Simon
|
e2c00b1bfc | ||
|
RinZ27
|
c4bdd8fc4b |
@@ -1,7 +1,7 @@
|
||||
MIT License
|
||||
|
||||
Copyright (c) 2026 Alibaba
|
||||
Copyright (c) 2026 Simon
|
||||
Copyright (c) 2026 SimonLuvRamen
|
||||
Copyright (c) 2026 Alibaba Group Holding Limited
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
|
||||
@@ -5,13 +5,13 @@
|
||||
<img alt="Page Agent Banner" src="https://img.alicdn.com/imgextra/i1/O1CN01NCMKXj1Gn4tkFTsxf_!!6000000000666-2-tps-1280-256.png">
|
||||
</picture>
|
||||
|
||||
[](https://opensource.org/licenses/MIT) [](http://www.typescriptlang.org/) [](https://www.npmjs.com/package/page-agent) [](https://bundlephobia.com/package/page-agent) [](https://github.com/alibaba/page-agent)
|
||||
[](https://opensource.org/licenses/MIT) [](http://www.typescriptlang.org/) [](https://bundlephobia.com/package/page-agent) [](https://www.npmjs.com/package/page-agent) [](https://github.com/alibaba/page-agent)
|
||||
|
||||
The GUI Agent Living in Your Webpage. Control web interfaces with natural language.
|
||||
|
||||
🌐 **English** | [中文](./docs/README-zh.md)
|
||||
|
||||
👉 <a href="https://alibaba.github.io/page-agent/" target="_blank"><b>🚀 Demo</b></a> | <a href="https://alibaba.github.io/page-agent/docs/introduction/overview" target="_blank"><b>📖 Documentation</b></a> | <a href="https://news.ycombinator.com/item?id=47264138" target="_blank">📢 Join HN Discussion</a>
|
||||
<a href="https://alibaba.github.io/page-agent/" target="_blank"><b>🚀 Demo</b></a> | <a href="https://alibaba.github.io/page-agent/docs/introduction/overview" target="_blank"><b>📖 Docs</b></a> | <a href="https://news.ycombinator.com/item?id=47264138" target="_blank"><b>📢 HN Discussion</b></a> | <a href="https://x.com/simonluvramen" target="_blank"><b>𝕏 Follow on X</b></a>
|
||||
|
||||
<video id="demo-video" src="https://github.com/user-attachments/assets/a1f2eae2-13fb-4aae-98cf-a3fc1620a6c2" controls crossorigin muted></video>
|
||||
|
||||
@@ -22,20 +22,18 @@ The GUI Agent Living in Your Webpage. Control web interfaces with natural langua
|
||||
- **🎯 Easy integration**
|
||||
- No need for `browser extension` / `python` / `headless browser`.
|
||||
- Just in-page javascript. Everything happens in your web page.
|
||||
- The best tool for your agent to control web pages.
|
||||
- **📖 Text-based DOM manipulation**
|
||||
- No screenshots. No OCR or multi-modal LLMs needed.
|
||||
- No special permissions required.
|
||||
- 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.**
|
||||
|
||||
## 💡 Use Cases
|
||||
|
||||
- **SaaS AI Copilot** — Ship an AI copilot in your product in lines of code. No backend rewrite needed.
|
||||
- **SaaS AI Copilot** — Ship an AI copilot in your product in lines of code. No backend rewrite.
|
||||
- **Smart Form Filling** — Turn 20-click workflows into one sentence. Perfect for ERP, CRM, and admin systems.
|
||||
- **Accessibility** — Make any web app accessible through natural language. Voice commands, screen readers, zero barrier.
|
||||
- **Multi-page Agent** — Extend your agent's reach across browser tabs with the optional [chrome extension](https://alibaba.github.io/page-agent/docs/features/chrome-extension).
|
||||
- **Multi-page Agent** — Extend your own agent's reach across browser tabs with the optional [chrome extension](https://alibaba.github.io/page-agent/docs/features/chrome-extension).
|
||||
|
||||
## 🚀 Quick Start
|
||||
|
||||
@@ -47,12 +45,12 @@ Fastest way to try PageAgent with our free Demo LLM:
|
||||
<script src="{URL}" crossorigin="true"></script>
|
||||
```
|
||||
|
||||
> **⚠️ For technical evaluation only.** This demo CDN uses our free [testing LLM API](https://alibaba.github.io/page-agent/docs/features/models#free-testing-api). By using it, you agree to its [terms](https://github.com/alibaba/page-agent/blob/main/docs/terms-and-privacy.md).
|
||||
|
||||
| Mirrors | URL |
|
||||
| ------- | ---------------------------------------------------------------------------------- |
|
||||
| Global | https://cdn.jsdelivr.net/npm/page-agent@1.5.5/dist/iife/page-agent.demo.js |
|
||||
| China | https://registry.npmmirror.com/page-agent/1.5.5/files/dist/iife/page-agent.demo.js |
|
||||
|
||||
> **⚠️ For technical evaluation only.** This demo CDN uses our free [testing LLM API](https://alibaba.github.io/page-agent/docs/features/models#free-testing-api). By using it, you agree to its [terms](https://github.com/alibaba/page-agent/blob/main/docs/terms-and-privacy.md).
|
||||
| Global | https://cdn.jsdelivr.net/npm/page-agent@1.5.8/dist/iife/page-agent.demo.js |
|
||||
| China | https://registry.npmmirror.com/page-agent/1.5.8/files/dist/iife/page-agent.demo.js |
|
||||
|
||||
### NPM Installation
|
||||
|
||||
@@ -77,10 +75,12 @@ For more programmatic usage, see [📖 Documentations](https://alibaba.github.io
|
||||
|
||||
## 🤝 Contributing
|
||||
|
||||
We welcome contributions from the community! Follow our instructions in [CONTRIBUTING.md](CONTRIBUTING.md) for environment setup and local development.
|
||||
We welcome contributions from the community! Follow our instructions in [CONTRIBUTING.md](CONTRIBUTING.md) for setup and guidelines.
|
||||
|
||||
Please read [Code of Conduct](docs/CODE_OF_CONDUCT.md) before contributing.
|
||||
|
||||
Contributions generated entirely by bots or agents without substantial human involvement will not be accepted, and bot accounts may be blocked.
|
||||
|
||||
## 👏 Acknowledgments
|
||||
|
||||
This project builds upon the excellent work of **[`browser-use`](https://github.com/browser-use/browser-use)**.
|
||||
@@ -90,12 +90,10 @@ This project builds upon the excellent work of **[`browser-use`](https://github.
|
||||
```
|
||||
DOM processing components and prompt are derived from browser-use:
|
||||
|
||||
Browser Use
|
||||
Browser Use <https://github.com/browser-use/browser-use>
|
||||
Copyright (c) 2024 Gregor Zunic
|
||||
Licensed under the MIT License
|
||||
|
||||
Original browser-use project: <https://github.com/browser-use/browser-use>
|
||||
|
||||
We gratefully acknowledge the browser-use project and its contributors for their
|
||||
excellent work on web automation and DOM interaction patterns that helped make
|
||||
this project possible.
|
||||
@@ -114,8 +112,8 @@ file and in the node_modules directory after installation.
|
||||
|
||||
<a href="https://www.star-history.com/?repos=alibaba%2Fpage-agent&type=date">
|
||||
<picture>
|
||||
<source media="(prefers-color-scheme: dark)" srcset="https://api.star-history.com/image?repos=alibaba/page-agent&type=date&theme=dark&legend=top-left&v=2" />
|
||||
<source media="(prefers-color-scheme: light)" srcset="https://api.star-history.com/image?repos=alibaba/page-agent&type=date&legend=top-left&v=2" />
|
||||
<img alt="Star History Chart" src="https://api.star-history.com/image?repos=alibaba/page-agent&type=date&legend=top-left&v=2" />
|
||||
<source media="(prefers-color-scheme: dark)" srcset="https://api.star-history.com/image?repos=alibaba/page-agent&type=date&theme=dark&legend=top-left&v=7" />
|
||||
<source media="(prefers-color-scheme: light)" srcset="https://api.star-history.com/image?repos=alibaba/page-agent&type=date&legend=top-left&v=7" />
|
||||
<img alt="Star History Chart" src="https://api.star-history.com/image?repos=alibaba/page-agent&type=date&legend=top-left&v=7" />
|
||||
</picture>
|
||||
</a>
|
||||
|
||||
+50
@@ -0,0 +1,50 @@
|
||||
# Security Policy
|
||||
|
||||
## Supported Versions
|
||||
|
||||
We provide security fixes on a best-effort basis for:
|
||||
|
||||
| Version | Supported |
|
||||
| --------------------------------------------------------- | --------- |
|
||||
| `main` | Yes |
|
||||
| Latest npm release of `page-agent` and workspace packages | Yes |
|
||||
| Older releases | No |
|
||||
|
||||
Please upgrade to the latest release before reporting an issue against an older build.
|
||||
|
||||
## Reporting a Vulnerability
|
||||
|
||||
Please do not report security vulnerabilities through public GitHub issues, discussions, or pull requests.
|
||||
|
||||
Use GitHub's private vulnerability reporting flow:
|
||||
|
||||
- Open https://github.com/alibaba/page-agent/security/policy
|
||||
- Click `Report a vulnerability`
|
||||
|
||||
If private reporting is unavailable, open a minimal public issue only to request a private contact channel. Do not include exploit details.
|
||||
|
||||
## What to Include
|
||||
|
||||
- Affected package or feature
|
||||
- Exact version, commit, or build
|
||||
- Browser, OS, and runtime environment
|
||||
- Reproduction steps or a proof of concept
|
||||
- Expected impact
|
||||
|
||||
## Scope
|
||||
|
||||
We prioritize reports that show a real security boundary failure, such as:
|
||||
|
||||
- Unauthorized access to data, tokens, or extension capabilities
|
||||
- Bypassing explicit safety constraints
|
||||
- Sensitive data exposure caused by default behavior
|
||||
|
||||
The following usually do not qualify by themselves:
|
||||
|
||||
- Unsafe custom integrations that ignore documented safeguards
|
||||
- Intentionally embedding secrets into client-side builds
|
||||
- Reports against unsupported older versions
|
||||
|
||||
## Disclosure
|
||||
|
||||
Please avoid public disclosure until maintainers have had a reasonable chance to investigate and ship a fix.
|
||||
+15
-19
@@ -5,13 +5,13 @@
|
||||
<img alt="Page Agent Banner" src="https://img.alicdn.com/imgextra/i1/O1CN01NCMKXj1Gn4tkFTsxf_!!6000000000666-2-tps-1280-256.png">
|
||||
</picture>
|
||||
|
||||
[](https://opensource.org/licenses/MIT) [](http://www.typescriptlang.org/) [](https://www.npmjs.com/package/page-agent) [](https://bundlephobia.com/package/page-agent) [](https://github.com/alibaba/page-agent)
|
||||
[](https://opensource.org/licenses/MIT) [](http://www.typescriptlang.org/) [](https://bundlephobia.com/package/page-agent) [](https://www.npmjs.com/package/page-agent) [](https://github.com/alibaba/page-agent)
|
||||
|
||||
纯 JS 实现的 GUI agent。使用自然语言操作你的 Web 应用。无须后端、客户端、浏览器插件。
|
||||
|
||||
🌐 [English](../README.md) | **中文**
|
||||
|
||||
👉 <a href="https://alibaba.github.io/page-agent/" target="_blank"><b>🚀 Demo</b></a> | <a href="https://alibaba.github.io/page-agent/docs/introduction/overview" target="_blank"><b>📖 Documentation</b></a>
|
||||
<a href="https://alibaba.github.io/page-agent/" target="_blank"><b>🚀 Demo</b></a> | <a href="https://alibaba.github.io/page-agent/docs/introduction/overview" target="_blank"><b>📖 Docs</b></a> | <a href="https://news.ycombinator.com/item?id=47264138" target="_blank"><b>📢 HN Discussion</b></a> | <a href="https://x.com/simonluvramen" target="_blank"><b>𝕏 Follow on X</b></a>
|
||||
|
||||
<video id="demo-video" src="https://github.com/user-attachments/assets/a1f2eae2-13fb-4aae-98cf-a3fc1620a6c2" controls crossorigin muted></video>
|
||||
|
||||
@@ -22,20 +22,18 @@
|
||||
- **🎯 轻松集成**
|
||||
- 无需 `浏览器插件` / `Python` / `无头浏览器`。
|
||||
- 纯页面内 JavaScript，一切都在你的网页中完成。
|
||||
- The best tool for your agent to control web pages.
|
||||
- **📖 基于文本的 DOM 操作**
|
||||
- 无需截图，无需 OCR 或多模态模型。
|
||||
- 无需特殊权限。
|
||||
- 无需截图，无需多模态模型或特殊权限。
|
||||
- **🧠 用你自己的 LLM**
|
||||
- **🎨 精美 UI，支持人机协同**
|
||||
- **🐙 可选的 [Chrome 扩展](https://alibaba.github.io/page-agent/docs/features/chrome-extension)，支持跨页面任务。**
|
||||
|
||||
## 💡 应用场景
|
||||
|
||||
- **SaaS AI 副驾驶** — 几行代码为你的产品加上 AI 副驾驶，不需要重写后端。
|
||||
- **SaaS AI 副驾驶** — 几行代码为你的产品加上 AI 副驾驶，无需重写后端。
|
||||
- **智能表单填写** — 把 20 次点击变成一句话。ERP、CRM、管理后台的最佳拍档。
|
||||
- **无障碍增强** — 用自然语言让任何网页无障碍。语音指令、屏幕阅读器，零门槛。
|
||||
- **跨页面 Agent** — 通过可选的 [Chrome 扩展](https://alibaba.github.io/page-agent/docs/features/chrome-extension)，让你的 Agent 跨标签页工作。
|
||||
- **跨页面 Agent** — 通过可选的 [Chrome 扩展](https://alibaba.github.io/page-agent/docs/features/chrome-extension)，让你自己的 Agent 跨标签页工作。
|
||||
|
||||
## 🚀 快速开始
|
||||
|
||||
@@ -47,12 +45,12 @@
|
||||
<script src="{URL}" crossorigin="true"></script>
|
||||
```
|
||||
|
||||
> **⚠️ 仅用于技术评估。** 该 Demo CDN 使用了免费的[测试 LLM API](https://alibaba.github.io/page-agent/docs/features/models#free-testing-api)，使用即表示您同意其[条款](https://github.com/alibaba/page-agent/blob/main/docs/terms-and-privacy.md)。
|
||||
|
||||
| Mirrors | URL |
|
||||
| ------- | ---------------------------------------------------------------------------------- |
|
||||
| Global | https://cdn.jsdelivr.net/npm/page-agent@1.5.5/dist/iife/page-agent.demo.js |
|
||||
| China | https://registry.npmmirror.com/page-agent/1.5.5/files/dist/iife/page-agent.demo.js |
|
||||
|
||||
> **⚠️ 仅用于技术评估。** 该 Demo CDN 使用了免费的[测试 LLM API](https://alibaba.github.io/page-agent/docs/features/models#free-testing-api)，使用即表示您同意其[条款](https://github.com/alibaba/page-agent/blob/main/docs/terms-and-privacy.md)。
|
||||
| Global | https://cdn.jsdelivr.net/npm/page-agent@1.5.8/dist/iife/page-agent.demo.js |
|
||||
| China | https://registry.npmmirror.com/page-agent/1.5.8/files/dist/iife/page-agent.demo.js |
|
||||
|
||||
### NPM 安装
|
||||
|
||||
@@ -77,9 +75,9 @@ await agent.execute('点击登录按钮')
|
||||
|
||||
## 🤝 贡献
|
||||
|
||||
欢迎社区贡献！请参阅 [CONTRIBUTING.md](../CONTRIBUTING.md) 了解环境配置和本地开发说明。
|
||||
欢迎社区贡献！请参阅 [CONTRIBUTING.md](../CONTRIBUTING.md) 了解安装与贡献指南。请在贡献前阅读[行为准则](CODE_OF_CONDUCT.md)。
|
||||
|
||||
请在贡献前阅读[行为准则](CODE_OF_CONDUCT.md)。
|
||||
我们不接受未经实质性人类参与、完全由 Bot 或 Agent 自动生成的代码，机器人账号可能被禁止参与互动。
|
||||
|
||||
## 👏 致谢
|
||||
|
||||
@@ -90,12 +88,10 @@ await agent.execute('点击登录按钮')
|
||||
```
|
||||
DOM processing components and prompt are derived from browser-use:
|
||||
|
||||
Browser Use
|
||||
Browser Use <https://github.com/browser-use/browser-use>
|
||||
Copyright (c) 2024 Gregor Zunic
|
||||
Licensed under the MIT License
|
||||
|
||||
Original browser-use project: <https://github.com/browser-use/browser-use>
|
||||
|
||||
We gratefully acknowledge the browser-use project and its contributors for their
|
||||
excellent work on web automation and DOM interaction patterns that helped make
|
||||
this project possible.
|
||||
@@ -114,8 +110,8 @@ file and in the node_modules directory after installation.
|
||||
|
||||
<a href="https://www.star-history.com/?repos=alibaba%2Fpage-agent&type=date">
|
||||
<picture>
|
||||
<source media="(prefers-color-scheme: dark)" srcset="https://api.star-history.com/image?repos=alibaba/page-agent&type=date&theme=dark&legend=top-left&v=2" />
|
||||
<source media="(prefers-color-scheme: light)" srcset="https://api.star-history.com/image?repos=alibaba/page-agent&type=date&legend=top-left&v=2" />
|
||||
<img alt="Star History Chart" src="https://api.star-history.com/image?repos=alibaba/page-agent&type=date&legend=top-left&v=2" />
|
||||
<source media="(prefers-color-scheme: dark)" srcset="https://api.star-history.com/image?repos=alibaba/page-agent&type=date&theme=dark&legend=top-left&v=7" />
|
||||
<source media="(prefers-color-scheme: light)" srcset="https://api.star-history.com/image?repos=alibaba/page-agent&type=date&legend=top-left&v=7" />
|
||||
<img alt="Star History Chart" src="https://api.star-history.com/image?repos=alibaba/page-agent&type=date&legend=top-left&v=7" />
|
||||
</picture>
|
||||
</a>
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
|
||||
**Last updated:** March 2026
|
||||
|
||||
"We" in this document refers to the maintainers of the open-source Page Agent project (https://github.com/alibaba/page-agent). "The software" refers to PageAgent.js (the JavaScript library) and Page Agent Ext (the browser extension). This document covers the software itself and the testing API we provide — **not** any third-party product or service built with it.
|
||||
"We" in this document refers to the maintainers of the open-source Page Agent project (https://github.com/alibaba/page-agent). "The software" refers to Page Agent (the JavaScript library) and Page Agent Ext (the browser extension). This document covers the software itself and the testing API we provide — **not** any third-party product or service built with it.
|
||||
|
||||
---
|
||||
|
||||
@@ -12,18 +12,18 @@ The software is a **client-side only** tool with a "Bring Your Own Key" (BYOK) a
|
||||
|
||||
All data transmission occurs **only** between your browser and the LLM provider you configure. You are in full control of which provider receives your data.
|
||||
|
||||
- You choose which LLM provider to use
|
||||
- You may configure your own API endpoint at any time
|
||||
- The project is open source under the [MIT License](https://github.com/alibaba/page-agent/blob/main/LICENSE) and can be audited at: https://github.com/alibaba/page-agent
|
||||
The project is open source under the [MIT License](https://github.com/alibaba/page-agent/blob/main/LICENSE) and can be audited at: https://github.com/alibaba/page-agent
|
||||
|
||||
---
|
||||
|
||||
## 2. Testing API and Demo Disclaimer & Terms of Use
|
||||
|
||||
To facilitate easy testing and technical evaluation, we provide a free testing LLM API. This API is used in the project homepage's live demo, the pre-built demo CDN bundles, and the browser extension's default configuration. Users may also use it independently for their own technical evaluation of page-agent.
|
||||
To facilitate easy testing and technical evaluation, we provide a free testing LLM API. This API is used in the project homepage's live demo, the pre-built demo CDN bundles, and the browser extension's default configuration. Users may also use it independently for their own technical evaluation of the software.
|
||||
|
||||
This free testing API is provided **strictly for technical evaluation and R&D purposes only**. It must not be used in any production environment. By using this API, you agree to the following terms:
|
||||
|
||||
- **Permitted Use Only**: This API must be used solely for technical evaluation of the software. Any other use — including integration into other products or services, unlawful activities, violation of the underlying LLM provider's usage policies, or automated scraping at scale — is strictly prohibited.
|
||||
|
||||
- **No Sensitive Data**: You are strictly prohibited from inputting any Personal Identifiable Information (PII), confidential business data, financial/medical records, or using this agent on web pages containing such sensitive information.
|
||||
|
||||
- **Data Processing**: We do not store or log your prompts, webpage data (HTML), or any submitted content, nor do we use such data for model training. All data is processed in-transit and immediately discarded. We perform in-memory request validation to prevent abuse of the testing API, and temporarily process IP addresses for rate-limiting purposes. No data from these processes is retained. Data is processed through Alibaba Cloud infrastructure, which is subject to its own privacy policy.
|
||||
|
||||
Generated
+19
-19
@@ -1,12 +1,12 @@
|
||||
{
|
||||
"name": "root",
|
||||
"version": "1.5.5",
|
||||
"version": "1.5.8",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "root",
|
||||
"version": "1.5.5",
|
||||
"version": "1.5.8",
|
||||
"license": "MIT",
|
||||
"workspaces": [
|
||||
"packages/page-controller",
|
||||
@@ -11090,11 +11090,11 @@
|
||||
},
|
||||
"packages/core": {
|
||||
"name": "@page-agent/core",
|
||||
"version": "1.5.5",
|
||||
"version": "1.5.8",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@page-agent/llms": "1.5.5",
|
||||
"@page-agent/page-controller": "1.5.5",
|
||||
"@page-agent/llms": "1.5.8",
|
||||
"@page-agent/page-controller": "1.5.8",
|
||||
"chalk": "^5.6.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
@@ -11106,13 +11106,13 @@
|
||||
},
|
||||
"packages/extension": {
|
||||
"name": "@page-agent/ext",
|
||||
"version": "0.1.16",
|
||||
"version": "1.5.8",
|
||||
"hasInstallScript": true,
|
||||
"dependencies": {
|
||||
"@page-agent/core": "1.5.5",
|
||||
"@page-agent/llms": "1.5.5",
|
||||
"@page-agent/page-controller": "1.5.5",
|
||||
"@page-agent/ui": "1.5.5",
|
||||
"@page-agent/core": "1.5.8",
|
||||
"@page-agent/llms": "1.5.8",
|
||||
"@page-agent/page-controller": "1.5.8",
|
||||
"@page-agent/ui": "1.5.8",
|
||||
"ai-motion": "^0.4.8",
|
||||
"chalk": "^5.6.2"
|
||||
},
|
||||
@@ -11150,7 +11150,7 @@
|
||||
},
|
||||
"packages/llms": {
|
||||
"name": "@page-agent/llms",
|
||||
"version": "1.5.5",
|
||||
"version": "1.5.8",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"chalk": "^5.6.2"
|
||||
@@ -11163,13 +11163,13 @@
|
||||
}
|
||||
},
|
||||
"packages/page-agent": {
|
||||
"version": "1.5.5",
|
||||
"version": "1.5.8",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@page-agent/core": "1.5.5",
|
||||
"@page-agent/llms": "1.5.5",
|
||||
"@page-agent/page-controller": "1.5.5",
|
||||
"@page-agent/ui": "1.5.5",
|
||||
"@page-agent/core": "1.5.8",
|
||||
"@page-agent/llms": "1.5.8",
|
||||
"@page-agent/page-controller": "1.5.8",
|
||||
"@page-agent/ui": "1.5.8",
|
||||
"chalk": "^5.6.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
@@ -11181,7 +11181,7 @@
|
||||
},
|
||||
"packages/page-controller": {
|
||||
"name": "@page-agent/page-controller",
|
||||
"version": "1.5.5",
|
||||
"version": "1.5.8",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"ai-motion": "^0.4.8"
|
||||
@@ -11189,12 +11189,12 @@
|
||||
},
|
||||
"packages/ui": {
|
||||
"name": "@page-agent/ui",
|
||||
"version": "1.5.5",
|
||||
"version": "1.5.8",
|
||||
"license": "MIT"
|
||||
},
|
||||
"packages/website": {
|
||||
"name": "@page-agent/website",
|
||||
"version": "1.5.5",
|
||||
"version": "1.5.8",
|
||||
"devDependencies": {
|
||||
"@radix-ui/react-icons": "^1.3.2",
|
||||
"@radix-ui/react-separator": "^1.1.8",
|
||||
|
||||
+1
-2
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "root",
|
||||
"private": true,
|
||||
"version": "1.5.5",
|
||||
"version": "1.5.8",
|
||||
"type": "module",
|
||||
"workspaces": [
|
||||
"packages/page-controller",
|
||||
@@ -32,7 +32,6 @@
|
||||
"build:website": "npm run build:website --workspace=@page-agent/website",
|
||||
"build:ext": "npm run build:libs && npm run zip -w @page-agent/ext",
|
||||
"version": "node scripts/sync-version.js",
|
||||
"version:ext": "node scripts/ext-version.js",
|
||||
"lint": "eslint .",
|
||||
"cleanup": "rm -rf packages/*/dist",
|
||||
"prepare": "husky"
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@page-agent/core",
|
||||
"private": false,
|
||||
"version": "1.5.5",
|
||||
"version": "1.5.8",
|
||||
"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.5.5",
|
||||
"@page-agent/page-controller": "1.5.5"
|
||||
"@page-agent/llms": "1.5.8",
|
||||
"@page-agent/page-controller": "1.5.8"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"zod": "^3.25.0 || ^4.0.0"
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
/**
|
||||
* Copyright (C) 2025 Alibaba Group Holding Limited
|
||||
* Copyright (C) 2026 SimonLuvRamen
|
||||
* All rights reserved.
|
||||
*/
|
||||
import { InvokeError, LLM, type Tool } from '@page-agent/llms'
|
||||
@@ -176,7 +177,7 @@ export class PageAgentCore extends EventTarget {
|
||||
}
|
||||
|
||||
/**
|
||||
* Push a observation message to the history event stream.
|
||||
* Push an observation message to the history event stream.
|
||||
* This will be visible in <agent_history> and remain persistent in memory across steps.
|
||||
* @experimental @internal
|
||||
* @note history change will be emitted before next step starts
|
||||
@@ -343,7 +344,7 @@ export class PageAgentCore extends EventTarget {
|
||||
return result
|
||||
}
|
||||
|
||||
await waitFor(0.4) // @TODO: configurable
|
||||
await waitFor(this.config.stepDelay ?? 0.4)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -511,7 +512,8 @@ export class PageAgentCore extends EventTarget {
|
||||
// Accumulated wait time warning
|
||||
if (this.#states.totalWaitTime >= 3) {
|
||||
this.pushObservation(
|
||||
`You have waited ${this.#states.totalWaitTime} seconds accumulatively. DO NOT wait any longer unless you have a good reason.`
|
||||
`You have waited ${this.#states.totalWaitTime} seconds accumulatively. ` +
|
||||
`DO NOT wait any longer unless you have a good reason.`
|
||||
)
|
||||
}
|
||||
|
||||
@@ -527,7 +529,8 @@ export class PageAgentCore extends EventTarget {
|
||||
const remaining = this.config.maxSteps - step
|
||||
if (remaining === 5) {
|
||||
this.pushObservation(
|
||||
`⚠️ Only ${remaining} steps remaining. Consider wrapping up or calling done with partial results.`
|
||||
`⚠️ Only ${remaining} steps remaining. ` +
|
||||
`Consider wrapping up or calling done with partial results.`
|
||||
)
|
||||
} else if (remaining === 2) {
|
||||
this.pushObservation(
|
||||
|
||||
@@ -69,7 +69,7 @@ Strictly follow these rules while using the browser and navigating the web:
|
||||
- By default, only elements in the visible viewport are listed. Use scrolling actions if you suspect relevant content is offscreen which you need to interact with. Scroll ONLY if there are more pixels below or above the page.
|
||||
- You can scroll by a specific number of pages using the num_pages parameter (e.g., 0.5 for half page, 2.0 for two pages).
|
||||
- All the elements that are scrollable are marked with `data-scrollable` attribute. Including the scrollable distance in every directions. You can scroll *the element* in case some area are overflowed.
|
||||
- If a captcha appears, tell user you can not solve captcha. finished the task and ask user to solve it.
|
||||
- If a captcha appears, tell user you can not solve captcha. Finish the task and ask user to solve it.
|
||||
- If expected elements are missing, try scrolling, or navigating back.
|
||||
- If the page is not fully loaded, use the `wait` action.
|
||||
- Do not repeat one action for more than 3 times unless some conditions changed.
|
||||
@@ -87,11 +87,11 @@ Strictly follow these rules while using the browser and navigating the web:
|
||||
|
||||
<capability>
|
||||
- You can only handle single page app. Do not jump out of current page.
|
||||
- Do not click on link if it will open in a new page (etc. <a target="_blank">)
|
||||
- Do not click on link if it will open in a new page (e.g., <a target="_blank">)
|
||||
- It is ok to fail the task.
|
||||
- User can be wrong. If the request of user is not achievable, inappropriate or you do not have enough information or tools to achieve it. Tell user to make a better request.
|
||||
- Webpage can be broken. All webpages or apps have bugs. Some bug will make it hard for your job. It's encouraged to tell user the problem of current page. Your feedbacks (including failing) are valuable for user.
|
||||
- Trying to hard can be harmful. Repeating some action back and forth or pushing for a complex procedure with little knowledge can cause unwanted result and harmful side-effects. User would rather you to complete the task with a fail.
|
||||
- Trying too hard can be harmful. Repeating some action back and forth or pushing for a complex procedure with little knowledge can cause unwanted results and harmful side-effects. User would rather you complete the task with a fail.
|
||||
- If you do not have knowledge for the current webpage or task. You must require user to give specific instructions and detailed steps.
|
||||
</capability>
|
||||
|
||||
|
||||
@@ -152,6 +152,12 @@ export interface AgentConfig extends LLMConfig {
|
||||
* @experimental Use with caution - incorrect prompts may break agent behavior.
|
||||
*/
|
||||
customSystemPrompt?: string
|
||||
|
||||
/**
|
||||
* Delay between steps in seconds.
|
||||
* @default 0.4
|
||||
*/
|
||||
stepDelay?: number
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@@ -31,7 +31,7 @@ export function randomID(existingIDs?: string[]): string {
|
||||
id = Math.random().toString(36).substring(2, 11)
|
||||
tryCount++
|
||||
if (tryCount > MAX_TRY) {
|
||||
throw new Error('randomID: too many try')
|
||||
throw new Error('randomID: too many tries')
|
||||
}
|
||||
}
|
||||
|
||||
@@ -61,7 +61,15 @@ const llmsTxtCache = new Map<string, string | null>()
|
||||
|
||||
/** Fetch /llms.txt for a URL's origin. Cached per origin, `null` = tried and not found. */
|
||||
export async function fetchLlmsTxt(url: string): Promise<string | null> {
|
||||
const origin = new URL(url).origin
|
||||
let origin: string
|
||||
try {
|
||||
origin = new URL(url).origin
|
||||
} catch {
|
||||
return null // Invalid URL
|
||||
}
|
||||
// about:blank, data:, file:
|
||||
if (origin === 'null') return null
|
||||
|
||||
if (llmsTxtCache.has(origin)) return llmsTxtCache.get(origin)!
|
||||
|
||||
const endpoint = `${origin}/llms.txt`
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@page-agent/ext",
|
||||
"private": true,
|
||||
"version": "0.1.16",
|
||||
"version": "1.5.8",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "wxt",
|
||||
@@ -38,10 +38,10 @@
|
||||
"wxt": "^0.20.18"
|
||||
},
|
||||
"dependencies": {
|
||||
"@page-agent/core": "1.5.5",
|
||||
"@page-agent/llms": "1.5.5",
|
||||
"@page-agent/page-controller": "1.5.5",
|
||||
"@page-agent/ui": "1.5.5",
|
||||
"@page-agent/core": "1.5.8",
|
||||
"@page-agent/llms": "1.5.8",
|
||||
"@page-agent/page-controller": "1.5.8",
|
||||
"@page-agent/ui": "1.5.8",
|
||||
"ai-motion": "^0.4.8",
|
||||
"chalk": "^5.6.2"
|
||||
},
|
||||
|
||||
@@ -52,7 +52,7 @@ export function handleTabControlMessage(
|
||||
.create({ url: payload.url, active: false })
|
||||
.then((newTab) => {
|
||||
debug('open_new_tab: success', newTab)
|
||||
sendResponse({ success: true, tabId: newTab.id, windowId: newTab.windowId })
|
||||
sendResponse({ success: true, tabId: newTab.id })
|
||||
})
|
||||
.catch((error) => {
|
||||
sendResponse({ error: error instanceof Error ? error.message : String(error) })
|
||||
@@ -63,7 +63,7 @@ export function handleTabControlMessage(
|
||||
case 'create_tab_group': {
|
||||
debug('create_tab_group', payload)
|
||||
chrome.tabs
|
||||
.group({ tabIds: payload.tabIds, createProperties: { windowId: payload.windowId } })
|
||||
.group({ tabIds: payload.tabIds })
|
||||
.then((groupId) => {
|
||||
debug('create_tab_group: success', groupId)
|
||||
sendResponse({ success: true, groupId })
|
||||
|
||||
@@ -27,7 +27,6 @@ export class TabsController extends EventTarget {
|
||||
private initialTabId: number | null = null
|
||||
private tabGroupId: number | null = null
|
||||
private task: string = ''
|
||||
private windowId: number | null = null
|
||||
|
||||
async init(task: string, includeInitialTab: boolean = true) {
|
||||
debug('init', task, includeInitialTab)
|
||||
@@ -37,7 +36,6 @@ export class TabsController extends EventTarget {
|
||||
this.currentTabId = null
|
||||
this.tabGroupId = null
|
||||
this.initialTabId = null
|
||||
this.windowId = null
|
||||
|
||||
const result = await sendMessage({
|
||||
type: 'TAB_CONTROL',
|
||||
@@ -53,7 +51,6 @@ export class TabsController extends EventTarget {
|
||||
if (includeInitialTab) {
|
||||
this.currentTabId = this.initialTabId
|
||||
|
||||
// update tab status immediately
|
||||
const info = await sendMessage({
|
||||
type: 'TAB_CONTROL',
|
||||
action: 'get_tab_info',
|
||||
@@ -67,6 +64,8 @@ export class TabsController extends EventTarget {
|
||||
title: info.title,
|
||||
status: info.status,
|
||||
})
|
||||
|
||||
await this.createTabGroup([this.initialTabId])
|
||||
}
|
||||
|
||||
await this.updateCurrentTabId(this.currentTabId)
|
||||
@@ -132,9 +131,6 @@ export class TabsController extends EventTarget {
|
||||
}
|
||||
|
||||
const tabId = result.tabId as number
|
||||
const windowId = result.windowId as number
|
||||
|
||||
this.windowId = windowId
|
||||
|
||||
this.tabs.push({
|
||||
id: tabId,
|
||||
@@ -144,32 +140,7 @@ export class TabsController extends EventTarget {
|
||||
await this.switchToTab(tabId)
|
||||
|
||||
if (!this.tabGroupId) {
|
||||
const result = await sendMessage({
|
||||
type: 'TAB_CONTROL',
|
||||
action: 'create_tab_group',
|
||||
payload: { tabIds: [tabId], windowId: this.windowId },
|
||||
})
|
||||
|
||||
if (!result.success) {
|
||||
throw new Error(`Failed to create tab group: ${result.error}`)
|
||||
}
|
||||
|
||||
const groupId = result.groupId as number
|
||||
|
||||
this.tabGroupId = groupId
|
||||
|
||||
await sendMessage({
|
||||
type: 'TAB_CONTROL',
|
||||
action: 'update_tab_group',
|
||||
payload: {
|
||||
groupId: this.tabGroupId,
|
||||
properties: {
|
||||
title: `PageAgent(${this.task})`,
|
||||
color: randomColor(),
|
||||
collapsed: false,
|
||||
},
|
||||
},
|
||||
})
|
||||
await this.createTabGroup([tabId])
|
||||
} else {
|
||||
await sendMessage({
|
||||
type: 'TAB_CONTROL',
|
||||
@@ -230,6 +201,33 @@ export class TabsController extends EventTarget {
|
||||
}
|
||||
}
|
||||
|
||||
private async createTabGroup(tabIds: number[]) {
|
||||
const result = await sendMessage({
|
||||
type: 'TAB_CONTROL',
|
||||
action: 'create_tab_group',
|
||||
payload: { tabIds },
|
||||
})
|
||||
|
||||
if (!result?.success) {
|
||||
throw new Error(`Failed to create tab group: ${result?.error}`)
|
||||
}
|
||||
|
||||
this.tabGroupId = result.groupId as number
|
||||
|
||||
await sendMessage({
|
||||
type: 'TAB_CONTROL',
|
||||
action: 'update_tab_group',
|
||||
payload: {
|
||||
groupId: this.tabGroupId,
|
||||
properties: {
|
||||
title: `PageAgent(${this.task})`,
|
||||
color: randomColor(),
|
||||
collapsed: false,
|
||||
},
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
async updateCurrentTabId(tabId: number | null) {
|
||||
debug('updateCurrentTabId', tabId)
|
||||
|
||||
@@ -309,16 +307,7 @@ interface TabMeta {
|
||||
status?: 'loading' | 'unloaded' | 'complete'
|
||||
}
|
||||
|
||||
const TAB_GROUP_COLORS = [
|
||||
'grey',
|
||||
'blue',
|
||||
'red',
|
||||
'yellow',
|
||||
'green',
|
||||
'pink',
|
||||
'purple',
|
||||
'cyan',
|
||||
] as const
|
||||
const TAB_GROUP_COLORS = ['blue', 'red', 'yellow', 'green', 'pink', 'purple', 'cyan'] as const
|
||||
|
||||
type TabGroupColor = (typeof TAB_GROUP_COLORS)[number]
|
||||
|
||||
|
||||
@@ -71,7 +71,7 @@ Strictly follow these rules while using the browser and navigating the web:
|
||||
- By default, only elements in the visible viewport are listed. Use scrolling actions if you suspect relevant content is offscreen which you need to interact with. Scroll ONLY if there are more pixels below or above the page.
|
||||
- You can scroll by a specific number of pages using the num_pages parameter (e.g., 0.5 for half page, 2.0 for two pages).
|
||||
- All the elements that are scrollable are marked with `data-scrollable` attribute. Including the scrollable distance in every directions. You can scroll *the element* in case some area are overflowed.
|
||||
- If a captcha appears, tell user you can not solve captcha. finished the task and ask user to solve it.
|
||||
- If a captcha appears, tell user you can not solve captcha. Finish the task and ask user to solve it.
|
||||
- If expected elements are missing, try scrolling, or navigating back.
|
||||
- If the page is not fully loaded, use the `wait` action.
|
||||
- Do not repeat one action for more than 3 times unless some conditions changed.
|
||||
|
||||
@@ -110,9 +110,9 @@ export default defineUnlistedScript(() => {
|
||||
)
|
||||
}
|
||||
|
||||
;(window as any).PAGE_AGENT_EXT_VERSION = __EXT_VERSION__
|
||||
;(window as any).PAGE_AGENT_EXT_VERSION = __VERSION__
|
||||
;(window as any).PAGE_AGENT_EXT = {
|
||||
version: __EXT_VERSION__,
|
||||
version: __VERSION__,
|
||||
execute,
|
||||
stop,
|
||||
}
|
||||
|
||||
@@ -286,6 +286,10 @@ export function ConfigPanel({ config, onSave, onClose }: ConfigPanelProps) {
|
||||
{/* 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">
|
||||
<span>
|
||||
Version <span className="font-mono">v{__VERSION__}</span>
|
||||
</span>
|
||||
|
||||
<a
|
||||
href="https://github.com/alibaba/page-agent"
|
||||
target="_blank"
|
||||
@@ -297,7 +301,9 @@ export function ConfigPanel({ config, onSave, onClose }: ConfigPanelProps) {
|
||||
</svg>
|
||||
<span>Source Code</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col items-end">
|
||||
<a
|
||||
href="https://alibaba.github.io/page-agent/"
|
||||
target="_blank"
|
||||
@@ -315,18 +321,9 @@ export function ConfigPanel({ config, onSave, onClose }: ConfigPanelProps) {
|
||||
className="flex items-center gap-1 hover:text-foreground"
|
||||
>
|
||||
<HatGlasses className="size-3" />
|
||||
<span>Privacy Policy</span>
|
||||
<span>Privacy</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 */}
|
||||
|
||||
+1
-2
@@ -1,2 +1 @@
|
||||
declare const __EXT_VERSION__: string
|
||||
declare const __CORE_VERSION__: string
|
||||
declare const __VERSION__: string
|
||||
|
||||
@@ -19,8 +19,7 @@ export default defineConfig({
|
||||
vite: () => ({
|
||||
plugins: [tailwindcss()],
|
||||
define: {
|
||||
__EXT_VERSION__: JSON.stringify(pkg.version),
|
||||
__CORE_VERSION__: JSON.stringify(pkg.dependencies['@page-agent/core']),
|
||||
__VERSION__: JSON.stringify(pkg.version),
|
||||
},
|
||||
optimizeDeps: {
|
||||
force: true,
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@page-agent/llms",
|
||||
"version": "1.5.5",
|
||||
"version": "1.5.8",
|
||||
"type": "module",
|
||||
"main": "./dist/lib/page-agent-llms.js",
|
||||
"module": "./dist/lib/page-agent-llms.js",
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "page-agent",
|
||||
"private": false,
|
||||
"version": "1.5.5",
|
||||
"version": "1.5.8",
|
||||
"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.5.5",
|
||||
"@page-agent/llms": "1.5.5",
|
||||
"@page-agent/page-controller": "1.5.5",
|
||||
"@page-agent/ui": "1.5.5",
|
||||
"@page-agent/core": "1.5.8",
|
||||
"@page-agent/llms": "1.5.8",
|
||||
"@page-agent/page-controller": "1.5.8",
|
||||
"@page-agent/ui": "1.5.8",
|
||||
"chalk": "^5.6.2"
|
||||
},
|
||||
"peerDependencies": {
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@page-agent/page-controller",
|
||||
"version": "1.5.5",
|
||||
"version": "1.5.8",
|
||||
"type": "module",
|
||||
"main": "./dist/lib/page-controller.js",
|
||||
"module": "./dist/lib/page-controller.js",
|
||||
|
||||
@@ -213,14 +213,18 @@ export async function selectOptionElement(selectElement: HTMLSelectElement, opti
|
||||
await waitFor(0.1) // Wait to ensure change event processing completes
|
||||
}
|
||||
|
||||
interface ScrollableElement extends HTMLElement {
|
||||
scrollIntoViewIfNeeded?: (centerIfNeeded?: boolean) => void
|
||||
}
|
||||
|
||||
export async function scrollIntoViewIfNeeded(element: HTMLElement) {
|
||||
const el = element as any
|
||||
if (el.scrollIntoViewIfNeeded) {
|
||||
const el = element as ScrollableElement
|
||||
if (typeof el.scrollIntoViewIfNeeded === 'function') {
|
||||
el.scrollIntoViewIfNeeded()
|
||||
// await waitFor(0.5) // Animation playback
|
||||
} else {
|
||||
// @todo visibility check
|
||||
el.scrollIntoView({ behavior: 'auto', block: 'center', inline: 'nearest' })
|
||||
element.scrollIntoView({ behavior: 'auto', block: 'center', inline: 'nearest' })
|
||||
// await waitFor(0.5) // Animation playback
|
||||
}
|
||||
}
|
||||
|
||||
@@ -17,6 +17,7 @@
|
||||
* @edit add `data-browser-use-ignore` attribute
|
||||
* @edit improve `sampleRect`, filter out rects with 0 area
|
||||
* @edit exclude aria-hidden elements
|
||||
* @edit make sure attributes exist for interactive candidates.
|
||||
*/
|
||||
|
||||
export default (
|
||||
@@ -1608,6 +1609,18 @@ export default (
|
||||
* @edit direct dom ref
|
||||
*/
|
||||
nodeData.ref = node
|
||||
|
||||
/**
|
||||
* @edit make sure attributes exist for interactive candidates.
|
||||
* @note if the element failed the isInteractiveCandidate, attributes would be empty.
|
||||
*/
|
||||
if (nodeData.isInteractive && Object.keys(nodeData.attributes).length === 0) {
|
||||
const attributeNames = node.getAttributeNames?.() || []
|
||||
for (const name of attributeNames) {
|
||||
const value = node.getAttribute(name)
|
||||
nodeData.attributes[name] = value
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -7,3 +7,7 @@
|
||||
|
||||
display: none;
|
||||
}
|
||||
|
||||
.wrapper.visible {
|
||||
display: block;
|
||||
}
|
||||
|
||||
@@ -151,7 +151,7 @@ export class SimulatorMask {
|
||||
this.motion?.start()
|
||||
this.motion?.fadeIn()
|
||||
|
||||
this.wrapper.style.display = 'block'
|
||||
this.wrapper.classList.add(styles.visible)
|
||||
|
||||
// Initialize cursor position
|
||||
this.#currentCursorX = window.innerWidth / 2
|
||||
@@ -172,7 +172,7 @@ export class SimulatorMask {
|
||||
this.#cursor.classList.remove(cursorStyles.clicking)
|
||||
|
||||
setTimeout(() => {
|
||||
this.wrapper.style.display = 'none'
|
||||
this.wrapper.classList.remove(styles.visible)
|
||||
}, 800) // Match the animation duration
|
||||
}
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@page-agent/ui",
|
||||
"version": "1.5.5",
|
||||
"version": "1.5.8",
|
||||
"type": "module",
|
||||
"main": "./dist/lib/page-agent-ui.js",
|
||||
"module": "./dist/lib/page-agent-ui.js",
|
||||
|
||||
@@ -18,7 +18,7 @@ interface CardOptions {
|
||||
export function createCard({ icon, content, meta, type }: CardOptions): string {
|
||||
const typeClass = type ? styles[type] : ''
|
||||
const contentHtml = Array.isArray(content)
|
||||
? `<div class="${styles.reflectionLines}">${content.join('')}</div>`
|
||||
? `<div class="${styles.reflectionLines}">${content.map((line) => `<span>${escapeHtml(line)}</span>`).join('')}</div>`
|
||||
: `<span>${escapeHtml(content)}</span>`
|
||||
|
||||
return `
|
||||
@@ -40,13 +40,13 @@ export function createReflectionLines(reflection: {
|
||||
}): string[] {
|
||||
const lines: string[] = []
|
||||
if (reflection.evaluation_previous_goal) {
|
||||
lines.push(`<div>🔍 ${escapeHtml(reflection.evaluation_previous_goal)}</div>`)
|
||||
lines.push(`🔍 ${reflection.evaluation_previous_goal}`)
|
||||
}
|
||||
if (reflection.memory) {
|
||||
lines.push(`<div>💾 ${escapeHtml(reflection.memory)}</div>`)
|
||||
lines.push(`💾 ${reflection.memory}`)
|
||||
}
|
||||
if (reflection.next_goal) {
|
||||
lines.push(`<div>🎯 ${escapeHtml(reflection.next_goal)}</div>`)
|
||||
lines.push(`🎯 ${reflection.next_goal}`)
|
||||
}
|
||||
return lines
|
||||
}
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@page-agent/website",
|
||||
"private": true,
|
||||
"version": "1.5.5",
|
||||
"version": "1.5.8",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite --host 0.0.0.0",
|
||||
|
||||
@@ -0,0 +1,4 @@
|
||||
User-agent: *
|
||||
Allow: /
|
||||
|
||||
Sitemap: https://alibaba.github.io/page-agent/sitemap.xml
|
||||
@@ -1,4 +1,4 @@
|
||||
import { siGithub } from 'simple-icons'
|
||||
import { siGithub, siX } from 'simple-icons'
|
||||
|
||||
import { useLanguage } from '@/i18n/context'
|
||||
|
||||
@@ -12,9 +12,21 @@ export default function Footer() {
|
||||
>
|
||||
<div className="max-w-7xl mx-auto px-6 py-6">
|
||||
<div className="flex flex-col md:flex-row justify-between items-center space-y-4 md:space-y-0">
|
||||
<p className="text-gray-600 dark:text-gray-300 text-sm">
|
||||
© 2026 page-agent. All rights reserved.
|
||||
</p>
|
||||
<div className="text-gray-600 dark:text-gray-300 text-sm text-center md:text-left">
|
||||
<p>© 2026 page-agent. All rights reserved.</p>
|
||||
<p>
|
||||
Built with ♥️ by{' '}
|
||||
<a
|
||||
href="https://x.com/simonluvramen"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="hover:text-gray-900 dark:hover:text-white transition-colors duration-200"
|
||||
>
|
||||
Simon
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center space-x-6">
|
||||
<a
|
||||
href="https://github.com/alibaba/page-agent/blob/main/docs/terms-and-privacy.md"
|
||||
@@ -24,6 +36,22 @@ export default function Footer() {
|
||||
>
|
||||
{isZh ? '使用条款与隐私' : 'Terms & Privacy'}
|
||||
</a>
|
||||
<a
|
||||
href="https://x.com/simonluvramen"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="text-gray-600 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white transition-colors duration-200"
|
||||
aria-label="X (Twitter)"
|
||||
>
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
className="w-4 h-4 fill-current"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<path d={siX.path} />
|
||||
</svg>
|
||||
</a>
|
||||
<a
|
||||
href="https://github.com/alibaba/page-agent"
|
||||
target="_blank"
|
||||
|
||||
@@ -3,6 +3,7 @@ import { useState } from 'react'
|
||||
import { siGithub } from 'simple-icons'
|
||||
import { Link } from 'wouter'
|
||||
|
||||
import { formatStars, useGitHubStars } from '@/hooks/useGitHubStars'
|
||||
import { useLanguage } from '@/i18n/context'
|
||||
|
||||
import LanguageSwitcher from './LanguageSwitcher'
|
||||
@@ -12,6 +13,7 @@ import { HyperText } from './ui/hyper-text'
|
||||
export default function Header() {
|
||||
const { isZh } = useLanguage()
|
||||
const [mobileMenuOpen, setMobileMenuOpen] = useState(false)
|
||||
const stars = useGitHubStars()
|
||||
|
||||
return (
|
||||
<>
|
||||
@@ -34,8 +36,11 @@ export default function Header() {
|
||||
className="w-10 h-10 rounded-xl group-hover:scale-110 transition-transform duration-200"
|
||||
/>
|
||||
<div>
|
||||
<span className="text-base sm:text-xl font-bold text-gray-900 dark:text-white block leading-tight">
|
||||
<span className="text-base sm:text-xl font-bold text-gray-900 dark:text-white leading-tight flex items-baseline gap-1.5">
|
||||
page-agent
|
||||
<span className="hidden sm:inline text-[10px] font-mono font-normal text-gray-400 dark:text-gray-500 tabular-nums before:content-['v']">
|
||||
{import.meta.env.VERSION}
|
||||
</span>
|
||||
</span>
|
||||
<HyperText
|
||||
as="p"
|
||||
@@ -66,7 +71,7 @@ export default function Header() {
|
||||
href="https://github.com/alibaba/page-agent"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="p-2 rounded-lg text-gray-600 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800 hover:text-blue-600 dark:hover:text-blue-400 transition-colors duration-200 shrink-0"
|
||||
className="flex items-center gap-1 p-2 rounded-lg text-gray-600 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800 hover:text-blue-600 dark:hover:text-blue-400 transition-colors duration-200 shrink-0"
|
||||
aria-label="GitHub"
|
||||
>
|
||||
<svg
|
||||
@@ -77,6 +82,9 @@ export default function Header() {
|
||||
>
|
||||
<path d={siGithub.path} />
|
||||
</svg>
|
||||
{stars !== null && (
|
||||
<span className="text-sm tabular-nums">★ {formatStars(stars)}</span>
|
||||
)}
|
||||
</a>
|
||||
</nav>
|
||||
|
||||
@@ -86,9 +94,6 @@ export default function Header() {
|
||||
role="navigation"
|
||||
aria-label={isZh ? '文档' : 'Docs'}
|
||||
>
|
||||
<span className="text-xs font-mono text-gray-400 dark:text-gray-500 tabular-nums before:content-['v']">
|
||||
{import.meta.env.VERSION}
|
||||
</span>
|
||||
<Link
|
||||
href="/docs/introduction/overview"
|
||||
className="flex items-center gap-1.5 text-gray-600 dark:text-gray-300 hover:text-blue-600 dark:hover:text-blue-400 transition-colors duration-200"
|
||||
@@ -112,6 +117,9 @@ export default function Header() {
|
||||
<path d={siGithub.path} />
|
||||
</svg>
|
||||
GitHub
|
||||
{stars !== null && (
|
||||
<span className="text-sm font-medium tabular-nums ">★ {formatStars(stars)}</span>
|
||||
)}
|
||||
</a>
|
||||
<ThemeSwitcher />
|
||||
<LanguageSwitcher />
|
||||
@@ -161,6 +169,11 @@ export default function Header() {
|
||||
<path d={siGithub.path} />
|
||||
</svg>
|
||||
GitHub
|
||||
{stars !== null && (
|
||||
<span className="text-xs tabular-nums text-gray-400 dark:text-gray-500">
|
||||
★ {formatStars(stars)}
|
||||
</span>
|
||||
)}
|
||||
</a>
|
||||
<div className="flex items-center gap-3 px-3 py-2">
|
||||
<ThemeSwitcher />
|
||||
|
||||
@@ -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.5.5/dist/iife/page-agent.demo.js'
|
||||
'https://cdn.jsdelivr.net/npm/page-agent@1.5.8/dist/iife/page-agent.demo.js'
|
||||
export const CDN_DEMO_CN_URL =
|
||||
'https://registry.npmmirror.com/page-agent/1.5.5/files/dist/iife/page-agent.demo.js'
|
||||
'https://registry.npmmirror.com/page-agent/1.5.8/files/dist/iife/page-agent.demo.js'
|
||||
|
||||
// Demo LLM for website testing (homepage quick trial uses flash)
|
||||
export const DEMO_MODEL = 'qwen3.5-flash'
|
||||
|
||||
@@ -0,0 +1,27 @@
|
||||
import { useEffect, useState } from 'react'
|
||||
|
||||
const STATS_URL = 'https://page-agent.github.io/gh-stats/stats.json'
|
||||
|
||||
let cached: number | null = null
|
||||
|
||||
export function useGitHubStars() {
|
||||
const [stars, setStars] = useState(cached)
|
||||
|
||||
useEffect(() => {
|
||||
if (cached !== null) return
|
||||
fetch(STATS_URL)
|
||||
.then((r) => r.json())
|
||||
.then((data) => {
|
||||
cached = data.stargazers_count ?? null
|
||||
setStars(cached)
|
||||
})
|
||||
.catch(() => {})
|
||||
}, [])
|
||||
|
||||
return stars
|
||||
}
|
||||
|
||||
export function formatStars(n: number): string {
|
||||
if (n >= 1000) return `${(n / 1000).toFixed(1).replace(/\.0$/, '')}k`
|
||||
return String(n)
|
||||
}
|
||||
@@ -1,4 +1,4 @@
|
||||
@import 'tailwindcss';
|
||||
@import 'tailwindcss' important;
|
||||
@import 'tw-animate-css';
|
||||
|
||||
@custom-variant dark (&:is(.dark *));
|
||||
|
||||
@@ -0,0 +1,9 @@
|
||||
import { useEffect } from 'react'
|
||||
|
||||
const DEFAULT_TITLE = 'PageAgent - The GUI Agent Living in Your Webpage'
|
||||
|
||||
export function useDocumentTitle(title?: string) {
|
||||
useEffect(() => {
|
||||
document.title = title ? `${title} - PageAgent` : DEFAULT_TITLE
|
||||
}, [title])
|
||||
}
|
||||
@@ -4,6 +4,7 @@ import { Link, useLocation } from 'wouter'
|
||||
|
||||
import { SparklesText } from '@/components/ui/sparkles-text'
|
||||
import { useLanguage } from '@/i18n/context'
|
||||
import { useDocumentTitle } from '@/lib/useDocumentTitle'
|
||||
|
||||
interface DocsLayoutProps {
|
||||
children: ReactNode
|
||||
@@ -65,6 +66,12 @@ export default function DocsLayout({ children }: DocsLayoutProps) {
|
||||
},
|
||||
]
|
||||
|
||||
const activeTitle = navigationSections
|
||||
.flatMap((s) => s.items)
|
||||
.find((item) => item.path === location)?.title
|
||||
|
||||
useDocumentTitle(activeTitle)
|
||||
|
||||
return (
|
||||
<div className="max-w-7xl mx-auto px-6 py-8 overflow-x-auto">
|
||||
<div className="flex gap-8 min-w-225">
|
||||
|
||||
@@ -116,6 +116,9 @@ export default function LimitationsPage() {
|
||||
isZh ? '键盘快捷键' : 'Keyboard shortcuts',
|
||||
isZh ? '坐标定位操作' : 'Position-based control',
|
||||
isZh ? '绘图操作' : 'Drawing',
|
||||
isZh
|
||||
? 'Monaco、CodeMirror 等需要通过 JS 实例控制的编辑器'
|
||||
: 'Monaco, CodeMirror and other editors that require JS instance access',
|
||||
].map((text) => (
|
||||
<li key={text} className="flex items-center text-gray-700 dark:text-gray-300">
|
||||
<span className="mr-2 text-red-600 dark:text-red-400">✗</span>
|
||||
@@ -128,8 +131,8 @@ export default function LimitationsPage() {
|
||||
</div>
|
||||
|
||||
{/* Understanding Limitations */}
|
||||
<Heading id="understanding" className="text-2xl font-bold mb-3 mt-6">
|
||||
{isZh ? '理解能力' : 'Understanding'}
|
||||
<Heading id="text-based-approach" className="text-2xl font-bold mb-3 mt-6">
|
||||
{isZh ? '基于文本的方案' : 'Text-Based Approach'}
|
||||
</Heading>
|
||||
|
||||
<p className="mb-2 font-medium">
|
||||
|
||||
@@ -1,5 +1,7 @@
|
||||
import { Suspense, lazy } from 'react'
|
||||
|
||||
import { useDocumentTitle } from '@/lib/useDocumentTitle'
|
||||
|
||||
import HeroSection from './HeroSection'
|
||||
|
||||
const FeaturesSection = lazy(() => import('./FeaturesSection'))
|
||||
@@ -7,6 +9,8 @@ const ScenariosSection = lazy(() => import('./ScenariosSection'))
|
||||
const OneMoreThingSection = lazy(() => import('./OneMoreThingSection'))
|
||||
|
||||
export default function HomePage() {
|
||||
useDocumentTitle()
|
||||
|
||||
return (
|
||||
<>
|
||||
<HeroSection />
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import tailwindcss from '@tailwindcss/vite'
|
||||
import react from '@vitejs/plugin-react-swc'
|
||||
import { config as dotenvConfig } from 'dotenv'
|
||||
import { copyFileSync, mkdirSync, readFileSync } from 'node:fs'
|
||||
import { copyFileSync, mkdirSync, readFileSync, writeFileSync } from 'node:fs'
|
||||
import process from 'node:process'
|
||||
import { dirname, join, resolve } from 'path'
|
||||
import { fileURLToPath } from 'url'
|
||||
@@ -35,6 +35,8 @@ const SPA_ROUTES = [
|
||||
'docs/advanced/security-permissions',
|
||||
]
|
||||
|
||||
const SITE_URL = 'https://alibaba.github.io/page-agent'
|
||||
|
||||
function spaRoutes() {
|
||||
return {
|
||||
name: 'spa-routes',
|
||||
@@ -47,6 +49,19 @@ function spaRoutes() {
|
||||
copyFileSync(src, join(dir, 'index.html'))
|
||||
}
|
||||
console.log(` ✓ Copied index.html to ${SPA_ROUTES.length} SPA routes`)
|
||||
|
||||
const today = new Date().toISOString().split('T')[0]
|
||||
const urls = ['', ...SPA_ROUTES]
|
||||
.map(
|
||||
(route) =>
|
||||
` <url>\n <loc>${SITE_URL}/${route}</loc>\n <lastmod>${today}</lastmod>\n </url>`
|
||||
)
|
||||
.join('\n')
|
||||
writeFileSync(
|
||||
join(dist, 'sitemap.xml'),
|
||||
`<?xml version="1.0" encoding="UTF-8"?>\n<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">\n${urls}\n</urlset>\n`
|
||||
)
|
||||
console.log(` ✓ Generated sitemap.xml with ${SPA_ROUTES.length + 1} URLs`)
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,41 +0,0 @@
|
||||
#!/usr/bin/env node
|
||||
/**
|
||||
* Bump extension version and show git tag commands
|
||||
*
|
||||
* Usage:
|
||||
* node scripts/ext-version.js 0.1.16
|
||||
*/
|
||||
import chalk from 'chalk'
|
||||
import { readFileSync, writeFileSync } from 'fs'
|
||||
import { dirname, join } from 'path'
|
||||
import { exit } from 'process'
|
||||
import { fileURLToPath } from 'url'
|
||||
|
||||
const __dirname = dirname(fileURLToPath(import.meta.url))
|
||||
const pkgPath = join(__dirname, '..', 'packages', 'extension', 'package.json')
|
||||
|
||||
const newVersion = process.argv[2]
|
||||
if (!newVersion) {
|
||||
console.log(chalk.yellow('⚠️ Usage: npm run ext:version <version>\n'))
|
||||
exit(1)
|
||||
}
|
||||
|
||||
const pkg = JSON.parse(readFileSync(pkgPath, 'utf-8'))
|
||||
const oldVersion = pkg.version
|
||||
|
||||
pkg.version = newVersion
|
||||
writeFileSync(pkgPath, JSON.stringify(pkg, null, ' ') + '\n')
|
||||
|
||||
console.log(
|
||||
chalk.green.bold('\n✓') +
|
||||
` ${chalk.bold('@page-agent/ext')}: ${chalk.dim(oldVersion)} → ${chalk.yellow(newVersion)}\n`
|
||||
)
|
||||
|
||||
const tagName = `EXT_v${newVersion}`
|
||||
console.log(chalk.cyan.bold('📋 Next steps:\n'))
|
||||
console.log(chalk.blueBright(`npm i`))
|
||||
console.log(
|
||||
chalk.blueBright(`git add . && git commit -m "chore(ext): bump version to ${newVersion}"`)
|
||||
)
|
||||
console.log(chalk.blueBright(`git tag -a ${tagName} -m "${tagName}"`))
|
||||
console.log(chalk.blueBright(`git push && git push origin ${tagName}\n`))
|
||||
+13
-14
@@ -4,7 +4,7 @@
|
||||
*
|
||||
* Usage:
|
||||
* node scripts/sync-version.js # Sync current version from root
|
||||
* node scripts/sync-version.js 0.1.0 # Set and sync new version
|
||||
* node scripts/sync-version.js 0.1.0 # Set root version, then sync all packages
|
||||
*/
|
||||
import chalk from 'chalk'
|
||||
import { existsSync, readFileSync, readdirSync, writeFileSync } from 'fs'
|
||||
@@ -15,19 +15,18 @@ import { fileURLToPath } from 'url'
|
||||
const __dirname = dirname(fileURLToPath(import.meta.url))
|
||||
const rootDir = join(__dirname, '..')
|
||||
|
||||
// Parse arguments
|
||||
const versionArg = process.argv[2]
|
||||
|
||||
if (!versionArg) {
|
||||
console.log(chalk.yellow('⚠️ No version specified.\n'))
|
||||
exit(1)
|
||||
}
|
||||
|
||||
// Read root package.json
|
||||
const rootPkgPath = join(rootDir, 'package.json')
|
||||
const rootPkg = JSON.parse(readFileSync(rootPkgPath, 'utf-8'))
|
||||
const oldVersion = rootPkg.version
|
||||
const newVersion = versionArg
|
||||
const newVersion = versionArg ?? rootPkg.version
|
||||
|
||||
if (!newVersion) {
|
||||
console.log(chalk.yellow('⚠️ No version found in root package.json.\n'))
|
||||
exit(1)
|
||||
}
|
||||
|
||||
console.log(chalk.cyan.bold('\n📦 Syncing version\n'))
|
||||
|
||||
@@ -35,7 +34,10 @@ console.log(chalk.cyan.bold('\n📦 Syncing version\n'))
|
||||
if (versionArg) {
|
||||
rootPkg.version = newVersion
|
||||
writeFileSync(rootPkgPath, JSON.stringify(rootPkg, null, ' ') + '\n')
|
||||
console.log(chalk.green('✓') + ` ${chalk.bold('root')} → ${chalk.yellow(newVersion)}`)
|
||||
console.log(
|
||||
chalk.green('✓') +
|
||||
` ${chalk.bold('root')}: ${chalk.dim(oldVersion)} → ${chalk.yellow(newVersion)}`
|
||||
)
|
||||
} else {
|
||||
console.log(chalk.dim(' root:') + ` ${chalk.yellow(newVersion)} ${chalk.dim('(source)')}`)
|
||||
}
|
||||
@@ -78,11 +80,8 @@ for (const pkg of packages) {
|
||||
const pkgJson = JSON.parse(readFileSync(pkgPath, 'utf-8'))
|
||||
let pkgChanged = false
|
||||
|
||||
// Skip extension package version (it has its own versioning)
|
||||
const isExtension = pkg === 'extension'
|
||||
|
||||
// Update package version (skip extension)
|
||||
if (!isExtension && pkgJson.version !== newVersion) {
|
||||
// Update package version
|
||||
if (pkgJson.version !== newVersion) {
|
||||
pkgJson.version = newVersion
|
||||
pkgChanged = true
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user