What problem does it solve?
This Skill helps you identify why a UI touchpoint appears broken even when each individual handler function “works” on its own—typically due to sequential state updates that cancel each other out, shared-store side effects, or race conditions that leave the final UI state inconsistent with the button label.
Core Features & Use Cases
- Sequential Undo Detection: Traces ordered calls inside a click/submit/change handler and flags cases where later calls reset or clear earlier state changes.
- Shared State Side-Effect Mapping: Builds an action-level map of what Zustand/Redux/context store setters read/write/reset to catch “dangerous resets” that affect other UI flows.
- Race/Staleness Checks: Evaluates async resolution order and stale closure patterns that can produce the wrong final state.
- Use Cases: Diagnose “button does nothing” reports after refactors touching shared state stores, or after systematic debugging finds no conventional faults but users still observe broken behavior.
Quick Start
Audit the reported broken touchpoint by tracing each handler’s function calls in order, mapping store action side effects (sets vs resets), and reporting any sequential undo, async race, stale closure, missing transition, dead path, or useEffect interference that prevents the final UI state from matching the button’s promised outcome.