click-path-audit

Solid

Trace every user-facing button/touchpoint through its full state change sequence to find bugs where functions individually work but cancel each other out, produce wrong final state, or leave the UI in an inconsistent state. Use when: systematic debugging found no bugs but users report broken buttons, or after any major refactor touching shared state stores.

AI & Automation 201,447 stars 30903 forks Updated yesterday MIT

Install

View on GitHub

Quality Score: 96/100

Stars 20%
100
Recency 20%
100
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
50
License 10%
100
Description 5%
100

Skill Content

# /click-path-audit — Behavioural Flow Audit Find bugs that static code reading misses: state interaction side effects, race conditions between sequential calls, and handlers that silently undo each other. ## The Problem This Solves Traditional debugging checks: - Does the function exist? (missing wiring) - Does it crash? (runtime errors) - Does it return the right type? (data flow) But it does NOT check: - **Does the final UI state match what the button label promises?** - **Does function B silently undo what function A just did?** - **Does shared state (Zustand/Redux/context) have side effects that cancel the intended action?** Real example: A "New Email" button called `setComposeMode(true)` then `selectThread(null)`. Both worked individually. But `selectThread` had a side effect resetting `composeMode: false`. The button did nothing. 54 bugs were found by systematic debugging — this one was missed. --- ## How It Works For EVERY interactive touchpoint in the target area: ``` 1. IDENTIFY the handler (onClick, onSubmit, onChange, etc.) 2. TRACE every function call in the handler, IN ORDER 3. For EACH function call: a. What state does it READ? b. What state does it WRITE? c. Does it have SIDE EFFECTS on shared state? d. Does it reset/clear any state as a side effect? 4. CHECK: Does any later call UNDO a state change from an earlier call? 5. CHECK: Is the FINAL state what the user expects from the button label? 6. CHECK: Are there race conditions (async cal...

Details

Author
affaan-m
Repository
affaan-m/everything-claude-code
Created
4 months ago
Last Updated
yesterday
Language
JavaScript
License
MIT

Integrates with

Similar Skills

Semantically similar based on skill content — not just same category

Data & Documents Listed

audit

Audit a codebase for bugs, report findings BEFORE changing anything, then on approval fix, verify with a build/tests, and commit + push. Use when the user asks to "audit the codebase", "find bugs", "audit and fix", or run their standard audit-fix-verify-push loop.

0 Updated today
aljazfrancic
AI & Automation Listed

customer-audit

Universal, multi-agent, VISION-VERIFIED audit that makes any app, website, tool, CLI, API, or MCP server genuinely great. Fans out one agent per surface and exercises EVERY single control (button, field, toggle, menu, tab, swipe, long-press, drag) for real — screenshotting before/after and looking at the result — across every lens: does each control actually work + persist + sync, the "does the UI lie?" trust audit, UI/interaction craft & motion, fresh-eyes customer journeys, competitive teardown, accessibility, performance, security, microcopy, empty/error/edge states. Adversarially verifies every finding, then returns a ranked fix list (or auto-fixes). Detects and uses the available MCP servers (e.g. Playwright for websites) and routes UI findings through the user's installed design skills. Trigger when the user says "audit", "customer audit", "review every page/screen", "find everything wrong or missing", "test every button", "QA this", "make this badass/premium", "is everything working and in sync", or ru

2 Updated 2 days ago
Evil-Bane
AI & Automation Listed

debug

Systematic debugging workflow for tracking down bugs and issues

10 Updated 6 days ago
jmylchreest
Web & Frontend Listed

ss-audit

Audit screens for UX issues using Nielsen's heuristics and modern mobile UX best practices

0 Updated today
ENDERMITA12
AI & Automation Listed

wjs-auditing-project

Use when the user asks to audit what's wrong with a project, "make it right", "看看项目出了什么问题", "为什么用户的需求还没上线", "为什么没提交App Store", "为什么没新build", or wants a holistic state-of-the-project check covering unmerged branches, stalled PRs, failed GitHub Actions, stale builds, plan drift (TODOS.md / ROADMAP), unreleased commits, and log errors. Runs read-only investigation, presents a grouped checklist, fixes only after explicit user confirmation. Aware of the Cathier iOS app workflow (Xcode + fastlane + auto-merge @claude PRs from in-app feedback).

67 Updated yesterday
jianshuo