UI Debug Agent

A browser-based tool for examining web or mobile interfaces, including their page structure and element attributes. It can find reliable selectors for Playwright, Selenium, or Appium automation and capture screenshots or UI state.

In plain words
What is it for?
Use it to inspect forms, tables, modals, iframes, shadow DOM, and single-page apps; find selectors; debug automation failures; and collect test evidence.
Why use it?
It helps explain why an automated test cannot find, click, or wait for an element when the interface changes or uses dynamic content.

Skill for Claude CodeCodex

Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

agentmods
npx agentmods add skills/anhtester/antigravity-testing-kit/ui_debug_agent
Any agent
npx skills add anhtester/antigravity-testing-kit --skill ui_debug_agent
Clone the repo
git clone --depth 1 https://github.com/anhtester/antigravity-testing-kit

Made for: Claude Code, Codex.

Per session 39 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 2,367 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. Scan, not verified.
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5 $0.00039 $0.02367
Opus 5 $0.00019 $0.01184
Sonnet 5 $0.00008 $0.00473
Haiku 4.5 $0.00004 $0.00237

Measured 2d ago against content hash 801f395a0e52, method: parsed. Prices are Anthropic first-party input rates as of 2026-08-30, from the pricing page.

Security

Grade A, and why

UI Debug Agent scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 2d ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

Origin

Copies of this mod

2 near-identical copies found in the catalogue:

.agent/skills/ui_debug_agent/SKILL.md · 234 lines

How it starts

The opening of the file, as written. The whole thing — 234 lines — stays where its author put it; the contents beside it link to each section on GitHub.

UI Debug Agent

Description

Skill chuyên biệt giúp agent inspect ứng dụng web/mobile trực tiếp trên browser thật, phân tích DOM, thu thập locators ổn định, và debug các vấn đề UI automation.

Agent có thể:

  • Mở browser thật, navigate đến bất kỳ URL nào
  • Inspect DOM elements — xác định attributes, hierarchy, state
  • Thu thập locators ổn định cho Playwright, Selenium, Appium
  • Debug automation failures (element not found, click intercepted, timeout)
  • Capture UI state (snapshot, screenshot) để phân tích
  • Phân tích dynamic content, iframe, shadow DOM, SPA navigation

When to Use

Sử dụng skill này khi:

  • Cần khám phá UI của một trang web/module mới
  • Cần tìm locator cho element cụ thể
  • Cần debug test automation fail do UI thay đổi
  • Cần verify locator có hoạt động trên DOM thực tế không
  • Cần phân tích DOM để hiểu cấu trúc UI (forms, tables, modals)
  • Cần capture evidence (screenshot) cho test report

Trigger keywords: "inspect UI", "tìm locator", "debug element", "mở browser xem", "kiểm tra DOM"


MCP Command Sequence (BẮT BUỘC)

Khi sử dụng Playwright MCP để debug UI, LUÔN tuân theo thứ tự:

1. browser_navigate(url)           → Mở trang
2. browser_resize(1920, 1080)      → Desktop viewport
3. browser_wait_for(text/time)     → Chờ page load
4. browser_snapshot()              → Thu thập DOM (dùng để phân tích + tìm locator)
5. browser_click/type/hover(ref)   → Tương tác (nếu cần)
6. browser_take_screenshot()       → Chụp ảnh (evidence khi fail hoặc milestone)

Quy tắc quan trọng:

Quy tắc Chi tiết
KHÔNG navigate lại nếu đã ở đúng trang Tránh reload ngoài ý muốn
LUÔN resize ngay sau navigate browser_resize(1920, 1080) — đảm bảo desktop viewport
LUÔN wait trước khi snapshot Chờ page load hoàn tất
Dùng snapshot để phân tích Snapshot trả về accessibility tree — nhanh, chính xác, có ref để tương tác
Dùng screenshot để báo cáo Screenshot là hình ảnh — dùng khi cần evidence visual

Read the full file on GitHub · 234 lines

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. 2d ago First seen · 234 lines · 39 tokens per session scan A 801f395a0e52

Subscribe to this mod's changes

UI Debug Agent is a skill published in the GitHub repository anhtester/antigravity-testing-kit (131 stars, last pushed 1mo ago), licensed MIT. It adds 39 tokens to every session and 2,367 once invoked, about $0.0002 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.

Related

Other skills, from other repositories

keploy-docs

Guide for contributing to the Keploy documentation site at github.com/keploy/docs. Invoke when a change in keploy/keploy introduces, removes, or alters user-visible behavior (new CLI flag, changed default, new command, new configuration field, new on-disk format) and the docs need to catch up — or when the user asks…

keploy/keploy · 116 tokens

keploy-pr-workflow

Guide for creating PRs and issues on keploy repositories — PR format, customer-data hygiene, commit conventions, sign-off. Invoke when the user asks to open, update, or review a pull request or issue, when preparing a commit that will land in main, or whenever a change is about to leave the local machine.

keploy/keploy · 71 tokens

keploy-e2e-test

End-to-end verification of a change to keploy/keploy using keploy's own record/replay against a real sample application. Use whenever the user asks to test a change, verify a fix, prove that a modification works in practice, add e2e coverage for a PR, reproduce a bug against a sample app, or wire a behavior into CI.…

keploy/keploy · 118 tokens

skills-rbt-manual-testing

Skill sinh manual test cases với 2 modes — QUICK (sinh nhanh từ requirements) và FULL RBT (quy trình AI-RBT 6 bước có đánh giá rủi ro). Master skill cho mọi tác vụ manual test case.

anhtester/claude-testing-kit · 57 tokens

skills-requirements-analyzer

Kỹ năng phân tích trang web/module/tài liệu và sinh ra tài liệu Yêu cầu (Requirements Document/User Stories) chuẩn mực — có gán mã REQ ID truy vết được, phát hiện Ambiguity/Risk, kèm ma trận phân quyền và trạng thái.

anhtester/claude-testing-kit · 66 tokens

skills-framework-architect

Skill thiết kế và scaffold automation framework hoàn chỉnh cho Playwright, Selenium, và Appium — bao gồm project structure, base classes, config management, reporting, và CI/CD integration.

anhtester/claude-testing-kit · 42 tokens