اكتشاف مآزق لوحة المفاتيح

A keyboard trap is any spot where focus goes in but cannot get out with the keyboard. For a mouse-free user, it is a dead end. 🪤

A trapped user may have to reload the whole page just to escape. WCAG calls a no-exit trap a failure, not a minor bug.

Traps love rich widgets: custom date pickers, embedded editors, and third-party plugins that grab focus and never hand it back.

A dialog that intercepts Tab but offers no way to leave is the most common trap. A real modal must close on Escape.

Embedded content like a video or map sits in an iframe. Some grab focus and leave the user circling inside with no exit.

Script that calls preventDefault on the Tab key can block the browser's normal move. Suddenly focus simply refuses to advance.

Some traps let Tab move forward but block Shift+Tab. Test both directions, because a one-way path is still a trap.

Holding focus inside an open modal is correct on purpose. The rule is that there must always be a clear exit like Escape or a close button.

The test is blunt and effective. Tab through the entire page using only the keyboard and never reach for the mouse to escape.

If focus keeps cycling inside one component and Tab will not carry you onward, you have found a trap. Note exactly where it caught you.

The fix is to restore a way out: let Tab continue, honor Escape, and on close return focus to the trigger that opened the layer.

Identify what truly defines a keyboard trap.

A trap holds focus with no keyboard exit, and it fails WCAG. Tab through everything both ways, and always provide an escape path. ✅