microsoft / microsoft/react-native-windows

Accessibility for Fabric

Open
#11,898 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Area: Accessibility Area: Fabric Deliverable enhancement New Architecture Workstream: Accessibility
Dominant language
C++
Stars
17.3k
Forks
1.2k
Avg merge
1d 13h
Merged PRs (30d)
33

Description

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 https://github.com/microsoft/react-native-windows/pull/11129
AM0 Full Tree Projection Implement basic navigation functions to have a full tree represented for dev tools and automated tests Completed https://github.com/microsoft/react-native-windows/pull/11412
AM1 Basic Screen Readable Support core react-native accessibility props and required focus management for basic content announcements https://github.com/microsoft/react-native-windows/issues/11899 Completed
AM1 Basic Interaction Support Invoke pattern to unblock basic interaction and richer automated tests https://github.com/microsoft/react-native-windows/issues/11900 Completed
AM2 Advanced Screen Readability N of M, HelpText, Description, Value https://github.com/microsoft/react-native-windows/issues/11901 In Progress
AM2 Advanced Interaction Scroll patterns, Selection Patterns, Advanced Focus Management https://github.com/microsoft/react-native-windows/issues/11903
AM2 Office Requirements Parity with Office implementations of accessibility https://github.com/microsoft/react-native-windows/issues/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 https://github.com/microsoft/react-native-windows/issues/11905
Tasks

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the AM3 milestone and review the remaining task-list items, especially automated validation and issue #14725. The issue provides no source files or test entry points, so use the linked accessibility task issues and existing Fabric E2E test app work to locate the relevant infrastructure. Done means automated accessibility scenarios are covered and regressions can be detected.

Written by the indexing model from the issue text.

Assessment

Tech stack
cpp, react-native
Domain
accessibility, frontend, testing
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
20/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.