@cydm/pie 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +150 -0
- package/dist/builtin/extensions/ask-user/index.js +2924 -0
- package/dist/builtin/extensions/changelog/index.js +200 -0
- package/dist/builtin/extensions/compact/index.js +52 -0
- package/dist/builtin/extensions/deploy/index.js +11 -0
- package/dist/builtin/extensions/files/index.js +10 -0
- package/dist/builtin/extensions/init/index.js +144 -0
- package/dist/builtin/extensions/plan-mode/index.js +209 -0
- package/dist/builtin/extensions/questionnaire/index.js +2753 -0
- package/dist/builtin/extensions/subagent/index.js +7350 -0
- package/dist/builtin/extensions/todo/index.js +162 -0
- package/dist/builtin/skills/browser-tools/CHANGELOG.md +47 -0
- package/dist/builtin/skills/browser-tools/README.md +106 -0
- package/dist/builtin/skills/browser-tools/SKILL.md +196 -0
- package/dist/builtin/skills/browser-tools/browser-content.js +103 -0
- package/dist/builtin/skills/browser-tools/browser-cookies.js +35 -0
- package/dist/builtin/skills/browser-tools/browser-eval.js +49 -0
- package/dist/builtin/skills/browser-tools/browser-hn-scraper.js +108 -0
- package/dist/builtin/skills/browser-tools/browser-nav.js +44 -0
- package/dist/builtin/skills/browser-tools/browser-pick.js +162 -0
- package/dist/builtin/skills/browser-tools/browser-screenshot.js +34 -0
- package/dist/builtin/skills/browser-tools/browser-start.js +86 -0
- package/dist/builtin/skills/browser-tools/package.json +19 -0
- package/dist/builtin/skills/skill-creator/LICENSE.txt +202 -0
- package/dist/builtin/skills/skill-creator/SKILL.md +485 -0
- package/dist/builtin/skills/skill-creator/agents/analyzer.md +274 -0
- package/dist/builtin/skills/skill-creator/agents/comparator.md +202 -0
- package/dist/builtin/skills/skill-creator/agents/grader.md +223 -0
- package/dist/builtin/skills/skill-creator/assets/eval_review.html +146 -0
- package/dist/builtin/skills/skill-creator/eval-viewer/generate_review.py +471 -0
- package/dist/builtin/skills/skill-creator/eval-viewer/viewer.html +1325 -0
- package/dist/builtin/skills/skill-creator/references/schemas.md +430 -0
- package/dist/builtin/skills/skill-creator/scripts/__init__.py +0 -0
- package/dist/builtin/skills/skill-creator/scripts/aggregate_benchmark.py +401 -0
- package/dist/builtin/skills/skill-creator/scripts/generate_report.py +326 -0
- package/dist/builtin/skills/skill-creator/scripts/improve_description.py +247 -0
- package/dist/builtin/skills/skill-creator/scripts/package_skill.py +136 -0
- package/dist/builtin/skills/skill-creator/scripts/quick_validate.py +103 -0
- package/dist/builtin/skills/skill-creator/scripts/run_eval.py +310 -0
- package/dist/builtin/skills/skill-creator/scripts/run_loop.py +328 -0
- package/dist/builtin/skills/skill-creator/scripts/utils.py +47 -0
- package/dist/cli.js +74440 -0
- package/dist/theme/dark.json +85 -0
- package/dist/theme/light.json +84 -0
- package/package.json +61 -0
|
@@ -0,0 +1,162 @@
|
|
|
1
|
+
import { createRequire as __createRequire } from "node:module"; const require = __createRequire(import.meta.url);
|
|
2
|
+
|
|
3
|
+
// builtin/extensions/todo/index.ts
|
|
4
|
+
async function readTodos(cwd) {
|
|
5
|
+
try {
|
|
6
|
+
const fs = await import("fs");
|
|
7
|
+
const path = await import("path");
|
|
8
|
+
const todosPath = path.join(cwd, ".pie", "todos.md");
|
|
9
|
+
if (fs.existsSync(todosPath)) {
|
|
10
|
+
return fs.readFileSync(todosPath, "utf-8");
|
|
11
|
+
}
|
|
12
|
+
} catch {
|
|
13
|
+
}
|
|
14
|
+
return null;
|
|
15
|
+
}
|
|
16
|
+
function todoExtension(ctx) {
|
|
17
|
+
ctx.log("Todo extension loaded");
|
|
18
|
+
ctx.registerCommand({
|
|
19
|
+
path: ["tools", "todo"],
|
|
20
|
+
description: "Smart task extraction and management",
|
|
21
|
+
handler: async (ctx2, args) => {
|
|
22
|
+
const fs = await import("fs");
|
|
23
|
+
const path = await import("path");
|
|
24
|
+
const todosPath = path.join(ctx2.cwd, ".pie", "todos.md");
|
|
25
|
+
const pieDir = path.join(ctx2.cwd, ".pie");
|
|
26
|
+
if (!fs.existsSync(pieDir)) {
|
|
27
|
+
fs.mkdirSync(pieDir, { recursive: true });
|
|
28
|
+
}
|
|
29
|
+
const command = args?.trim();
|
|
30
|
+
const existingTodos = await readTodos(ctx2.cwd);
|
|
31
|
+
if (command?.match(/^done\s+\d+/i)) {
|
|
32
|
+
const match = command.match(/done\s+(\d+)/i);
|
|
33
|
+
const id = match ? parseInt(match[1], 10) : 0;
|
|
34
|
+
if (!existingTodos) return "No todos.md file found.";
|
|
35
|
+
return `\u8BF7\u5C06 .pie/todos.md \u4E2D\u7B2C ${id} \u4E2A\u672A\u5B8C\u6210\u4EFB\u52A1\u6807\u8BB0\u4E3A\u5DF2\u5B8C\u6210\uFF1A
|
|
36
|
+
|
|
37
|
+
\u5F53\u524D\u6587\u4EF6\u5185\u5BB9\uFF1A
|
|
38
|
+
\`\`\`
|
|
39
|
+
${existingTodos}
|
|
40
|
+
\`\`\`
|
|
41
|
+
|
|
42
|
+
\u8981\u6C42\uFF1A
|
|
43
|
+
1. \u627E\u5230\u7B2C ${id} \u4E2A\u4EE5 "- [ ]" \u5F00\u5934\u7684\u4EFB\u52A1
|
|
44
|
+
2. \u5C06\u5176\u6539\u4E3A "- [x]"\uFF08\u4FDD\u7559\u539F\u6709\u5185\u5BB9\u548C\u4F18\u5148\u7EA7\u6807\u8BB0\uFF09
|
|
45
|
+
3. \u5728\u672B\u5C3E\u6DFB\u52A0\u5B8C\u6210\u65F6\u95F4\u6CE8\u91CA\uFF1A<!-- completed: YYYY-MM-DD -->
|
|
46
|
+
4. \u4F7F\u7528 write \u5DE5\u5177\u66F4\u65B0\u6587\u4EF6
|
|
47
|
+
5. \u62A5\u544A\u5B8C\u6210\u4E86\u54EA\u4E2A\u4EFB\u52A1`;
|
|
48
|
+
}
|
|
49
|
+
if (command?.toLowerCase() === "clear") {
|
|
50
|
+
if (!existingTodos) return "No todos.md file found.";
|
|
51
|
+
return `\u8BF7\u6E05\u7406 .pie/todos.md \u4E2D\u7684\u5DF2\u5B8C\u6210\u4EFB\u52A1\uFF1A
|
|
52
|
+
|
|
53
|
+
\u5F53\u524D\u6587\u4EF6\u5185\u5BB9\uFF1A
|
|
54
|
+
\`\`\`
|
|
55
|
+
${existingTodos}
|
|
56
|
+
\`\`\`
|
|
57
|
+
|
|
58
|
+
\u8981\u6C42\uFF1A
|
|
59
|
+
1. \u79FB\u9664\u6240\u6709\u4EE5 "- [x]" \u5F00\u5934\u7684\u5DF2\u5B8C\u6210\u4EFB\u52A1
|
|
60
|
+
2. \u4FDD\u7559\u6240\u6709 "- [ ]" \u672A\u5B8C\u6210\u4EFB\u52A1
|
|
61
|
+
3. \u4FDD\u7559\u6587\u4EF6\u6807\u9898\u548C\u5176\u4ED6\u7ED3\u6784
|
|
62
|
+
4. \u4F7F\u7528 write \u5DE5\u5177\u66F4\u65B0\u6587\u4EF6
|
|
63
|
+
5. \u62A5\u544A\u6E05\u7406\u4E86\u591A\u5C11\u4E2A\u5DF2\u5B8C\u6210\u4EFB\u52A1`;
|
|
64
|
+
}
|
|
65
|
+
if (command?.toLowerCase().startsWith("add ")) {
|
|
66
|
+
const description = command.slice(4).trim();
|
|
67
|
+
ctx2.ui.notify("\u{1F4DD} \u6B63\u5728\u5206\u6790\u4EFB\u52A1...", "info");
|
|
68
|
+
return `\u8BF7\u5C06\u4EE5\u4E0B\u63CF\u8FF0\u8F6C\u6362\u4E3A\u7ED3\u6784\u5316\u7684 todo \u6761\u76EE\u5E76\u6DFB\u52A0\u5230 .pie/todos.md\uFF1A
|
|
69
|
+
|
|
70
|
+
\u63CF\u8FF0\uFF1A"${description}"
|
|
71
|
+
|
|
72
|
+
${existingTodos ? `
|
|
73
|
+
\u5F53\u524D todos.md \u5185\u5BB9\uFF1A
|
|
74
|
+
\`\`\`
|
|
75
|
+
${existingTodos}
|
|
76
|
+
\`\`\`` : ""}
|
|
77
|
+
|
|
78
|
+
\u4EFB\u52A1\uFF1A
|
|
79
|
+
1. \u5206\u6790\u63CF\u8FF0\uFF0C\u786E\u5B9A\uFF1A
|
|
80
|
+
- \u4EFB\u52A1\u7C7B\u578B\uFF1Afeature / bug / refactor / docs / test / other
|
|
81
|
+
- \u4F18\u5148\u7EA7\uFF1Ahigh / medium / low\uFF08\u6839\u636E\u7D27\u6025\u7A0B\u5EA6\u548C\u5F71\u54CD\u5224\u65AD\uFF09
|
|
82
|
+
- \u6E05\u6670\u7B80\u6D01\u7684\u4EFB\u52A1\u63CF\u8FF0
|
|
83
|
+
|
|
84
|
+
2. \u751F\u6210\u683C\u5F0F\uFF1A
|
|
85
|
+
- [ ] ![{priority}] [{type}] {description}
|
|
86
|
+
|
|
87
|
+
\u793A\u4F8B\uFF1A
|
|
88
|
+
- [ ] ![high] [bug] \u4FEE\u590D\u767B\u5F55\u9875\u9762\u7684\u5185\u5B58\u6CC4\u6F0F
|
|
89
|
+
- [ ] ![medium] [feature] \u6DFB\u52A0\u7528\u6237\u5BFC\u51FA\u529F\u80FD
|
|
90
|
+
- [ ] ![low] [docs] \u66F4\u65B0 API \u6587\u6863
|
|
91
|
+
|
|
92
|
+
3. \u4F7F\u7528 write \u5DE5\u5177\uFF1A
|
|
93
|
+
- \u5982\u679C\u6587\u4EF6\u4E0D\u5B58\u5728\uFF0C\u521B\u5EFA\u6807\u51C6\u683C\u5F0F
|
|
94
|
+
- \u5C06\u65B0\u4EFB\u52A1\u6309\u4F18\u5148\u7EA7\u63D2\u5165\u5230 "## Active" \u90E8\u5206\u7684\u5408\u9002\u4F4D\u7F6E\uFF08high\u5728\u524D\uFF0Clow\u5728\u540E\uFF09
|
|
95
|
+
- \u4FDD\u6301\u73B0\u6709\u4EFB\u52A1\u4E0D\u53D8
|
|
96
|
+
|
|
97
|
+
4. \u62A5\u544A\u6DFB\u52A0\u4E86\u4EC0\u4E48\u4EFB\u52A1`;
|
|
98
|
+
}
|
|
99
|
+
if (command?.toLowerCase() === "priority") {
|
|
100
|
+
if (!existingTodos) return "No todos.md file found.";
|
|
101
|
+
ctx2.ui.notify("\u{1F504} \u6B63\u5728\u6309\u4F18\u5148\u7EA7\u6392\u5E8F...", "info");
|
|
102
|
+
return `\u8BF7\u91CD\u65B0\u6574\u7406 .pie/todos.md \u4E2D\u7684\u4EFB\u52A1\uFF0C\u6309\u4F18\u5148\u7EA7\u6392\u5E8F\uFF1A
|
|
103
|
+
|
|
104
|
+
\u5F53\u524D\u6587\u4EF6\u5185\u5BB9\uFF1A
|
|
105
|
+
\`\`\`
|
|
106
|
+
${existingTodos}
|
|
107
|
+
\`\`\`
|
|
108
|
+
|
|
109
|
+
\u6392\u5E8F\u89C4\u5219\uFF1A
|
|
110
|
+
1. \u672A\u5B8C\u6210\u4EFB\u52A1\u6309\u4F18\u5148\u7EA7\u6392\u5E8F\uFF1Ahigh \u2192 medium \u2192 low
|
|
111
|
+
2. \u540C\u7EA7\u4F18\u5148\u7EA7\u4FDD\u6301\u539F\u6709\u987A\u5E8F
|
|
112
|
+
3. \u5DF2\u5B8C\u6210\u4EFB\u52A1\u653E\u5728\u6700\u540E
|
|
113
|
+
4. \u4FDD\u6301\u6587\u4EF6\u5176\u4ED6\u7ED3\u6784\u4E0D\u53D8
|
|
114
|
+
|
|
115
|
+
\u683C\u5F0F\u4FDD\u6301\uFF1A
|
|
116
|
+
- [ ] ![high] [type] \u63CF\u8FF0
|
|
117
|
+
- [ ] ![medium] [type] \u63CF\u8FF0
|
|
118
|
+
- [ ] ![low] [type] \u63CF\u8FF0
|
|
119
|
+
|
|
120
|
+
\u4F7F\u7528 write \u5DE5\u5177\u66F4\u65B0\u6587\u4EF6\u3002`;
|
|
121
|
+
}
|
|
122
|
+
ctx2.ui.notify("\u{1F50D} \u6B63\u5728\u5206\u6790\u5BF9\u8BDD\u63D0\u53D6\u4EFB\u52A1...", "info");
|
|
123
|
+
return `\u{1F50D} \u667A\u80FD\u4EFB\u52A1\u63D0\u53D6
|
|
124
|
+
|
|
125
|
+
\u8BF7\u5206\u6790\u6211\u4EEC\u7684\u5BF9\u8BDD\u5386\u53F2\uFF0C\u63D0\u53D6\u6240\u6709\u9700\u8981\u540E\u7EED\u5904\u7406\u7684\u4EFB\u52A1\u3002
|
|
126
|
+
|
|
127
|
+
${existingTodos ? `\u5F53\u524D\u5DF2\u6709\u4EFB\u52A1\uFF08\u907F\u514D\u91CD\u590D\uFF09\uFF1A
|
|
128
|
+
\`\`\`
|
|
129
|
+
${existingTodos}
|
|
130
|
+
\`\`\`
|
|
131
|
+
` : ""}
|
|
132
|
+
|
|
133
|
+
\u63D0\u53D6\u6807\u51C6\uFF1A
|
|
134
|
+
1. **\u660E\u786E\u7684\u5F85\u529E** - "\u6211\u4EEC\u9700\u8981..."\u3001"\u8FD8\u8981..."\u3001"TODO..."
|
|
135
|
+
2. **\u53D1\u73B0\u7684\u95EE\u9898** - "\u8FD9\u91CC\u6709 bug"\u3001"\u9700\u8981\u4FEE\u590D..."
|
|
136
|
+
3. **\u6539\u8FDB\u5EFA\u8BAE** - "\u5E94\u8BE5\u4F18\u5316..."\u3001"\u53EF\u4EE5\u91CD\u6784..."
|
|
137
|
+
4. **\u540E\u7EED\u5DE5\u4F5C** - "\u63A5\u4E0B\u6765..."\u3001"\u4E4B\u540E\u8981..."
|
|
138
|
+
5. **\u672A\u5B8C\u6210\u4E8B\u9879** - \u5BF9\u8BDD\u4E2D\u63D0\u53CA\u4F46\u672A\u5B8C\u6210\u7684\u52A8\u4F5C
|
|
139
|
+
|
|
140
|
+
\u5FFD\u7565\uFF1A
|
|
141
|
+
- \u5DF2\u7ECF\u660E\u786E\u8BF4"\u5B8C\u6210"\u7684\u4E8B\u9879
|
|
142
|
+
- \u592A\u6A21\u7CCA\u65E0\u6CD5\u6267\u884C\u7684\u60F3\u6CD5
|
|
143
|
+
- \u5F53\u524D\u5BF9\u8BDD\u4E2D\u5DF2\u7ECF\u89E3\u51B3\u7684\u95EE\u9898
|
|
144
|
+
|
|
145
|
+
\u8F93\u51FA\u683C\u5F0F\uFF08\u5982\u679C\u63D0\u53D6\u5230\u4EFB\u52A1\uFF09\uFF1A
|
|
146
|
+
|
|
147
|
+
## \u53D1\u73B0\u7684\u4EFB\u52A1
|
|
148
|
+
|
|
149
|
+
| # | \u4F18\u5148\u7EA7 | \u7C7B\u578B | \u4EFB\u52A1\u63CF\u8FF0 |
|
|
150
|
+
|---|--------|------|----------|
|
|
151
|
+
| 1 | \u{1F534} high | bug | \u4FEE\u590D xxx \u95EE\u9898 |
|
|
152
|
+
| 2 | \u{1F7E1} medium | feature | \u6DFB\u52A0 xxx \u529F\u80FD |
|
|
153
|
+
|
|
154
|
+
\u8BF7\u4F7F\u7528 write \u5DE5\u5177\u5C06\u63D0\u53D6\u5230\u7684\u4EFB\u52A1\u6DFB\u52A0\u5230 .pie/todos.md\u3002
|
|
155
|
+
\u5982\u679C\u6CA1\u6709\u53D1\u73B0\u65B0\u4EFB\u52A1\uFF0C\u76F4\u63A5\u62A5\u544A\u5373\u53EF\u3002`;
|
|
156
|
+
}
|
|
157
|
+
});
|
|
158
|
+
ctx.log("Todo extension ready");
|
|
159
|
+
}
|
|
160
|
+
export {
|
|
161
|
+
todoExtension as default
|
|
162
|
+
};
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
# Changelog
|
|
2
|
+
|
|
3
|
+
All notable changes to this project will be documented in this file.
|
|
4
|
+
|
|
5
|
+
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
|
|
6
|
+
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
|
7
|
+
|
|
8
|
+
## [1.1.0] - 2025-03-10
|
|
9
|
+
|
|
10
|
+
### Fixed
|
|
11
|
+
|
|
12
|
+
- **browser-eval.js**: Fixed complex JavaScript code execution
|
|
13
|
+
- Support for "const", "let", "var" keywords
|
|
14
|
+
- Support for multi-line code and conditionals (if/else, for, while)
|
|
15
|
+
- Support for function declarations and calls
|
|
16
|
+
- Automatic expression return value handling
|
|
17
|
+
- Fixed AsyncFunction wrapping syntax errors
|
|
18
|
+
|
|
19
|
+
### Improved
|
|
20
|
+
|
|
21
|
+
- Improved code execution logic using eval() instead of complex AsyncFunction wrapping
|
|
22
|
+
- Support for more complex browser automation scenarios (e.g., MagicShell 10-round dialog testing)
|
|
23
|
+
|
|
24
|
+
## [1.0.0] - 2025-03-09
|
|
25
|
+
|
|
26
|
+
### Initial Release
|
|
27
|
+
|
|
28
|
+
- Basic browser automation toolset
|
|
29
|
+
- Chrome DevTools Protocol support
|
|
30
|
+
- Included tools:
|
|
31
|
+
- browser-start.js: Start Chrome
|
|
32
|
+
- browser-nav.js: Page navigation
|
|
33
|
+
- browser-eval.js: JavaScript execution (basic)
|
|
34
|
+
- browser-screenshot.js: Screenshots
|
|
35
|
+
- browser-cookies.js: Cookie management
|
|
36
|
+
- browser-content.js: Content extraction
|
|
37
|
+
- browser-hn-scraper.js: HN scraper example
|
|
38
|
+
- browser-pick.js: Interactive element picker
|
|
39
|
+
|
|
40
|
+
### Dependencies
|
|
41
|
+
|
|
42
|
+
- puppeteer: ^24.31.0
|
|
43
|
+
- puppeteer-core: ^23.11.1
|
|
44
|
+
- @mozilla/readability: ^0.6.0
|
|
45
|
+
- cheerio: ^1.1.2
|
|
46
|
+
- jsdom: ^27.0.1
|
|
47
|
+
- turndown: ^7.2.2
|
|
@@ -0,0 +1,106 @@
|
|
|
1
|
+
# Browser Tools
|
|
2
|
+
|
|
3
|
+
Browser automation tools based on Chrome DevTools Protocol (CDP) for collaborative site exploration and testing.
|
|
4
|
+
|
|
5
|
+
## Tools
|
|
6
|
+
|
|
7
|
+
| Tool | Function | Usage |
|
|
8
|
+
|------|----------|-------|
|
|
9
|
+
| browser-start.js | Start Chrome with remote debugging | node browser-start.js |
|
|
10
|
+
| browser-nav.js | Navigate to URL | node browser-nav.js https://example.com |
|
|
11
|
+
| browser-eval.js | Execute JavaScript in browser | node browser-eval.js "document.title" |
|
|
12
|
+
| browser-screenshot.js | Take screenshot | node browser-screenshot.js |
|
|
13
|
+
| browser-cookies.js | Manage cookies | node browser-cookies.js |
|
|
14
|
+
| browser-content.js | Extract page content | node browser-content.js |
|
|
15
|
+
| browser-hn-scraper.js | HN scraper example | node browser-hn-scraper.js |
|
|
16
|
+
| browser-pick.js | Interactive element picker | node browser-pick.js |
|
|
17
|
+
|
|
18
|
+
## Quick Start
|
|
19
|
+
|
|
20
|
+
### 1. Install dependencies
|
|
21
|
+
|
|
22
|
+
```bash
|
|
23
|
+
npm install
|
|
24
|
+
```
|
|
25
|
+
|
|
26
|
+
### 2. Start Chrome
|
|
27
|
+
|
|
28
|
+
```bash
|
|
29
|
+
node browser-start.js
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
This starts Chrome with remote debugging port (default: 9222).
|
|
33
|
+
|
|
34
|
+
### 3. Use tools
|
|
35
|
+
|
|
36
|
+
```bash
|
|
37
|
+
# Navigate to website
|
|
38
|
+
node browser-nav.js https://www.baidu.com
|
|
39
|
+
|
|
40
|
+
# Execute JavaScript
|
|
41
|
+
node browser-eval.js "document.title"
|
|
42
|
+
|
|
43
|
+
# Complex code execution (supports const/let/var/if)
|
|
44
|
+
node browser-eval.js "
|
|
45
|
+
const links = document.querySelectorAll("a");
|
|
46
|
+
const count = links.length;
|
|
47
|
+
count;
|
|
48
|
+
"
|
|
49
|
+
|
|
50
|
+
# Take screenshot
|
|
51
|
+
node browser-screenshot.js
|
|
52
|
+
```
|
|
53
|
+
|
|
54
|
+
## browser-eval.js Advanced Usage
|
|
55
|
+
|
|
56
|
+
### Simple expressions
|
|
57
|
+
|
|
58
|
+
```bash
|
|
59
|
+
node browser-eval.js "1 + 1" # Output: 2
|
|
60
|
+
node browser-eval.js "document.title" # Output: Page title
|
|
61
|
+
```
|
|
62
|
+
|
|
63
|
+
### Complex code
|
|
64
|
+
|
|
65
|
+
Supports multi-line code, const/let/var, conditionals:
|
|
66
|
+
|
|
67
|
+
```bash
|
|
68
|
+
node browser-eval.js "
|
|
69
|
+
const buttons = document.querySelectorAll("button");
|
|
70
|
+
const count = buttons.length;
|
|
71
|
+
count;
|
|
72
|
+
"
|
|
73
|
+
|
|
74
|
+
node browser-eval.js "
|
|
75
|
+
let sum = 0;
|
|
76
|
+
for (let i = 1; i <= 5; i++) {
|
|
77
|
+
sum += i;
|
|
78
|
+
}
|
|
79
|
+
sum;
|
|
80
|
+
"
|
|
81
|
+
```
|
|
82
|
+
|
|
83
|
+
## Tech Stack
|
|
84
|
+
|
|
85
|
+
- **Puppeteer Core**: Connect and control Chrome browser
|
|
86
|
+
- **Chrome DevTools Protocol**: Browser remote debugging protocol
|
|
87
|
+
- **ES Modules**: Native ES module system
|
|
88
|
+
|
|
89
|
+
## Dependencies
|
|
90
|
+
|
|
91
|
+
- puppeteer: ^24.31.0
|
|
92
|
+
- puppeteer-core: ^23.11.1
|
|
93
|
+
|
|
94
|
+
## Notes
|
|
95
|
+
|
|
96
|
+
1. Must run browser-start.js first to start Chrome
|
|
97
|
+
2. Chrome must be started in remote debugging mode (default port 9222)
|
|
98
|
+
3. browser-eval.js uses eval() to execute code, ensure input is trusted
|
|
99
|
+
|
|
100
|
+
## Author
|
|
101
|
+
|
|
102
|
+
Mario Zechner
|
|
103
|
+
|
|
104
|
+
## License
|
|
105
|
+
|
|
106
|
+
MIT
|
|
@@ -0,0 +1,196 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: browser-tools
|
|
3
|
+
description: Interactive browser automation via Chrome DevTools Protocol. Use when you need to interact with web pages, test frontends, or when user interaction with a visible browser is required.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
# Browser Tools
|
|
7
|
+
|
|
8
|
+
Chrome DevTools Protocol tools for agent-assisted web automation. These tools connect to Chrome running on `:9222` with remote debugging enabled.
|
|
9
|
+
|
|
10
|
+
## Setup
|
|
11
|
+
|
|
12
|
+
Run once before first use:
|
|
13
|
+
|
|
14
|
+
```bash
|
|
15
|
+
cd {baseDir}/browser-tools
|
|
16
|
+
npm install
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
## Start Chrome
|
|
20
|
+
|
|
21
|
+
```bash
|
|
22
|
+
{baseDir}/browser-start.js # Fresh profile
|
|
23
|
+
{baseDir}/browser-start.js --profile # Copy user's profile (cookies, logins)
|
|
24
|
+
```
|
|
25
|
+
|
|
26
|
+
Launch Chrome with remote debugging on `:9222`. Use `--profile` to preserve user's authentication state.
|
|
27
|
+
|
|
28
|
+
## Navigate
|
|
29
|
+
|
|
30
|
+
```bash
|
|
31
|
+
{baseDir}/browser-nav.js https://example.com
|
|
32
|
+
{baseDir}/browser-nav.js https://example.com --new
|
|
33
|
+
```
|
|
34
|
+
|
|
35
|
+
Navigate to URLs. Use `--new` flag to open in a new tab instead of reusing current tab.
|
|
36
|
+
|
|
37
|
+
## Evaluate JavaScript
|
|
38
|
+
|
|
39
|
+
```bash
|
|
40
|
+
{baseDir}/browser-eval.js 'document.title'
|
|
41
|
+
{baseDir}/browser-eval.js 'document.querySelectorAll("a").length'
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
Execute JavaScript in the active tab. Code runs in async context. Use this to extract data, inspect page state, or perform DOM operations programmatically.
|
|
45
|
+
|
|
46
|
+
## Screenshot
|
|
47
|
+
|
|
48
|
+
```bash
|
|
49
|
+
{baseDir}/browser-screenshot.js
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
Capture current viewport and return temporary file path. Use this to visually inspect page state or verify UI changes.
|
|
53
|
+
|
|
54
|
+
## Pick Elements
|
|
55
|
+
|
|
56
|
+
```bash
|
|
57
|
+
{baseDir}/browser-pick.js "Click the submit button"
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
**IMPORTANT**: Use this tool when the user wants to select specific DOM elements on the page. This launches an interactive picker that lets the user click elements to select them. The user can select multiple elements (Cmd/Ctrl+Click) and press Enter when done. The tool returns CSS selectors for the selected elements.
|
|
61
|
+
|
|
62
|
+
Common use cases:
|
|
63
|
+
- User says "I want to click that button" → Use this tool to let them select it
|
|
64
|
+
- User says "extract data from these items" → Use this tool to let them select the elements
|
|
65
|
+
- When you need specific selectors but the page structure is complex or ambiguous
|
|
66
|
+
|
|
67
|
+
## Cookies
|
|
68
|
+
|
|
69
|
+
```bash
|
|
70
|
+
{baseDir}/browser-cookies.js
|
|
71
|
+
```
|
|
72
|
+
|
|
73
|
+
Display all cookies for the current tab including domain, path, httpOnly, and secure flags. Use this to debug authentication issues or inspect session state.
|
|
74
|
+
|
|
75
|
+
## Extract Page Content
|
|
76
|
+
|
|
77
|
+
```bash
|
|
78
|
+
{baseDir}/browser-content.js https://example.com
|
|
79
|
+
```
|
|
80
|
+
|
|
81
|
+
Navigate to a URL and extract readable content as markdown. Uses Mozilla Readability for article extraction and Turndown for HTML-to-markdown conversion. Works on pages with JavaScript content (waits for page to load).
|
|
82
|
+
|
|
83
|
+
## When to Use
|
|
84
|
+
|
|
85
|
+
- Testing frontend code in a real browser
|
|
86
|
+
- Interacting with pages that require JavaScript
|
|
87
|
+
- When user needs to visually see or interact with a page
|
|
88
|
+
- Debugging authentication or session issues
|
|
89
|
+
- Scraping dynamic content that requires JS execution
|
|
90
|
+
|
|
91
|
+
---
|
|
92
|
+
|
|
93
|
+
## Efficiency Guide
|
|
94
|
+
|
|
95
|
+
### DOM Inspection Over Screenshots
|
|
96
|
+
|
|
97
|
+
**Don't** take screenshots to see page state. **Do** parse the DOM directly:
|
|
98
|
+
|
|
99
|
+
```javascript
|
|
100
|
+
// Get page structure
|
|
101
|
+
document.body.innerHTML.slice(0, 5000)
|
|
102
|
+
|
|
103
|
+
// Find interactive elements
|
|
104
|
+
Array.from(document.querySelectorAll('button, input, [role="button"]')).map(e => ({
|
|
105
|
+
id: e.id,
|
|
106
|
+
text: e.textContent.trim(),
|
|
107
|
+
class: e.className
|
|
108
|
+
}))
|
|
109
|
+
```
|
|
110
|
+
|
|
111
|
+
### Complex Scripts in Single Calls
|
|
112
|
+
|
|
113
|
+
Wrap everything in an IIFE to run multi-statement code:
|
|
114
|
+
|
|
115
|
+
```javascript
|
|
116
|
+
(function() {
|
|
117
|
+
// Multiple operations
|
|
118
|
+
const data = document.querySelector('#target').textContent;
|
|
119
|
+
const buttons = document.querySelectorAll('button');
|
|
120
|
+
|
|
121
|
+
// Interactions
|
|
122
|
+
buttons[0].click();
|
|
123
|
+
|
|
124
|
+
// Return results
|
|
125
|
+
return JSON.stringify({ data, buttonCount: buttons.length });
|
|
126
|
+
})()
|
|
127
|
+
```
|
|
128
|
+
|
|
129
|
+
### Batch Interactions
|
|
130
|
+
|
|
131
|
+
**Don't** make separate calls for each click. **Do** batch them:
|
|
132
|
+
|
|
133
|
+
```javascript
|
|
134
|
+
(function() {
|
|
135
|
+
const actions = ["btn1", "btn2", "btn3"];
|
|
136
|
+
actions.forEach(id => document.getElementById(id).click());
|
|
137
|
+
return "Done";
|
|
138
|
+
})()
|
|
139
|
+
```
|
|
140
|
+
|
|
141
|
+
### Typing/Input Sequences
|
|
142
|
+
|
|
143
|
+
```javascript
|
|
144
|
+
(function() {
|
|
145
|
+
const text = "HELLO";
|
|
146
|
+
for (const char of text) {
|
|
147
|
+
document.getElementById("key-" + char).click();
|
|
148
|
+
}
|
|
149
|
+
document.getElementById("submit").click();
|
|
150
|
+
return "Submitted: " + text;
|
|
151
|
+
})()
|
|
152
|
+
```
|
|
153
|
+
|
|
154
|
+
### Reading App/Game State
|
|
155
|
+
|
|
156
|
+
Extract structured state in one call:
|
|
157
|
+
|
|
158
|
+
```javascript
|
|
159
|
+
(function() {
|
|
160
|
+
const state = {
|
|
161
|
+
score: document.querySelector('.score')?.textContent,
|
|
162
|
+
status: document.querySelector('.status')?.className,
|
|
163
|
+
items: Array.from(document.querySelectorAll('.item')).map(el => ({
|
|
164
|
+
text: el.textContent,
|
|
165
|
+
active: el.classList.contains('active')
|
|
166
|
+
}))
|
|
167
|
+
};
|
|
168
|
+
return JSON.stringify(state, null, 2);
|
|
169
|
+
})()
|
|
170
|
+
```
|
|
171
|
+
|
|
172
|
+
### Waiting for Updates
|
|
173
|
+
|
|
174
|
+
If DOM updates after actions, add a small delay with bash:
|
|
175
|
+
|
|
176
|
+
```bash
|
|
177
|
+
sleep 0.5 && {baseDir}/browser-eval.js '...'
|
|
178
|
+
```
|
|
179
|
+
|
|
180
|
+
### Investigate Before Interacting
|
|
181
|
+
|
|
182
|
+
Always start by understanding the page structure:
|
|
183
|
+
|
|
184
|
+
```javascript
|
|
185
|
+
(function() {
|
|
186
|
+
return {
|
|
187
|
+
title: document.title,
|
|
188
|
+
forms: document.forms.length,
|
|
189
|
+
buttons: document.querySelectorAll('button').length,
|
|
190
|
+
inputs: document.querySelectorAll('input').length,
|
|
191
|
+
mainContent: document.body.innerHTML.slice(0, 3000)
|
|
192
|
+
};
|
|
193
|
+
})()
|
|
194
|
+
```
|
|
195
|
+
|
|
196
|
+
Then target specific elements based on what you find.
|
|
@@ -0,0 +1,103 @@
|
|
|
1
|
+
#!/usr/bin/env node
|
|
2
|
+
|
|
3
|
+
import puppeteer from "puppeteer-core";
|
|
4
|
+
import { Readability } from "@mozilla/readability";
|
|
5
|
+
import { JSDOM } from "jsdom";
|
|
6
|
+
import TurndownService from "turndown";
|
|
7
|
+
import { gfm } from "turndown-plugin-gfm";
|
|
8
|
+
|
|
9
|
+
// Global timeout - exit if script takes too long
|
|
10
|
+
const TIMEOUT = 30000;
|
|
11
|
+
const timeoutId = setTimeout(() => {
|
|
12
|
+
console.error("✗ Timeout after 30s");
|
|
13
|
+
process.exit(1);
|
|
14
|
+
}, TIMEOUT).unref();
|
|
15
|
+
|
|
16
|
+
const url = process.argv[2];
|
|
17
|
+
|
|
18
|
+
if (!url) {
|
|
19
|
+
console.log("Usage: browser-content.js <url>");
|
|
20
|
+
console.log("\nExtracts readable content from a URL as markdown.");
|
|
21
|
+
console.log("\nExamples:");
|
|
22
|
+
console.log(" browser-content.js https://example.com");
|
|
23
|
+
console.log(" browser-content.js https://en.wikipedia.org/wiki/Rust_(programming_language)");
|
|
24
|
+
process.exit(1);
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
const b = await Promise.race([
|
|
28
|
+
puppeteer.connect({
|
|
29
|
+
browserURL: "http://localhost:9222",
|
|
30
|
+
defaultViewport: null,
|
|
31
|
+
}),
|
|
32
|
+
new Promise((_, reject) => setTimeout(() => reject(new Error("timeout")), 5000)),
|
|
33
|
+
]).catch((e) => {
|
|
34
|
+
console.error("✗ Could not connect to browser:", e.message);
|
|
35
|
+
console.error(" Run: browser-start.js");
|
|
36
|
+
process.exit(1);
|
|
37
|
+
});
|
|
38
|
+
|
|
39
|
+
const p = (await b.pages()).at(-1);
|
|
40
|
+
if (!p) {
|
|
41
|
+
console.error("✗ No active tab found");
|
|
42
|
+
process.exit(1);
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
await Promise.race([
|
|
46
|
+
p.goto(url, { waitUntil: "networkidle2" }),
|
|
47
|
+
new Promise((r) => setTimeout(r, 10000)),
|
|
48
|
+
]).catch(() => {});
|
|
49
|
+
|
|
50
|
+
// Get HTML via CDP (works even with TrustedScriptURL restrictions)
|
|
51
|
+
const client = await p.createCDPSession();
|
|
52
|
+
const { root } = await client.send("DOM.getDocument", { depth: -1, pierce: true });
|
|
53
|
+
const { outerHTML } = await client.send("DOM.getOuterHTML", { nodeId: root.nodeId });
|
|
54
|
+
await client.detach();
|
|
55
|
+
|
|
56
|
+
const finalUrl = p.url();
|
|
57
|
+
|
|
58
|
+
// Extract with Readability
|
|
59
|
+
const doc = new JSDOM(outerHTML, { url: finalUrl });
|
|
60
|
+
const reader = new Readability(doc.window.document);
|
|
61
|
+
const article = reader.parse();
|
|
62
|
+
|
|
63
|
+
// Convert to markdown
|
|
64
|
+
function htmlToMarkdown(html) {
|
|
65
|
+
const turndown = new TurndownService({ headingStyle: "atx", codeBlockStyle: "fenced" });
|
|
66
|
+
turndown.use(gfm);
|
|
67
|
+
turndown.addRule("removeEmptyLinks", {
|
|
68
|
+
filter: (node) => node.nodeName === "A" && !node.textContent?.trim(),
|
|
69
|
+
replacement: () => "",
|
|
70
|
+
});
|
|
71
|
+
return turndown
|
|
72
|
+
.turndown(html)
|
|
73
|
+
.replace(/\[\\?\[\s*\\?\]\]\([^)]*\)/g, "")
|
|
74
|
+
.replace(/ +/g, " ")
|
|
75
|
+
.replace(/\s+,/g, ",")
|
|
76
|
+
.replace(/\s+\./g, ".")
|
|
77
|
+
.replace(/\n{3,}/g, "\n\n")
|
|
78
|
+
.trim();
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
let content;
|
|
82
|
+
if (article && article.content) {
|
|
83
|
+
content = htmlToMarkdown(article.content);
|
|
84
|
+
} else {
|
|
85
|
+
// Fallback
|
|
86
|
+
const fallbackDoc = new JSDOM(outerHTML, { url: finalUrl });
|
|
87
|
+
const fallbackBody = fallbackDoc.window.document;
|
|
88
|
+
fallbackBody.querySelectorAll("script, style, noscript, nav, header, footer, aside").forEach((el) => el.remove());
|
|
89
|
+
const main = fallbackBody.querySelector("main, article, [role='main'], .content, #content") || fallbackBody.body;
|
|
90
|
+
const fallbackHtml = main?.innerHTML || "";
|
|
91
|
+
if (fallbackHtml.trim().length > 100) {
|
|
92
|
+
content = htmlToMarkdown(fallbackHtml);
|
|
93
|
+
} else {
|
|
94
|
+
content = "(Could not extract content)";
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
console.log(`URL: ${finalUrl}`);
|
|
99
|
+
if (article?.title) console.log(`Title: ${article.title}`);
|
|
100
|
+
console.log("");
|
|
101
|
+
console.log(content);
|
|
102
|
+
|
|
103
|
+
process.exit(0);
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
#!/usr/bin/env node
|
|
2
|
+
|
|
3
|
+
import puppeteer from "puppeteer-core";
|
|
4
|
+
|
|
5
|
+
const b = await Promise.race([
|
|
6
|
+
puppeteer.connect({
|
|
7
|
+
browserURL: "http://localhost:9222",
|
|
8
|
+
defaultViewport: null,
|
|
9
|
+
}),
|
|
10
|
+
new Promise((_, reject) => setTimeout(() => reject(new Error("timeout")), 5000)),
|
|
11
|
+
]).catch((e) => {
|
|
12
|
+
console.error("✗ Could not connect to browser:", e.message);
|
|
13
|
+
console.error(" Run: browser-start.js");
|
|
14
|
+
process.exit(1);
|
|
15
|
+
});
|
|
16
|
+
|
|
17
|
+
const p = (await b.pages()).at(-1);
|
|
18
|
+
|
|
19
|
+
if (!p) {
|
|
20
|
+
console.error("✗ No active tab found");
|
|
21
|
+
process.exit(1);
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
const cookies = await p.cookies();
|
|
25
|
+
|
|
26
|
+
for (const cookie of cookies) {
|
|
27
|
+
console.log(`${cookie.name}: ${cookie.value}`);
|
|
28
|
+
console.log(` domain: ${cookie.domain}`);
|
|
29
|
+
console.log(` path: ${cookie.path}`);
|
|
30
|
+
console.log(` httpOnly: ${cookie.httpOnly}`);
|
|
31
|
+
console.log(` secure: ${cookie.secure}`);
|
|
32
|
+
console.log("");
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
await b.disconnect();
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import puppeteer from "puppeteer-core";
|
|
2
|
+
|
|
3
|
+
const code = process.argv.slice(2).join(" ");
|
|
4
|
+
if (!code) {
|
|
5
|
+
console.log("Usage: browser-eval.js code");
|
|
6
|
+
process.exit(1);
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
const browser = await puppeteer.connect({
|
|
10
|
+
browserURL: "http://localhost:9222",
|
|
11
|
+
defaultViewport: null,
|
|
12
|
+
});
|
|
13
|
+
|
|
14
|
+
const page = (await browser.pages()).at(-1);
|
|
15
|
+
|
|
16
|
+
if (!page) {
|
|
17
|
+
console.error("No active tab");
|
|
18
|
+
process.exit(1);
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
try {
|
|
22
|
+
const result = await page.evaluate((userCode) => {
|
|
23
|
+
try {
|
|
24
|
+
return eval(userCode);
|
|
25
|
+
} catch (e) {
|
|
26
|
+
return {__error: e.message};
|
|
27
|
+
}
|
|
28
|
+
}, code);
|
|
29
|
+
|
|
30
|
+
if (result && result.__error) {
|
|
31
|
+
console.error("Error:", result.__error);
|
|
32
|
+
process.exit(1);
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
if (result === undefined) {
|
|
36
|
+
console.log("undefined");
|
|
37
|
+
} else if (result === null) {
|
|
38
|
+
console.log("null");
|
|
39
|
+
} else if (typeof result === "object") {
|
|
40
|
+
console.log(JSON.stringify(result));
|
|
41
|
+
} else {
|
|
42
|
+
console.log(result);
|
|
43
|
+
}
|
|
44
|
+
} catch (error) {
|
|
45
|
+
console.error("Error:", error.message);
|
|
46
|
+
process.exit(1);
|
|
47
|
+
} finally {
|
|
48
|
+
await browser.disconnect();
|
|
49
|
+
}
|