ionic-team / ionic-team/cordova-plugin-ionic-webview

iOS: Initial accessibility focus is wrong when using Voiceover

Open
#364 1 comment 2 reactions 0 assignees View on GitHub
Dominant language
Objective-C
Stars
493
Forks
410
PR merge metrics
No merged PRs in 30d

Description

When this plugin is installed in a Cordova project (i.e. it's using WKWebView instead of UIWebView) and the iOS Voiceover screenreader is enabled, the initial accessibility focus of the screenreader after app startup is on a hidden "text field" instead of the content of the Webview. This makes it very confusing for blind users.

Platforms affected: iOS

Expected result: When app is started with Voiceover enabled, or if Voiceover is enabled while app is in foreground, the first element the screenreader should focus on is the first focusable HTML element in the Webview.

Actual result: When app is started with Voiceover enabled, or if Voiceover is enabled while app is in foreground, the first element the screenreader focuses on is an invisible "text field".

## Test environment
Test device: iPad Air 2 running iOS 12.2
Plugin version: `cordova-plugin-ionic-webview@4.0.1`
Ionic CLI version: 4.12.0

## Notes
- A Cordova iOS app without this plugin (i.e. UIWebView instead of WKWebView) works as expected, i.e. the initial focus is on HTML elements inside the Webview.
- Not sure if it's this plugin or WKWebView itself (maybe a hidden URL address input bar?) that's causing the hidden "text field" to gain initial accessibility focus.
- From what I can see in [this SO post](https://stackoverflow.com/a/36878962/777265) it should be possible to set the initial focus on a specified first element. This should be the Webview content in the Cordova iOS app.

## Steps to reproduce

### Ionic 3 test project

ionic start ionic-test tabs --cordova && cd ionic-test
ionic cordova plugin add cordova-plugin-ionic-webview@latest
ionic cordova platform add ios@latest
ionic cordova run ios

Audio recordings:

- app startup with Voiceover turned on and this plugin present in the app (i.e. WKWebView): http://ge.tt/5lw110w2
- app startup with Voiceover turned on and this plugin NOT present in the app (i.e. UIWebView): http://ge.tt/9OH610w2
- turn on Voiceover after app startup and this plugin present in the app (i.e. WKWebView): http://ge.tt/40c710w2
- turn on Voiceover after app startup and this plugin NOT present in the app (i.e. UIWebView): http://ge.tt/1aEA10w2

### Vanilla Cordova test project

cordova create cordova-test && cd cordova-test
cordova plugin add cordova-plugin-ionic-webview@latest
cordova platform add ios@latest
cordova run ios

Audio recordings:

- app startup with Voiceover turned on and this plugin present in the app (i.e. WKWebView): http://ge.tt/3h9D10w2
- app startup with Voiceover turned on and this plugin NOT present in the app (i.e. UIWebView): http://ge.tt/8KGH10w2
- turn on Voiceover after app startup and this plugin present in the app (i.e. WKWebView): http://ge.tt/7CNM10w2
- turn on Voiceover after app startup and this plugin NOT present in the app (i.e. UIWebView): http://ge.tt/6O7Q10w2

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.