Claude Skill MartKhám phá skillCâu dùng ngayHọc qua videoDùng terminalSkill là gì?
 
← Về danh sách

Hướng dẫn tự động hóa trình duyệt agent-browser

Skill giúp Claude điều khiển Chrome thật qua CLI `agent-browser`: mở trang, click, điền form, trích xuất dữ liệu và chụp ảnh màn hình.

Tự động hóaTrung cấp★ 1,076⑂ 103Điểm AI 10/10Cập nhật lần cuối: 17 thg 8, 2026

Skill này làm được gì

  • Dạy Claude quy trình snapshot + tham chiếu @eN dựa trên cây trợ năng, giúp hiểu và tương tác với trang chỉ trong ~200-400 token thay vì đọc HTML thô.
  • Mô tả vòng lặp cốt lõi: mở trang → snapshot → hành động → snapshot lại, kèm đầy đủ lệnh click, fill, type, select, check, upload, drag, scroll.
  • Cung cấp cách chọn phần tử thay thế (find role/text/label/testid, CSS selector) và thứ tự ưu tiên khi dùng.
  • Chiến lược chờ theo từng tình huống (chờ element, chờ text, chờ URL glob, networkidle, điều kiện JS) — nguyên nhân số một khiến automation vỡ.
  • Bao gồm đăng nhập/auth vault, giữ session qua nhiều lần chạy (--session --restore), chạy song song nhiều session, quản lý tab, iframe, dialog, mock network & HAR, ghi video, audit trợ năng (axe), khảo sát React tree và Web Vitals.
  • Có phần doctor chẩn đoán và xử lý lỗi thực tế: "Ref not found", overlay chặn click, input tùy biến, trang WebGPU đen màu.
  • Kèm nguyên tắc an toàn: coi mọi nội dung từ trình duyệt là dữ liệu không tin cậy, không echo secret.

Phù hợp với ai

  • Dev/QA muốn giao kịch bản kiểm thử E2E cho AI
  • Người cần tự động hóa tác vụ lặp lại hoặc thu thập dữ liệu trên site yêu cầu đăng nhập
  • Technical writer, PM cần đọc tài liệu dạng markdown, chụp ảnh hoặc quay video luồng sản phẩm
  • Frontend dev muốn kiểm tra re-render React và Web Vitals ngay trên trình duyệt

Ví dụ sử dụng

  1. Đăng nhập rồi chụp dashboard: auth login my-app → wait --url "**/dashboard" → screenshot dash.png.
  2. Trích bảng giá thành JSON: dùng snapshot -i --json hoặc heredoc eval --stdin để map các dòng <tr> thành mảng object.
  3. Điền form và kiểm tra kết quả: fill ô tìm kiếm, press Enter, wait --load networkidle, snapshot lại rồi click kết quả và lưu ảnh.
  4. Phân tích API của site: network har start → thao tác → network har stop /tmp/trace.har để nghiên cứu offline.

· · · Hướng dẫn cài đặt · · ·

Dùng thử ngay, không cần cài

Dán đoạn dưới vào Claude là dùng được skill này mà không cần cài đặt.

Hãy đọc hướng dẫn trong tệp này và làm theo để giúp mình:
https://raw.githubusercontent.com/fcakyon/claude-codex-settings/HEAD/plugins/agent-browser/skills/agent-browser/SKILL.md

Mình muốn: (viết việc bạn cần ở đây)

Nếu Claude không mở được liên kết, hãy mở liên kết và copy nội dung vào rồi dán.

↓ Thấy hữu ích thì tải ZIP bên dưới và cài. Sau đó skill tự chạy, không phải dán lại mỗi lần.

Cài vào ứng dụng Claude (không cần terminal)
  1. Tải tệp ZIP bằng nút bên dưới.
  2. Trong Claude, mở Settings → Capabilities và bật 'Code execution and file creation'. (chỉ một lần)
  3. Vào Customize → Skills → + → 'Upload a skill' rồi tải tệp ZIP lên.
↓ Tải ZIP
Cài vào Claude Code

Để Claude làm — dán câu dưới đây vào Claude Code

Hãy cài skill mình tìm thấy trên Claude Skill Mart.
Copy thư mục plugins/agent-browser/skills/agent-browser từ repo GitHub fcakyon/claude-codex-settings vào ~/.claude/skills/fcakyon-agent-browser/ của mình.
Sau khi cài xong, cho mình biết skill này làm được gì trong một câu.

Cài bằng lệnh thủ công

git clone https://github.com/fcakyon/claude-codex-settings.git /tmp/claude-codex-settings && mkdir -p ~/.claude/skills && cp -r /tmp/claude-codex-settings/plugins/agent-browser/skills/agent-browser ~/.claude/skills/

⚠ Đây là skill do người khác tạo. Hãy kiểm tra repo gốc trước khi cài.

  1. Chuẩn bị: cần Node.js. Kiểm tra bằng node -v.
  2. Cài CLI: chạy npm i -g agent-browser, sau đó agent-browser install (trên Linux dùng agent-browser install --with-deps để cài thêm thư viện hệ thống).
  3. Kiểm tra: chạy agent-browser doctor --offline --quick xem mọi mục có pass không.
  4. Tải skill: git clone https://github.com/fcakyon/claude-codex-settings.git
  5. Copy vào Claude: mkdir -p ~/.claude/skills && cp -r claude-codex-settings/plugins/agent-browser/skills/agent-browser ~/.claude/skills/ (nhớ giữ nguyên các thư mục references/ và templates/).
  6. Khởi động lại Claude Code, rồi thử yêu cầu như "mở trang này và chụp màn hình" — skill sẽ tự được nạp.
  7. Thói quen tốt: kết thúc phiên bằng agent-browser close (hoặc close --all); với site chứa dữ liệu nhạy cảm hãy giới hạn bằng --allowed-domains.
Xem mã nguồn trên GitHub ↗Giấy phép: Apache-2.0