Test Scenario
This mock demonstrates a keyboard trap where focus becomes trapped within a specific section. When navigating with Tab or Shift+Tab, the focus loops between internal elements and cannot escape.
Instructions: Use Tab and Shift+Tab to navigate. Notice how focus gets trapped in the red-bordered area below and cannot reach the “Unreachable Button” at the bottom.
Before the Trap
⚠️ Keyboard Trap Zone
Focus is trapped within this area. Tab and Shift+Tab will cycle between these elements only.
After the Trap (Unreachable)
This button should be unreachable via Tab navigation due to the focus trap above.
How to Escape
In a real application, you would typically escape a focus trap using:
- Escape key to close modal/dialog
- Clicking outside the trapped area
- Specific close button within the trap
- Programmatic focus management