Agent skill

Browser Ops Skill

当用户要求对具体网页做页面级交互时触发：登录、填表、点按钮、翻页抓取、截图、下载页面图片、处理验证码或反爬、访问 SPA 动态内容；也用于 WebFetch 拿到空壳或被风控后的降级。典型说法"帮我登录 X 然后抓 Y"、"截个图"。不用于：事实性问题或"xx 是什么"（→WebSearch）、单纯读取静态网页文本（先试 WebFetch）。

AGPL-3.0Auto-check passed

Install Browser Ops Skill

skills CLI

$ npx skills add OpenLoaf/OpenLoaf --skill browser-ops-skill -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI

$ gh skill install OpenLoaf/OpenLoaf browser-ops-skill --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy

$ git clone --depth 1 https://github.com/OpenLoaf/OpenLoaf.git skills-src && mkdir -p .claude/skills && cp -r skills-src/apps/server/src/ai/builtin-skills/browser-ops .claude/skills/browser-ops-skill && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Paste into Claude Code

Install the "browser-ops-skill" agent skill from https://github.com/OpenLoaf/OpenLoaf/tree/main/apps/server/src/ai/builtin-skills/browser-ops into .claude/skills/browser-ops-skill/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "browser-ops-skill", then confirm the skill loads.

Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

$skill-installer

$skill-installer install https://github.com/OpenLoaf/OpenLoaf/tree/main/apps/server/src/ai/builtin-skills/browser-ops

Type this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.

skills CLI

$ npx skills add OpenLoaf/OpenLoaf --skill browser-ops-skill -a codex

Project install goes to .agents/skills/; add -g for ~/.codex/skills/.

GitHub CLI

$ gh skill install OpenLoaf/OpenLoaf browser-ops-skill --agent codex

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/OpenLoaf/OpenLoaf.git skills-src && mkdir -p .agents/skills && cp -r skills-src/apps/server/src/ai/builtin-skills/browser-ops .agents/skills/browser-ops-skill && rm -rf skills-src

Use ~/.agents/skills/ instead of .agents/skills for a personal install.

Codex skills documentation · loads skills from .agents/skills/

Paste into Codex

Install the "browser-ops-skill" agent skill from https://github.com/OpenLoaf/OpenLoaf/tree/main/apps/server/src/ai/builtin-skills/browser-ops into .agents/skills/browser-ops-skill/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "browser-ops-skill", then confirm the skill loads.

Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add OpenLoaf/OpenLoaf --skill browser-ops-skill -a cursor

Project install goes to .agents/skills/; add -g for ~/.cursor/skills/.

GitHub CLI

$ gh skill install OpenLoaf/OpenLoaf browser-ops-skill --agent cursor

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/OpenLoaf/OpenLoaf.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/apps/server/src/ai/builtin-skills/browser-ops .cursor/skills/browser-ops-skill && rm -rf skills-src

Use ~/.cursor/skills/ instead of .cursor/skills for a personal install.

Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/

Paste into Cursor

Install the "browser-ops-skill" agent skill from https://github.com/OpenLoaf/OpenLoaf/tree/main/apps/server/src/ai/builtin-skills/browser-ops into .cursor/skills/browser-ops-skill/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "browser-ops-skill", then confirm the skill loads.

Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

gemini skills install

$ gemini skills install https://github.com/OpenLoaf/OpenLoaf.git --path apps/server/src/ai/builtin-skills/browser-ops

--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.

skills CLI

$ npx skills add OpenLoaf/OpenLoaf --skill browser-ops-skill -a gemini-cli

Project install goes to .agents/skills/; add -g for ~/.gemini/skills/.

GitHub CLI

$ gh skill install OpenLoaf/OpenLoaf browser-ops-skill --agent gemini-cli

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/OpenLoaf/OpenLoaf.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/apps/server/src/ai/builtin-skills/browser-ops .gemini/skills/browser-ops-skill && rm -rf skills-src

Use ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.

Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/

Paste into Gemini CLI

Install the "browser-ops-skill" agent skill from https://github.com/OpenLoaf/OpenLoaf/tree/main/apps/server/src/ai/builtin-skills/browser-ops into .gemini/skills/browser-ops-skill/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "browser-ops-skill", then confirm the skill loads.

Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

GitHub CLI

$ gh skill install OpenLoaf/OpenLoaf browser-ops-skill

Installs for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).

skills CLI

$ npx skills add OpenLoaf/OpenLoaf --skill browser-ops-skill -a github-copilot

Project install goes to .agents/skills/; add -g for ~/.copilot/skills/.

Manual copy

$ git clone --depth 1 https://github.com/OpenLoaf/OpenLoaf.git skills-src && mkdir -p .github/skills && cp -r skills-src/apps/server/src/ai/builtin-skills/browser-ops .github/skills/browser-ops-skill && rm -rf skills-src

Use ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.

GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/

Paste into GitHub Copilot

Install the "browser-ops-skill" agent skill from https://github.com/OpenLoaf/OpenLoaf/tree/main/apps/server/src/ai/builtin-skills/browser-ops into .github/skills/browser-ops-skill/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "browser-ops-skill", then confirm the skill loads.

GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add OpenLoaf/OpenLoaf --skill browser-ops-skill -a opencode

OpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.

GitHub CLI

$ gh skill install OpenLoaf/OpenLoaf browser-ops-skill --agent opencode

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/OpenLoaf/OpenLoaf.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/apps/server/src/ai/builtin-skills/browser-ops .opencode/skills/browser-ops-skill && rm -rf skills-src

Use ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.

OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/

Paste into OpenCode

Install the "browser-ops-skill" agent skill from https://github.com/OpenLoaf/OpenLoaf/tree/main/apps/server/src/ai/builtin-skills/browser-ops into .opencode/skills/browser-ops-skill/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "browser-ops-skill", then confirm the skill loads.

OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

Facts

Skill name: browser-ops-skill
GitHub stars: 108
Token cost: ~826 tokens
SKILL.md length: 239 words
Files: 1
Skills in repo: 33
Repo updated: May 14, 2026
First seen: Oct 7, 2026
Licence: AGPL-3.0

At a glance

Works in 5 steps: OpenUrl → BrowserSnapshot 看表单结构和 selector → 对每个字段 BrowserAct { action: "fill",… → 提交：BrowserAct { action: "click-css",… → …
SKILL.md covers 工具清单, 核心心智模型, OpenUrl 打开模式 and BrowserSnapshot 说明, plus 6 more sections
Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Browser Ops Skill is an agent skill from OpenLoaf/OpenLoaf. 当用户要求对具体网页做页面级交互时触发：登录、填表、点按钮、翻页抓取、截图、下载页面图片、处理验证码或反爬、访问 SPA 动态内容；也用于 WebFetch 拿到空壳或被风控后的降级。典型说法"帮我登录 X 然后抓 Y"、"截个图"。不用于：事实性问题或"xx 是什么"（→WebSearch）、单纯读取静态网页文本（先试 WebFetch）。

Its SKILL.md is about 830 tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

The repository describes itself as: 🍞Open-source, local-first AI workspace with Agents, multi-model chat (GPT/Claude/Gemini/DeepSeek), Notion-like docs, AI image & video generation, email, calendar & terminal…. The licence is AGPL-3.0.

Example prompts

“帮我登录 X 然后抓 Y”
“。不用于：事实性问题或”
“/browser-ops-skill”

Workflow steps

5 steps, taken from the first numbered list in SKILL.md.

OpenUrl → BrowserSnapshot 看表单结构和 selector
对每个字段 BrowserAct { action: "fill", selector: "...", text: "..." }
提交：BrowserAct { action: "click-css", selector: "button[type=submit]" }
BrowserWait { type: "urlIncludes", url: "/success" } 确认成功
BrowserSnapshot 最终确认

What it can do on your machine

Read from SKILL.md and the folder at commit f7eccf6. It shows what the files ask for, not the result of running them.

Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
No scripts in the folder and no shell commands in SKILL.md.
From the folder's file list and the shell code blocks in SKILL.md.
Network
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Browser Ops Skill loads about 826 tokens when it runs. Until then it costs about 50 tokens; SKILL.md has 239 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it: ~50
When it runs · the whole SKILL.md, loaded when a task matches: ~826

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from OpenLoaf/OpenLoaf at commit f7eccf6, republished under its AGPL-3.0 licence (© OpenLoaf). 239 words, ~826 tokens.

Download SKILL.mdSave it as .claude/skills/browser-ops-skill/SKILL.md (or your agent's skills folder).

name: browser-ops-skill
description: 当用户要求对具体网页做页面级交互时触发：登录、填表、点按钮、翻页抓取、截图、下载页面图片、处理验证码或反爬、访问 SPA 动态内容；也用于 WebFetch 拿到空壳或被风控后的降级。典型说法"帮我登录 X 然后抓 Y"、"截个图"。**不用于**：事实性问题或"xx 是什么"（→`WebSearch`）、单纯读取静态网页文本（先试 `WebFetch`）。
tools: OpenUrl, BrowserSnapshot, BrowserAct, BrowserWait, BrowserDownloadImage

浏览器操作指南

工具清单

工具	职责	只读
`OpenUrl`	打开网页（headless / tab / window 三模式）	是
`BrowserSnapshot`	一次拿到页面文本 + 交互元素列表 + 截图 + rawHtml	是
`BrowserAct`	页面交互（点击 / 输入 / 滚动 / 按键）	否
`BrowserWait`	等待页面状态（load / networkidle / url / text / timeout）	是
`BrowserDownloadImage`	下载页面中的图片到本地	否

加载：全部为 deferred 工具，调用前须先 ToolSearch(names: "OpenUrl,BrowserSnapshot,BrowserAct,BrowserWait,BrowserDownloadImage") 激活 schema。

核心心智模型

浏览器操作 = 观察-行动-验证 循环。每次操作后必须 snapshot 确认状态，因为网页是有状态的——点击可能触发导航、弹窗、AJAX 加载，你无法预测结果。盲目连续操作是最常见的失败原因。

OpenUrl → BrowserSnapshot → 分析 → BrowserAct → BrowserWait → BrowserSnapshot → ...

OpenUrl 打开模式

headless — 纯自动化首选。无 UI，适合抓取、后台 Agent、批量操作。
tab（默认） — 用户需要看到/操作页面时用。内嵌面板。
window — 用户需要独立窗口深度交互时用。

速记：用户不需要看 → headless；用户要看 → tab；用户要独立窗口 → window。

BrowserSnapshot 说明

BrowserSnapshot 一次调用返回：

页面信息：URL、标题、readyState
全量文本：body.innerText（截断 32KB）
交互元素列表：最多 120 个可点击/可输入元素及其 selector
iframe 内容：同源 iframe 的文本和元素
截图：默认截取完整页面（fullPage），保存到会话资源目录
rawHtmlPath：完整 outerHTML 存盘路径

文本超 32KB 怎么办？ 用 Read/Grep 读 rawHtmlPath 获取完整 DOM，不要反复调 BrowserSnapshot 重抓。

截图控制：fullPage: false 仅截取当前可视区域。

三大核心工作流

工作流 1：信息提取

OpenUrl → BrowserWait { type: "load" } → BrowserSnapshot

直接从返回的文本中提取所需信息。

翻页抓取：BrowserSnapshot → BrowserAct { action: "click-text", text: "下一页" } → BrowserWait { type: "networkidle" } → 循环。每页都要 snapshot。

工作流 2：表单填写与登录

OpenUrl → BrowserSnapshot 看表单结构和 selector
对每个字段 BrowserAct { action: "fill", selector: "...", text: "..." }
提交：BrowserAct { action: "click-css", selector: "button[type=submit]" }
BrowserWait { type: "urlIncludes", url: "/success" } 确认成功
BrowserSnapshot 最终确认

fill vs type：fill 原子性地清空+输入，适合表单；type 在当前焦点追加字符，适合搜索框。

登录注意：Cookie 在会话期间持久，登录一次后续自动带认证。不要 snapshot 密码字段。

工作流 3：截图与图片下载

BrowserSnapshot — 快照 + 完整页面截图（默认 fullPage）
BrowserSnapshot { fullPage: false } — 仅可视区域
BrowserDownloadImage { selector: ".product-image" } — 下载页面中的图片

截图是调试利器：文本看不出问题时，看截图一目了然。

Selector 选择策略

从 BrowserSnapshot 返回的元素列表中选择 selector，不要自己猜。

优先级：#id > [data-testid] > input[name] > .class > click-text

等待策略

load：传统页面导航后用
networkidle：SPA/AJAX 页面首选，最安全但最慢
urlIncludes：表单提交后等待跳转
textIncludes：等待异步加载的内容
timeout：最后手段

错误诊断

元素未找到？ → BrowserSnapshot 确认页面状态 → 可能已导航到别处 → 可能在视口下方（scroll 后再试）→ 可能在 iframe 中（不支持跨 iframe）

页面加载超时？ → BrowserSnapshot 看加载到哪了，可能内容已够用

操作没反应？ → 页面没加载完（加 BrowserWait）→ selector 匹配了错误元素（snapshot 检查）→ 弹窗遮挡（先关闭）

SPA 内容为空？ → BrowserWait { type: "networkidle" } 后再 snapshot → 还是空则 textIncludes 等具体内容

CAPTCHA 与反爬

遇到验证码、403/429、反机器人页面时立即停止并告知用户，不要盲目重试。

铁律

每次操作后 BrowserSnapshot 验证状态
先 snapshot 再行动，不要猜 selector
等待页面就绪后再操作
文本不够看截图
不要暴露敏感信息（密码填写后不要 snapshot）
遇到反爬立即停止

Files

Just SKILL.md in apps/server/src/ai/builtin-skills/browser-ops of OpenLoaf/OpenLoaf.

Open the folder on GitHubat commit f7eccf6

Compare with similar skills

Browser Ops Skill next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Browser Ops Skill compared with similar skills
Skill	Stars	Used in	Tokens	Auto-check	Licence	Repo updated
Browser Ops Skill this skillOpenLoaf/OpenLoaf	108	—	~826	Automated safety check: Pass	AGPL-3.0	4 mo ago
Knowledge Opsaffaan-m/ECC	275k	2 repos	~1.7k	Automated safety check: Pass	MIT	3 days ago
Research Opsaffaan-m/ECC	275k	2 repos	~902	Automated safety check: Pass	MIT	3 days ago
Terminal Opsaffaan-m/ECC	275k	2 repos	~750	Automated safety check: Pass	MIT	3 days ago
Messages Opsaffaan-m/ECC	275k	1 repos	~724	Automated safety check: Pass	MIT	3 days ago
Email Opsaffaan-m/ECC	275k	1 repos	~1.1k	Automated safety check: Pass	MIT	3 days ago

Similar skills

Knowledge Ops
affaan-m/ECC
Knowledge base management, ingestion, sync, and retrieval across multiple storage layers (local files, MCP memory, vector stores, Git repos).
275k GitHub starsUsed in 2 repos~1.7k tokens
Knowledge ManagementAuto-check passed
Research Ops
affaan-m/ECC
Evidence-first current-state research workflow for ECC. An agent skill from affaan-m/ECC.
275k GitHub starsUsed in 2 repos~902 tokens
Research & ScienceAuto-check passed
Terminal Ops
affaan-m/ECC
Evidence-first repo execution workflow for ECC. An agent skill from affaan-m/ECC.
275k GitHub starsUsed in 2 repos~750 tokens
Testing & QAAuto-check passed
Messages Ops
affaan-m/ECC
Evidence-first live messaging workflow for ECC. An agent skill from affaan-m/ECC.
275k GitHub starsUsed in 1 repo~724 tokens
Productivity & AutomationAuto-check passed
Email Ops
affaan-m/ECC
Evidence-first mailbox triage, drafting, send verification, and sent-mail-safe follow-up workflow for ECC.
275k GitHub starsUsed in 1 repo~1.1k tokens
Writing & ContentAuto-check passed
GitHub Ops
affaan-m/ECC
GitHub操作、自動化、APIインテグレーション、およびCI/CDワークフロー. An agent skill from affaan-m/ECC.
275k GitHub stars~1.1k tokensUpdated 3 days ago
DevOps & CloudAuto-check passed

Questions about Browser Ops Skill

What does Browser Ops Skill do?

How do I install Browser Ops Skill in Claude Code?

Run `npx skills add OpenLoaf/OpenLoaf --skill browser-ops-skill -a claude-code`. Or copy the skill folder (apps/server/src/ai/builtin-skills/browser-ops in OpenLoaf/OpenLoaf) into .claude/skills/browser-ops-skill in your project. Claude Code loads it when a task matches its description.

How do I install Browser Ops Skill in Codex?

Run `npx skills add OpenLoaf/OpenLoaf --skill browser-ops-skill -a codex`. Or copy the skill folder (apps/server/src/ai/builtin-skills/browser-ops in OpenLoaf/OpenLoaf) into .agents/skills/browser-ops-skill in your project. Codex loads it when a task matches its description.

Can I use Browser Ops Skill in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add OpenLoaf/OpenLoaf --skill browser-ops-skill -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/browser-ops-skill, .gemini/skills/browser-ops-skill, .github/skills/browser-ops-skill and .opencode/skills/browser-ops-skill in your project.

What does Browser Ops Skill need to run?

SKILL.md names no scripts, command-line tools or credentials: Browser Ops Skill is instructions for the agent only.

Does Browser Ops Skill access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Browser Ops Skill safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Browser Ops Skill use?

Browser Ops Skill is published under the AGPL-3.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Browser Ops Skill use?

About 826 tokens (SKILL.md is roughly 3.3k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Browser Ops Skill?

Skills that share tags, products or a category with Browser Ops Skill: Knowledge Ops (affaan-m/ECC, 275k stars), Research Ops (affaan-m/ECC, 275k stars), Terminal Ops (affaan-m/ECC, 275k stars) and Messages Ops (affaan-m/ECC, 275k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Browser Ops Skill?

OpenLoaf (a GitHub organization) maintains it in OpenLoaf/OpenLoaf, which has 108 GitHub stars. The repository holds 33 skills in this directory. The repository was last updated on May 14, 2026.

Source: OpenLoaf/OpenLoaf on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.

Install Browser Ops Skill

Facts

At a glance

What it does

Example prompts

Workflow steps

What it can do on your machine

Tool permissions

Runs code

Network

Credentials

Context cost

Safety

SKILL.md

浏览器操作指南

工具清单

核心心智模型

OpenUrl 打开模式

BrowserSnapshot 说明

三大核心工作流

工作流 1：信息提取

工作流 2：表单填写与登录

工作流 3：截图与图片下载

Selector 选择策略

等待策略

错误诊断

CAPTCHA 与反爬

铁律

Files

Compare with similar skills

Similar skills

More from OpenLoaf/OpenLoaf

Questions about Browser Ops Skill