Menu - Android app accessibility testing checklist

How to test a menu

Gherkin Condensed

Given that I am on a screen with a menu

1 Keyboard

WHEN I use the tab key or arrow key to move focus to a menu I SEE focus is visually indicated
Then when I use spacebar or enter I SEE the menu opens
Then when I use the tab key or arrow key to move focus to an option I SEE focus is visually indicated
Then when I use spacebar or enter I SEE the option is selected
Or when I use escape key I SEE the menu closes, focus returns to meaningful location

2 Android screenreader

WHEN I use a screenreader AND I swipe to focus on a menu or option
- I HEAR its purpose is clear and matches visible label
- I HEAR it identifies itself as a button
- I HEAR any visible label is read with the button in a single swipe, icons are ignored
- I HEAR it expresses its state (disabled, selected, etc)
Then when I doubletap with the button or option in focus I HEAR the action occurs

3 Device settings

When I use Text resize I SEE text can resize up to 200% without losing information

1 Keyboard actions

When I use	I see/hear
Tab	Focus visibly moves to the menu and options
Up/down arrows	Opens closed menus, for open menus moves focus to the next item
Left/right arrows	Opens or closes a submenu
Letters	Focus moves to the next option starting with letter
Spacebar or enter	Opens the menu or selects options
Escape	Closes menu, focus returns to meaningful location

2 Mobile screenreader gestures

When I use	I hear
Swipe	Focus moves to the menu or options, expresses its name, role, state
Doubletap	Opens the menu or selects options

3 Screenreader output

Reads	I hear
Name	Its purpose is clear and matches visible label
Role	It identifies itself as a button
Group	Any visible label is read with the button in a single swipe, icons are ignored
State	It expresses its state (disabled, selected, etc)

4 Device settings

When I use	I see
Text resize	Text can resize up to 200% without losing information

Usage

Menus display a list of choices on a temporary surface

Icons inside buttons

Decorative images inside a button also containing visible text are never read to the screen reader.

For example, when a screenreader encounters a “Send message” button with a decorative paper airplane, the icon must be ignored.

Pitfalls

Do not rely on an image’s alternative accessibility text label to name an icon button. Directly encode the name into the button component itself. The icon should be ignored by the screen reader.

Material guidance

Material accessibility overview

Android Menu