- Success Criterion 2.1.2
- Conformance level A
Non-Standard Focus Exit Key That’s Never Explained to Users
2.1.2 — No Keyboard Trap
Scenario
Setting
A professional networking site's profile editor
What’s wrong
Non-standard exit exists (e.g., Ctrl+M) but user is never advised of it — normative fail of the advisory clause.
Example
skillsEditor.addEventListener('keydown', (e) => {
if (e.key === 'Tab') { e.preventDefault(); addNewTagSlot(); }
if (e.ctrlKey && e.key === 'm') { skillsEditor.blur(); moveFocusToNextField(); }
});
<!-- Ctrl+M works, but no label, tooltip, or instructions mention it anywhere --> Why it matters
A user stuck in the skills editor has no way to discover that Ctrl+M is the way out, since Tab keeps adding tags instead of leaving the field.
How to test
Look for any documentation or on-screen text advising a non-standard exit key (e.g., Ctrl+M): if such a key exists but the user is never told about it, it fails the advisory requirement.
How to fix
WCAG 2.1.2 requires the exit mechanism to be advised to the user, not merely present in the code; add visible, referenced instructions.
<p id="skills-hint">Press Ctrl+M to leave this field; Tab adds another skill.</p>
<div class="skills-editor" aria-describedby="skills-hint">...</div> Outcome
A user reads the on-screen hint, presses Ctrl+M, and moves on to the next field.
Who is affected
Keyboard-only users and screen reader users have no discoverable path out of the field even though a technical escape exists in the code.
Learn more
- Understanding Understanding document (opens in a new tab)
Related scenarios
- Keyboard Focus Stuck Inside an Embedded Plugin or Widget
- Modal Focus Trap With No Escape Key or Close Button
- Widget Where Tab Cycles Internally With No Way Out
- Third-Party Embed That Captures and Never Releases Tab Focus
- Script That Yanks Focus Back Every Time the User Tabs Away
- Rich Text Editor That Captures Tab With No Documented Escape