react-navigation/react-navigation

Screen readers focus position resets when going back

Open

#11,189 opened on 2023年2月3日

GitHub で見る
 (11 comments) (1 reaction) (0 assignees)TypeScript (23,189 stars) (4,962 forks)batch import
bughelp wantedplatform:androidplatform:iosrepro provided

説明

Current behavior

I am currently working on the accessibility of an application for visually impaired people and I am having a focus problem with screen readers (VoiceOver and TalkBack).

When a user activates an interactive element (Button, TouchableOpacity, ...) to navigate to another screen and then decides to return to the previous screen, the screen reader's focus is reset to the first element.

Below is an example of what happens:

https://user-images.githubusercontent.com/7073407/216574419-a83f9e9e-3401-4b87-a299-a827948172ef.mp4

Expected behavior

Normally when a user returns to the previous screen the focus should be on the last item they interacted with.

Imagine the pain these users experience when they open an item in a FlatList. They have to go through everything again.

Reproduction

Must be tested on a physical device. Activate VoiceOver or TalkBack in your smartphone settings, then activate the "Open target" button on the HomeScreen, you will now be on TargetScreen, then return to the previous screen by activating the back button. The focus will be reset to the first element of the HomeScreen.

https://snack.expo.dev/@foohx/reset-sr-focus-when-going-back

Platform

  • Android
  • iOS
  • Web
  • Windows
  • MacOS

Packages

  • @react-navigation/bottom-tabs
  • @react-navigation/drawer
  • @react-navigation/material-bottom-tabs
  • @react-navigation/material-top-tabs
  • @react-navigation/stack
  • @react-navigation/native-stack
  • react-native-tab-view
  • flipper-plugin-react-navigation

Environment

I've removed the packages that I don't use

package version
@react-navigation/native 6.1.3
@react-navigation/bottom-tabs 6.5.4
@react-navigation/native-stack 6.9.8
react-native-safe-area-context 4.4.1
react-native-screens 3.18.0
expo 47.0.0

コントリビューターガイド

技術スタック
typescriptreactreact native
領域
accessibilitymobile
Issue 種別
bug
難度新しい貢献者にとっての実装難度です。1 は非常に小さな変更、5 は専門的な作業です。
3
推定時間経験ある貢献者が調査、実装、テスト、pull request 準備にかけるおおよその時間範囲です。
1-2 days
活動状況Issue が今どれだけ取り組みやすいかを示します。新しい、活発、古い、ブロック中、またはメンテナー入力待ちなどです。
active
明確さ期待される変更、受け入れ条件、次の手順がどれだけ明確かを示します。
clear
前提条件
React Native developmentaccessibility testing with screen readersunderstanding of navigation lifecycle
初心者向け度初回貢献者にどれだけ取り組みやすいかを 1-100 で推定したスコアです。
60
調査方針
Investigate how @react navigation/native stack handles focus restoration when navigating back. The issue includes a Snack demo (snack.expo.dev/@foohx/reset sr focus when going back) that reproduces the problem. Check the native stack implementation for any focus management logic, particularly in the transition handler. Also review existing comments for potential solutions or workarounds. No linked PRs exist yet.
Screen readers focus position resets when going back · react-navigation/react-navigation#11189 | Good First Issue