Training Grounds
Listener That MultipliesBlue Belt
+25 Ki
Description

A component tracks how many keys have been pressed and how many times a button has been clicked. Each keypress should add exactly 1 to the key count regardless of how many times the button has been clicked.

Anomaly

Press a key — the count increments normally. Click Re-render, then press keys again — the count jumps by more than 1 per keypress. The more times Re-render is clicked, the larger the jump per keypress becomes.

Constraint
Fix must return a cleanup function from useEffect that calls window.removeEventListener
Do not move the addEventListener outside of useEffect
Hint

Every time the effect re-runs, it registers a new keydown listener. Without a cleanup function, the old listeners are never removed — so after two re-renders, three listeners all fire on every keypress.

Consult the SenseiOnly for those truly stuck · Flip to reveal

Every time the effect re-runs, it registers a new keydown listener. Without a cleanup function, the old listeners are never removed — so after two re-renders, three listeners all fire on every keypress.

Loading editor…
Correct Solution
Loading...
Expected OutputGoal State
Your OutputLive