Modal Focus Ticket Example
Modal bugs often sound abstract until the ticket names the focus path: where focus stays, what it skips, and how users get back out.
Developer-ready ticket
# [High] Product page: size guide modal does not receive keyboard focus ## User impact Keyboard and screen reader users may not realize a modal opened and can continue navigating the background page. ## Expected behavior When the modal opens, focus moves to the dialog heading or first meaningful control. Focus remains inside the modal until it is closed. ## Actual behavior Focus stays on the triggering button. Tab continues to background page controls. ## Reproduction steps 1. Open a product detail page. 2. Activate “Size guide” with the keyboard. 3. Press Tab several times. 4. Observe that focus remains behind or leaves the modal instead of staying in the dialog. ## Likely WCAG references to verify - 2.4.3 Focus Order - 2.1.2 No Keyboard Trap - 4.1.2 Name, Role, Value ## Acceptance criteria - Focus moves into the modal when opened. - Focus remains within the modal while it is open. - Escape or the close button closes the modal. - Focus returns to the size guide trigger after close. ## Fix direction Use a semantic dialog pattern, move focus on open, trap focus while open, name the dialog, and restore focus to the trigger when closed.