react / react/react-native

Accessibility state treated incorrectly on iOS

Offen
#45,300 4 Kommentare 0 Reaktionen 2 zugewiesene Personen Auf GitHub ansehen

@blakef arbeitet bereits daran.

Seit 12.7.2024.

Accessibility Help Wanted :octocat: Issue: Author Provided Repro Platform: iOS
Vorherrschende Sprache
C++
Sterne
127k
Forks
25.3k
Ø Merge
1 T. 23 Std.
Gemergte PRs (30 T.)
4

Beschreibung

Description

I'm seeing two strange behaviours around the disabled property and accessibilitState.disabled on iOS:

  • Setting disabled={true} on a TouchableOpacity leads to Voiceover reading the label of the touchable opacity followed by "link"
    • Even if you set role="button" and accessibilityRole="button", VoiceOver will still read out " link button"
    • In the example I've included you can see once you bump the counter up and the minus button is no longer disabled, it stops getting read out as a link
  • Whatever is set for accessibilityState.disabled is never read out. Other properties, like accessibilityState.selected are still read out

Both of these issues happen on iOS (I'm including a snack, my iOS version is 17.5.1 - I've not tested this on other iOS versions), but TalkBack correctly reads out the button role and accessibilityState.

Steps to reproduce
  1. Create a and assign it a button role and accessibilityRole
  2. Set disabled={true} on it and accessibilityState={{disabled: true}}
  3. Turn on VoiceOver and focus on the TouchableOpacity

Expected behaviour

  • The TouchableOpacity's is read out as " button disabled"

Actual behaviour

  • The TouchableOpacity is read out as " link button"
    • "disabled" is never read out
    • Removing disabled={true} leads to the component no longer being read out as a link
React Native Version

0.74.0

Affected Platforms

Runtime - iOS

Output of npx react-native info
Not applicable as developing directly in Expo Snack
Stacktrace or Logs
Not applicable as developing directly in Expo Snack
Reproducer

https://snack.expo.dev/_f-0w64MnvIqQ65myDxPW

Screenshots and Videos

No response

Beitragsleitfaden

Beitragsleitfaden öffnen

Erste Schritte

  1. Lies das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreib ins Issue, dass du es übernimmst — das erspart doppelte Arbeit.
  3. Forke das Repository und arbeite in einem Branch.
  4. Öffne einen Pull Request, der die Issue-Nummer nennt.

Bewertung

Dieses Issue wurde noch nicht bewertet.

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.