Toggle switch - Apple iOS app accessibility testing checklist

How to test a toggle switch

Gherkin Condensed

Given that I am on a screen with a toggle switch

WHEN I use the arrow keys or ctrl + tab to move focus to a switch I SEE focus is visually indicated (strongly if high contrast enabled)
Then when I use the spacebar to activate the switch I SEE the state is changed

WHEN I use a screenreader AND I swipe to focus on a switch input
- I HEAR Its purpose is clear and matches visible label
- I HEAR It identifies itself as a switch button
- I HEAR Any visible label is read with the switch in a single swipe
- I HEAR It expresses its state (dimmed, on/of)
Then when I doubletap with the switch in focus I HEAR the state is changed

When I use Text resize I SEE text can resize up to 200% without losing information
When I use Increase contrast I SEE focus outline becomes high contrast

When I use	I see/hear
Arrow keys or ctrl + tab	Focus visibly moves to the switch
Spacebar	Element toggles between states

When I use	I hear
Swipe	Focus moves to the element, expresses its name, role, state
Doubletap	Element toggles between states

Reads	I hear
Name	Its purpose is clear and matches visible label
Role	It identifies itself as a switch button
Group	Any visible label is read with the switch in a single swipe
State	It expresses its state (dimmed, on/of)

When I use	I see
Text resize	Text can resize up to 200% without losing information
Increase contrast	Focus outline becomes high contrast

Usage

A toggle switch has two mutually exclusive states — on/off
Do not use a switch to toggle between other states/values
- Example: Using a switch to toggle between Weekly or Monthly subscriptions
  - Instead use buttons or a segmented control
Do not put names or values in the label that can confuse the state of the switch
- Example: Using a switch label like “Call blocking disabled” makes the on/off state difficult to discern
  - If “Call blocking disabled” is on, is call blocking disabled?
  - If “Call blocking disabled” is off, is it enabled?
  - Instead, label the toggle switch “Call blocking” which can be clearly on/off

Do not use for contextual/localized options for which a picker or button would be more appropriate
- Ex: “Shipping address matches payment address” is not a broad setting
Outside of a list, use a button that behaves like a toggle, not a switch.
Do not use for two mutually exclusive opposing named options
- Ex: “List view or Map view”

A toggle switch should be used for broad application/system settings
- Ex: “Dark mode” is a broad setting affecting an entire application; toggle switch is appropriate