I've found an issue specifically when the MainPage of the application is a TabbedPage, if the app is a few pages deep into a modal stack, when a popup is closed the entire accessibility tree view gets unhidden and elements from pages that are behind the modal get picked up by a screen reader.
0 - 24s:
The main page is loaded and I demonstrate scrubbing through the visible elements
25 - 37s:
A modal page is launched and I scrub through the accessibility tree, only elements on this page are read out by the reader
38 - 45s:
I present a popup, only the ui elements of the popup are picked up by the screen reader
46 - 63s:
I close the popup and scrub through the accessibility tree and you can see that elements from the first page (landing page) are being picked up by the screen reader in both forwards / backwards scrubbing directions
64s+ :
I close the modal and show the elements that were being shown in accessibility tree that weren't actually visible onscreen
Expected behavior
Only the visible elements on screen are picked up by the screen reader
Since the MainPage is set to a TabbedPage which in turn has many child pages, it was setting the accessibility to Auto for all child pages of the TabbedPage. The following solution works to prevent the accessibility tree of pages further down the visible tree being shown:
var mainPage = XApplication.Current.MainPage;
var mainPageRenderer = mainPage.GetOrCreateRenderer();
if (mainPage is MultiPage<Page>)
{
mainPageRenderer.View.ImportantForAccessibility = ImportantForAccessibility.NoHideDescendants;
}
else
{
mainPageRenderer.View.ImportantForAccessibility = ImportantForAccessibility.Auto;
}
I will raise this fix as a PR and then we can discuss further implementations, I'm not sure if other types of parent/child views are affected by this issue.
đ Bug Report
I've found an issue specifically when the
MainPage
of the application is aTabbedPage
, if the app is a few pages deep into a modal stack, when a popup is closed the entire accessibility tree view gets unhidden and elements from pages that are behind the modal get picked up by a screen reader.I recorded a video to demonstrate the issue (source code here):
https://user-images.githubusercontent.com/33064621/150830838-7d2b7301-2b44-4c5c-a798-6f2a66e96b7d.mp4
timestamp description
0 - 24s: The main page is loaded and I demonstrate scrubbing through the visible elements
25 - 37s: A modal page is launched and I scrub through the accessibility tree, only elements on this page are read out by the reader
38 - 45s: I present a popup, only the ui elements of the popup are picked up by the screen reader
46 - 63s: I close the popup and scrub through the accessibility tree and you can see that elements from the first page (landing page) are being picked up by the screen reader in both forwards / backwards scrubbing directions
64s+ : I close the modal and show the elements that were being shown in accessibility tree that weren't actually visible onscreen
Expected behavior
Only the visible elements on screen are picked up by the screen reader
Reproduction steps
Reproduction
Configuration
Version: 1.x
Platform:
Solution
I will raise a PR with a fix, the following code was causing the issue:
Since the
MainPage
is set to aTabbedPage
which in turn has many child pages, it was setting the accessibility toAuto
for all child pages of theTabbedPage
. The following solution works to prevent the accessibility tree of pages further down the visible tree being shown:I will raise this fix as a PR and then we can discuss further implementations, I'm not sure if other types of parent/child views are affected by this issue.