Skip to main content

The GAAD Pledge - One Year Later

· 4 min read
Alexandra Marlette

It has been one year since Facebook took the GAAD Pledge to make React Native accessible and the project has exceeded our expectations. We are excited to announce that this project will continue throughout 2021 and want to update everyone on our progress so far. Following a thorough analysis of the accessibility gaps in React Native last year, work began on filling these gaps.

We started with 90 outstanding gap analysis issues and from March 2021, when the project launched on GitHub, until now:

  • 11 issues have been closed by the community.

  • 19 issues were evaluated and closed by the React Native team.

  • 9 pull requests were merged.

  • 1 pull request was merged into the React Native docs.

We want to recognize and thank the React Native community for the significant progress towards a more accessible React Native over the past year. Every contributor's effort has counted in making progress on improving React Native Accessibility.

Fixes​

Two types of issues have been fixed in multiple components and one new functionality has been added to the API by the 9 pull requests.

  • An issue with Disabled state has been addressed in seven components

  • An issue with Selected state was addressed in two components

  • A new addition to the React Native API added the ability to query AccessibilityManager.getRecommendedTimeoutMillis().

Disabled State Announcement and Disable function​

One of the most prevalent issues found during the gap analysis was that some components do not announce or disable functionality. Now seven components announce their disabled state or disable click functionality.

Announces when Disabled

Disables click functionality when the component has a disabled prop

Selected State Announcement​

There were some components that did not announce their selection when in focus. This behavior has now been fixed when the component is in focus and the AccessibilityState is set to selected or the component is changed to selected.

Announces when Selected

Accessibility Timeout Setting​

There was previously no way to query the accessibility timeout setting on Android. The fix added the ability to query AccessibilityManager.getRecommendedTimeoutMillis(). This queries the "Time to take action" before the UI elements auto-dismisses or auto-progresses.

Documentation Additions​

The React Native documentation must be updated to reflect each addition or change to the available APIs. The new addition to the React Native documentation covered the addition of getRecommendedTimeoutMillis() to AccessibilityInfo.

Community Involvement​

We want to thank all the contributors mentioned below who have submitted and merged pull requests as well as those who have reviewed and commented on issues.

Merged Pull Requests​

Thank you to the community members who gave their time in other ways!

Simek, saurabhkacholiya, meehawk, intergalacticspacehighway, chrisglein, jychiao and Waltari10

Get Involved!​

We've come a long way but we're not done yet. We need your support to reach the finish line. Facebook's React Native team has committed to supporting contributors working on gap analysis issues. They will continue to respond to comments on Accessibility issues and triage pull requests. The React Native team is also tackling some of the toughest gap analysis issues. This work includes the correct translation of accessibilityRoles to other languages and specifying error text for specific components.

Join us in tackling the rest. There are still open accessibility issues on the Improved React Native Accessibility project board. Issues with Checked/Unchecked State, Entrance/exit from Collection, and Position in Collection are great opportunities for current and new contributors to contribute to a more accessible React Native.

Learn More​

Read about how the gap analysis was conducted on the Facebook Tech blog or about the launch of the GitHub issues on the React Native Blog.