Accessibility for Fabric

[chiaramooney]

Accessibility for Fabric Architecture

(last updated on January 2024)
This is the meta issue capturing the effort of adding E2E testing for the new Fabric architecture.

Current Accessibility Status

Progress Towards API Parity with Paper

Type	Parity Status
Accessibility Props	100% (11/11)
Accessibility Interactions	100% (12/12)

Accessibility Milestones

Below are descriptions for the accessibility milestones that we have identified for the new architecture. We are currently working on the AM2 milestone.

AM0 - "Base Infrastructure" ✅

• Components can access UIA APIs through a UIA provider.
• Each component is rendered in the UIA tree.

AM1 - "Base Information and Interaction" ✅

• UIA tree is separated in Content Tree and Raw Tree. Controls should only be in the Content Tree if they are accessible.
• Support for key accessibility props including focusable and accessible.
• Support for key interaction scenarios including onAccessibilityTap.

AM2 - "90% API Parity" ✅

• Support for 90% accessibility props which were supported on Paper.
• Support for 90% UIA data types which were supported on Paper.
• Support for 90% interaction scenarios which were supported on Paper.

AM3 - "Testing" Current Milestone

• E2E test app testing infrastructure should be able to dump the accessibility tree for a component. Test sample created for composition tree dumps.
• Tests should capture key accessibility scenarios.
• Manual user testing of accessibility behavior.
• App on Fabric should be submitted for accessibility grading to ensure accessibility compliance.

AM4 - "Parity with Paper"

• Support for new aria props.
• Support accessibilityInfo module.
• Support remaining props/interaction patterns which were supported on Paper.

Accessibility Tasklist

Milestone	Task	Description	Status
AM0	Live Accessibility Integration	Serve up a stubbed out RootView provider to core UIA APIs that serves as a basic connection.	Completed #11129
AM0	Full Tree Projection	Implement basic navigation functions to have a full tree represented for dev tools and automated tests	Completed #11412
AM1	Basic Screen Readable	Support core react-native accessibility props and required focus management for basic content announcements #11899	Completed
AM1	Basic Interaction	Support Invoke pattern to unblock basic interaction and richer automated tests #11900	Completed
AM2	Advanced Screen Readability	N of M, HelpText, Description, Value #11901	In Progress
AM2	Advanced Interaction	Scroll patterns, Selection Patterns, Advanced Focus Management #11903
AM2	Office Requirements	Parity with Office implementations of accessibility #11904
AM3	Manual Validation	Perform a manual validation pass of accessibility functionality to walk through common accessibility scenarios and file issues.
AM3	Automated Validation	Add a set of automated tests to prevent against accessibility functionality regressions.
AM3	Accessibility Pass	App on Fabric should be submitted for accessibility grading to ensure accessibility compliance.
AM4	Aria props	Support for Aria props introduced in .71 #11905

Tasks

• Add basic UIA provider to Fabric's CompositionRootView #11129
• Basic implementation of UIA navigation functions #11412
• Basic Screen Reader Functionality on Fabric #11899
• Basic Interaction on Fabric #11900
• Advanced Screen Reader Readability on Fabric #11901
• Advanced Interaction on Fabric #11903
• Office API Needs for Accessibility on Fabric #11904
• Aria Props on Fabric #11905
• Manual Validation
• Automated Validation
• Accessibility Pass #13390
• Add YellowBox Warnings when developer has not set up their interaction methods correctly #13317
• Add Functional Accessibility Checks to CI #14725