ada-blazor-ui-audit

Audits Blazor component libraries across rendering, CSS, JS interop, packaging, and browser behavior.

Updated Jul 23, 2026
One-click install
npx skills add https://github.com/wubing7755/Ada --skill ada-blazor-ui-audit-wubing7755
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ada-blazor-ui-audit
Source: https://github.com/wubing7755/Ada/tree/main/skills/software-development/ada-blazor-ui-audit
Command: npx skills add https://github.com/wubing7755/Ada --skill ada-blazor-ui-audit-wubing7755

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Compilation success and green unit tests do not prove a Blazor UI actually works in the browser. This Skill performs a read-only, end-to-end audit of a Blazor or Razor component library, tracing rendering, state notifications, CSS/markup contracts, JavaScript interop, disposal, packaged assets, and demo topology to produce severity-ranked findings with file:line evidence. ## Core Features & Use Cases - Full behavioral chain tracing: Maps DOM events through handlers, state mutation, notifications, projection rebuilds, render requests, and persistence to find broken links. - Interop and lifecycle pairing checks: Verifies attach/detach, listener add/remove, DotNetObjectReference create/dispose, and observer start/stop pairs, plus RenderTree sequence stability across transitions like Undo/Redo. - Package and demo verification: Confirms the demo consumes the current source, package, or bundle and that the browser loaded the exact artifact under test. - Use Case: bUnit tests pass but drag-and-drop fails in the browser; the audit checks hit-test geometry, producer/consumer reachability, and real operation commits instead of trusting DOM presence. ## Quick Start Ask the agent to audit your Blazor component library end to end, covering components, CSS, JavaScript interop, state notifications, packaging, and real-browser behavior, and to return severity-ranked findings with file:line evidence.

Frequently Asked Questions about ada-blazor-ui-audit

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I audit a Blazor component library beyond unit tests?

Run a read-only audit that freezes authored source scope, reconstructs the component tree, traces mutation and interop chains, and verifies CSS selectors, hit-test geometry, and package topology. Findings are returned severity-ranked with file:line evidence.

Why do bUnit tests pass but the Blazor UI fails in the browser?

bUnit does not exercise real DOM geometry, CSS application, or browser event dispatch. Hidden, zero-sized, or covered elements can exist in the DOM without being operable, so the audit requires real-browser evidence of the actual operation completing.

When should I use a full Blazor UI audit versus a narrower pitfall check?

Use the full audit when the defect spans Razor, CSS, JavaScript interop, and state services or when package and demo behavior diverge. If the bug is already isolated to lifecycle/rendering or JS interop lifetime, route to the narrower Blazor pitfall Skills instead.

Does the audit check hand-written BuildRenderTree code?

Yes. It examines state-dependent element, attribute, and collection cardinality, shared sequence counters across variable siblings, and A-to-B-to-A or Undo/Redo transitions, verifying stable keys, node IDs, and sentinel content rather than only initial markup.

Can the audit detect a demo running a stale package or bundle?

Yes. It determines whether the demo consumes source, a package, or copied assets, rebuilds generated bundles, packs and restores when required, and proves the browser loaded the current artifact using bundle markers and smoke tests.

Does the Blazor UI audit modify my source code?

No. The audit is read-only and normally modifies no files. It stops and reports when a proposed fix would cross an unapproved public API or architecture boundary, routing implementation work to a separate step.