AI Skill MartKhám phá skillLệnhChương trìnhHọcSkill là gì?
← Về danh sách

Reticle – Lớp kiểm chứng ứng dụng web

Kết nối SDK Reticle vào ứng dụng web đang chạy để đọc DOM, network, routing, console, chạy thật một luồng người dùng và trả về phán quyết yes/no/unknown kèm file:line cần sửa.

Lập trìnhTrung cấp★ 1,303⑂ 242Điểm AI 9/10Cập nhật lần cuối: 3 thg 11, 2026

Nó làm được gì

  • Cài và nối Reticle (init) vào ứng dụng web đang chạy, cung cấp các công cụ MCP reticle_* để đọc bên trong ứng dụng: DOM, request mạng, routing, console và state của framework.
  • Thay vì đoán qua ảnh chụp màn hình, nó điều khiển chính tab trình duyệt đang mở và chạy trọn một luồng (đăng nhập, gửi form, thanh toán).
  • Trả về verified: yes / no / unknown kèm bằng chứng và file:line cần mở; cấm tuyệt đối việc nới lỏng điều kiện để test "xanh".
  • Lưu luồng đã chạy thành flow để lần sau kiểm tra hồi quy rẻ hơn bằng reticle_verify { action: "change" }.

Phù hợp với ai

  • Lập trình viên frontend hay gặp cảnh "test pass nhưng UI vỡ".
  • Người giao việc sửa UI cho agent AI và muốn bằng chứng thật sự thay vì lời khẳng định.
  • Nhóm bảo trì ứng dụng web chạy bằng dev server (React, Vue, Next.js...).

Ví dụ sử dụng

  1. "Kiểm tra nút thanh toán" → reticle_act_and_wait click và chứng minh cùng lúc: POST /api/order trả 200, dialog "Order confirmed" hiện ra, không có lỗi console.
  2. "Sửa src/App.tsx có làm hỏng gì không?" → reticle_verify { action: "change", files: [...] } chỉ phát lại những flow liên quan.
  3. Dự án chưa cài gì: chạy npx @reticlehq/server@latest để kiểm tra tải trang, lỗi console, request thất bại và các liên kết cùng origin, nhận phán quyết ngay.

· · · 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/reticlehq/reticle/HEAD/plugins/reticle/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 AI Skill Mart.
Copy thư mục plugins/reticle từ repo GitHub reticlehq/reticle vào ~/.claude/skills/reticlehq-reticle/ 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/reticlehq/reticle.git /tmp/reticle && mkdir -p ~/.claude/skills/reticle && cp -r /tmp/reticle/plugins/reticle/* ~/.claude/skills/reticle/

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

  1. Mở terminal và tải kho skill: git clone https://github.com/reticlehq/reticle.git /tmp/reticle
  2. Tạo thư mục skill: mkdir -p ~/.claude/skills/reticle
  3. Sao chép file skill: cp -r /tmp/reticle/plugins/reticle/* ~/.claude/skills/reticle/
  4. Vào thư mục ứng dụng web của bạn và chạy kiểm tra không cần cài đặt: npx @reticlehq/server@latest
  5. Nếu hài lòng, chạy lệnh nối dự án (lệnh này sửa file, chỉ chạy khi bạn đồng ý): npx @reticlehq/server@latest init
  6. Khởi động lại dev server đang chạy trước đó, rồi khởi động lại Claude Code để nạp các công cụ MCP reticle_*.
  7. Yêu cầu Claude: "/reticle" hoặc "chứng minh luồng đăng nhập hoạt động" để kích hoạt skill.
Xem mã nguồn trên GitHub ↗Giấy phép: NOASSERTION