ui-audit

Audit cross-page UI consistency and data quality in Vue/Nuxt and Firebase applications.

1|Updated Mar 18, 2026
One-click install
npx skills add https://github.com/lasswellt/blitz-cc --skill ui-audit-lasswellt
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-audit
Source: https://github.com/lasswellt/blitz-cc/tree/main/skills/ui-audit
Command: npx skills add https://github.com/lasswellt/blitz-cc --skill ui-audit-lasswellt

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Maintaining UI consistency, data quality, and UX compliance across multiple pages and user roles in a Vue/Nuxt + Firebase application is extremely difficult to do manually. This skill automates the extraction of labeled values, validates cross-page invariants, flags data anomalies like placeholders and stale zeros, and evaluates heuristic and accessibility violations.

Core Features & Use Cases

  • Cross-page consistency: Verifies that the same field (e.g., open_invoices) matches across dashboard, invoices, and billing pages, or documents intentional divergences.
  • Data-quality flagging: Detects NULL values, placeholder text, negative counts, format mismatches, stale zeros, and broken totals.
  • Role-based auditing: Iterates through anonymous, viewer, member, admin, and superadmin roles to catch privilege leaks and role-specific UI issues.
  • Analytics event validation: Intercepts dataLayer pushes and network beacons to detect event drift and forbidden PII props.
  • Interactive element safety: Enumerates buttons and links, checks for missing labels, dead hrefs, broken tabindex, and missing focus states, with a destructive-label classifier to prevent unsafe clicks.

Quick Start

Run the ui-audit skill in full mode to audit all roles and pages, or use smoke mode for a quick anonymous plus admin check, then review the generated findings report for invariant failures and quality flags.

Frequently Asked Questions about ui-audit

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

FAQPage Schema
How do I automate cross-page UI consistency checks in a Vue and Nuxt application?

Automate cross-page UI consistency checks in a Vue and Nuxt application by extracting labeled values from every page and asserting cross-page invariants against a configuration file to detect divergences.

How do you detect data quality issues like placeholders and stale zeros across web app pages?

To detect data quality issues like placeholders and stale zeros across web app pages, automated auditing extracts values to flag NULLs, negative counts, format mismatches, and broken totals.

Can I audit role-based privilege boundaries for anonymous, admin, and superadmin roles using Playwright?

Yes, you can audit role-based privilege boundaries for anonymous, viewer, member, admin, and superadmin roles by using Playwright browser automation to iterate through each role and catch privilege leaks.

Does UI auditing intercept analytics events to detect data layer drift and forbidden PII?

UI auditing intercepts dataLayer pushes and network beacons to detect analytics event drift and identify forbidden PII properties transmitted across your application pages.

What is the best way to validate interactive element safety and identify destructive labels in web UIs?

The best way to validate interactive element safety in web UIs is to enumerate buttons and links to check for missing labels, dead hrefs, and broken tabindex, while using a destructive-label classifier to prevent unsafe clicks.

Do I need a configuration file to declare page selectors and invariants for UX heuristic audits?

Yes, you need a .ui-audit.json configuration file declaring your pages, selectors, and cross-page invariants to evaluate UX heuristics and generate findings reports successfully.