Testing Native Mobile Apps Jonathan Avila Chief Accessibility Officer SSB BART Group

Agenda Applicable standards Approach Choose device/platform version Configure accessibility features Know how to use accessibility features Testing Resources

Can apply Section 508 software standards Applicable Standards Can apply Section 508 software standards Can apply WCAG 2 (typically Level A and AA) Some gaps for touch and small screen size Touch target size Gesture access with AT running Single touch access Touch up events Mobile Accessibility Task Force at W3C proposing to fill the gaps in WCAG 2.1+ Refer to platform accessibility guides for expected behaviors on mobile

Choose Device and Platform Version iOS version (current version and one previous) Choose iPhone and iPad if app layout is different Use of external keyboard limited to input without AT Android (current and one version back) Many users don’t have or can’t upgrade to latest version Test with external keyboard Choose common hardware Samsung Nexus devices from Google Beware of vendor UIs and on-screen keyboards Consider to use or skip vendor specific accessibility features Choose multiple phone and different tablet sizes

Testing Approach without Access to Code iOS Test with accessibility features Android Accessibility Scanner (Google App) Can write your own accessibility service for testing

Testing Approach with Access to Code iOS Accessibility Inspector Xcode 7 - show properties of on-screen controls New Xcode 8 updates Check structure/reading order, Inspect, properties, and Run checks AMP for Mobile (IBM Mobile accessibility checker) Android Lint in Android Studio Check for missing contentDescription

Accessibility Features Versions and Platforms IOS With iOS accessibility features can only be updated with OS No platform wide third-party accessibility features – accessibility built in Android TalkBack and some other accessibility features may be updated separately Even with newer versions of Talkback some features may not be available on older versions of the platform Some third party screen readers and assistive touch features available Vendor specific accessibility features

Apps with Embedded Web Content Some content within a native app may be web content within a webview Webview uses system browser (Chrome Android – no Firefox in webview) (iOS Safari) Detecting web content Use iOS rotor or Android local context menu to determine if web related options are present Options like move between links will be available Test using same approach as software (with accessibility features, keyboard, etc.) unless you have access to code Guidance to developer will be different for web content

Configure Accessibility Features Enable external Bluetooth keyboard Settings > Bluetooth Choose default platform on-screen keyboard if custom one is used Configure other Accessibility Features separately Covered under interoperability

Configure Android Accessibility TalkBack (may need to install from Play store) Show spoken text (Settings > Accessibility > TalkBack > Settings > Developer Options > Display speech output) Enable suspend and resume shortcut (Settings > accessibility > TalkBack > settings > Talkback suspend and resume shortcut) Confirm you have the latest version of TalkBack (Settings > Accessibility > TalkBack > Settings > Open Talkback in the Play store) Choose comfortable speech rate Enable captions (Settings > Accessibility > Captions)

Configure iOS Accessibility VoiceOver Enable triple tap home to turn on and off VoiceOver Settings > Accessibility > Accessibility Shortcut Add items to the rotor such as links, form controls, etc. Speak "hints" enabled Set speech rate to comfortable settings Captions/Audio Description Settings > Accessibility > Media: Subtitles and captions/Audio Descriptions

Know how to use Accessibility Features When the screen reader is active the touch screen has alternative mode of interaction Touching screen focuses item and announces it Double tap activates item Swipe gestures move sequentially through content All non-decorative content must be in swipe order Know how to pause speech/turn off screen reader Scroll screen with three fingers (iOS) and two fingers (Android) iOS: adjustable controls/rotor are operated with up/down gestures

Android Specific Notes for Talkback Note that sometimes audio cues are used instead of spoke roles E.g. links in web content may be indicated with sound (e.g. earcon but word link is not announce) Tutorial on how to use Talkback is built-in (Settings > Accessibility > Talkback > Settings > Launch Tutorial) Long press will give you additional details such as if something is interactive

Testing Quick Check Keyboard/Focus – physical keyboard/Screen Reader/Switch Control Color/contrast – use grayscale or take pictures to examine contrast Captions/video descriptions – options in Settings > accessibility UI Controls/Forms – test with AT Interoperability/display settings – turn on accessibility features

Keyboard Android Use physical keyboard to perform all actions w/o TalkBack Arrow keys and/or tab keys for navigation Enter to activate control iOS Keyboard without VoiceOver will only work in limited fields such as input and passcode fields Keyboard can be used with VoiceOver instead of using gestures

Color and Contrast Android Contrast Take screenshot and send to desktop Use Accessibility Scanner for automated checking Color: On Samsung: Turn on Settings > Accessibility > Vision > Gray scale

iOS Color and Contrast OS Contrast Use app like Color Contrast to check colors from screenshot or Take picture and transfer to desktop to check contrast Color: Settings > Accessibility > Color Filters > Grayscale

Captions and Audio Descriptions After enabling captions and audio description under Settings > Accessibility Check that captions and audio description are provided If not, look for app specific settings

Check for the following (generally this order) UI (role, name, state, value) Compare what is announced to expected output Check for the following (generally this order) Name (always required) Role (e.g. checkbox, button, etc. not announced for text) Value (if applicable, e.g. for input, drop down fields) State (if applicable, e.g. checked, not checked) Hint (if applicable, when purpose is not clear) Compare announced properties to platform controls Compare swipe gestures and interaction patterns Adjustable controls use rotor to change values like date picker

Interoperability with Accessibility Features

Large Text and Zoom Large text Zoom Check for apps where text does not enlarge Check for overlapped text/truncated/cut off text Zoom Check for crashes Check for conflicts with gestures

Switch Control Check Focus order, controls gain focus, can be activated

Assistive Touch/Stylus Check for gestures that require more than one touch point

Other Interoperability with Accessibility Features (continued) Color filters Check to see if they are not overridden or cause visual anomalies Without sound Check without sound, mute device Android Voice Access (Speech recognition) (beta) Check that all controls can be activated by speech and user can input via speech Without speech Can all actions and communications be performed without speech

Resources Mobile Accessibility: How WCAG 2.0 and OtherW3C/WAI Guidelines Apply to Mobile https://www.w3.org/TR/mobile-accessibility-mapping/ iOS Accessibility Best Practices https://www.webaccessibility.com/best_practices.php?technology_platform_i d=222 Android Accessibility Best Practices https://www.webaccessibility.com/best_practices.php?technology_platform_i d=286

Resources Continued Designing for Accessibility (Android) http://developer.android.com/guide/practices/design/accessibility.html iOS Accessibility http://developer.apple.com/technologies/ios/accessibility.html Android Accessibility Scanner https://play.google.com/store/apps/details?id=com.google.android.ap ps.accessibility.auditor