A polished booking overlay can become a trap when a customer cannot reach its close button or return to the appointment link. Choose a modal only when its focus path can be demonstrated. A separate booking page may be a better scoped delivery when that interaction cannot be supported.
Who should use this acceptance brief
Appointment and consultation websites. Use this as a scoped commissioning task for a website supplier. Where system evidence is required, a teaching file is not a substitute.
Source-bound platform fact
The W3C modal pattern keeps keyboard navigation within the dialog while open and usually returns focus to the invoking element on close. Initial focus depends on content, not a universal first-field rule. W3C: modal dialog pattern · Checked 16 October 2026.
Filled teaching example
Synthetic example, not a client case. Inputs, expected decisions and counterexamples follow; no live platform integration is claimed.
On narrow screens, scroll to read the complete table.
| Input / case | Check basis | Expected decision |
|---|---|---|
| close → time → confirm → Tab | close | wrap |
| close + Shift-Tab | confirm | reverse wrap |
| Escape, opener still exists | book-button | return |
Run the acceptance exercise
- Write the intended initial focus and the reason for that choice.
- Walk every focusable control forward and backward; test Escape and the visible close control.
- Close and verify the original booking trigger is available; document the fallback if removed.
Interpret the result and retain evidence
The offline model wraps a known three-control list. It demonstrates the expected sequence, not working dialog code. In the browser, background controls must not steal the modal focus path. Repeat the test after a validation message adds another control; a static screenshot cannot prove this requirement.
Limits before implementation
Exclude calendar availability, payment and appointment confirmation. No change to existing booking interfaces is authorised by this example.
Replay the finite example
Save both files in one folder and run with Node22.13 or newer. These finite checks are not a live service or certification. Filled inputs and expected outputs · Inspectable functions
node decision-check.mjs booking-dialog-keyboard-path.json