click-path-audit-edho-ferdian

Trace UI control handlers through state changes to detect silent defects.

2|Updated Sep 6, 2026
One-click install
npx skills add https://github.com/edhoferdian/EEF --skill click-path-audit-edho-ferdian-edhoferdian
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: click-path-audit-edho-ferdian
Source: https://github.com/edhoferdian/EEF/tree/main/.agents/skills/click-path-audit-edho-ferdian
Command: npx skills add https://github.com/edhoferdian/EEF --skill click-path-audit-edho-ferdian-edhoferdian

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Buttons and controls can appear broken even when their handlers exist, never crash, and pass type checks, because a later call in the handler silently resets the state an earlier call set. This Skill finds those defects by tracing every interactive element through its full state-change sequence instead of reading code line by line. ## Core Features & Use Cases - Side-Effect Map: Builds a mandatory map of every store action (Zustand, Redux, context, signals) recording which fields each action sets and which it resets as an undeclared side effect. - Six Defect Patterns: Checks each trace against sequential undo, async races, stale closures, missing transitions, conditional dead paths, and effect interference. - Structured Reports: Produces severity-rated findings (CRITICAL to LOW) with numbered call sequences, expected versus actual state, and concrete fixes. - Use Case: After refactoring a shared Zustand store, a "New Email" button stops opening the compose form. The audit reveals that selectThread(null) resets composeMode as a side effect, undoing the setComposeMode(true) call that ran one line earlier. ## Quick Start Ask the assistant to run a click-path audit on the screen or store where a button does nothing despite its handler existing.

Frequently Asked Questions about click-path-audit-edho-ferdian

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

FAQPage Schema
How do I debug a button that does nothing when clicked?

Trace the handler's full call sequence against a map of what each store action sets and resets. The most common cause is sequential undo, where a later call like selectThread(null) resets state an earlier call just set, leaving the final state unchanged.

How to find state bugs after refactoring a Zustand or Redux store?

Build a side-effect map listing which fields each store action sets and which it resets as an undeclared side effect, then audit every caller of the changed actions. Defects hide in the dangerous resets list, not in any single function.

What defect patterns does a click-path audit check for?

It checks six patterns: sequential undo, async races, stale closures, missing transitions, conditional dead paths, and effect interference. Each trace is judged against what the control's label promises, not against whether the code runs.

When should I not use a click-path audit?

Do not use it for API-level defects like wrong response shapes, styling and layout issues, or performance problems. Those belong to normal debugging, visual QA sweeps, and performance audits respectively.

Why does my handler run without errors but the UI never updates?

The handler likely sets state that a subsequent call or an observing effect immediately resets. Nothing throws because every function works in isolation; the defect only appears in the sequence of writes to shared state.