question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Clickable property requires "button" to be set as accessibilityRole

See original GitHub issue

Description

When a component has an onPress property, it should be clickable by TalkBack even if it is not set to be a button. This was discovered here.

This may require native changes on Android. It may also require an API change. From this comment, it is common on iOS for anything clickable to be called a “button” according to accessibility. This is not true on Android, when only things that look and feel like buttons should be labeled a button.

React Native version:

0.63

Steps To Reproduce

<Text onPress={() => {console.log("hello!")}} />
<Text accessibilityRole="button" onPress={() => {console.log("hello!")}} />

NOTE: More triage is needed to verify what happens on Android/iOS with these two cases.

Expected Results

Desired behavior on Android - Text node is clickable even if accessibilityRole is not “button” Desired behavior on iOS - ?

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:6 (2 by maintainers)

github_iconTop GitHub Comments

2reactions
chrisgleincommented, Feb 23, 2021

This may require native changes on Android. It may also require an API change.

NOTE: More triage is needed to verify what happens on Android/iOS with these two cases.

There’s still some ambiguity here. I’m not sure what the right solution would be based on what you’ve said here. Can you do some background research and turn this into a more concrete proposal?

0reactions
github-actions[bot]commented, Feb 3, 2022

This issue was closed because it has been stalled for 7 days with no activity.

Read more comments on GitHub >

github_iconTop Results From Across the Web

ARIA: button role - Accessibility - MDN Web Docs
A menu button is a button that controls a menu and has an aria-haspopup property attribute set to either menu or true ....
Read more >
When to use accessibilityRole='link' in ReactNative?
I have an application with drawer navigation that uses buttons to navigate to different screens. In terms of accessibility, should ...
Read more >
Accessibility · React Native
To use, set the accessibilityRole property to one of the following strings: none Used when the element has no role. button Used when...
Read more >
Accessibility - React Native
To use, set the accessibilityLabel property to a custom string on your View, Text or Touchable: <TouchableOpacity accessible={true}
Read more >
Accessibility in React Native - Netguru
If we need to add an onPress property to an element that is not clickable by default, we can add the accessibilityRole property...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found