satya164 / react-native-tab-view

A cross-platform Tab View component for React Native
MIT License
5.13k stars 1.07k forks source link

Invalid prop `accessibilityRole` of value `tab` supplied to `TouchableOpacity` #955

Closed emmarq closed 4 years ago

emmarq commented 4 years ago

Current behaviour

The use of TabBarItem is throwing:

Failed prop type: Invalid prop `accessibilityRole` of value `tab` supplied to `TouchableOpacity`, expected one of 
["none","button","link","search","image","keyboardkey","text","adjustable","imagebutton","header","summary"]

Expected behaviour

The correct display of the MaterialTopTabNavigator.

Code sample

https://github.com/react-native-community/react-native-tab-view/blob/c762699b01c34adcd80b4761e120ebe0573ba649/src/TabBarItem.tsx#L220

Screenshots (if applicable)

Screen Shot 2020-01-23 at 2 24 36 PM Screen Shot 2020-01-23 at 2 24 52 PM

What have you tried

I can't find a way to overwrite that prop.

Your Environment

software version
android 24
ios 13.3
react-native expo 35, react-native 0.59
react-navigation-tabs 2.6.2
react-native-gesture-handler 1.3.0
react-native-reanimated 1~.2.0
node 12.13.1
npm or yarn 6.12.1
emmarq commented 4 years ago

I hack this around installing the dependency directly at 2.11.0.

zeabdelkhalek commented 4 years ago

same issue

satya164 commented 4 years ago

Please upgrade your React Native version.

selvamariappant2s commented 4 years ago

I hack this around installing the dependency directly at 2.11.0.

save my day :)

ankushdec1993 commented 4 years ago

Also facing the same issue in RN 0.59.0.

ankushdec1993 commented 4 years ago

Is it possible to make it work without downgrading react-native-tab-view.

geraintwhite commented 4 years ago

@satya164 it would be useful to have React Native version compatibility information in the README.

satya164 commented 4 years ago

PR welcome to add it

MMelek00 commented 4 years ago

I hack this around installing the dependency directly at 2.11.0.

sorry what you mean by that?

emmarq commented 4 years ago

I hack this around installing the dependency directly at 2.11.0.

sorry what you mean by that?

Installing the dependency directly at 2.11.0 fixed my issue.

What I think was happening was that one of my dependencies has as a dependency on this library, but with a bad model version that was installing an incompatible code with my current setup. So that update should have been a major, or the dependency should have specified the correct model version. (By model version, I mean the ~, or ^, etc). I hope I made myself clear.

It is not the first time something crash in my projects because of one transitive update.

geraintwhite commented 4 years ago

@satya164 is there any way backwards compatibility for this prop can be added for RN < 0.60?

watsonnnnn commented 4 years ago

same issue. And 2.11.0 doesn't show anything~

bellodamilola commented 4 years ago

I hack this around installing the dependency directly at 2.11.0.

Thanks this worked for me :)

karthikvellur commented 4 years ago

which component should be 2.11.0 ?

roryabraham commented 4 years ago

Having this same issue with the following environment:

Also not sure which dependency should be 2.11.0 ... I've tried setting the following dependencies to 2.11.0, without success:

codeforcesmeme commented 4 years ago

@satya164 I think you can look into it? provide backward compatibility ? You're just breaking many projects

Magudeshwaran commented 4 years ago

I hack this around installing the dependency directly at 2.11.0. can you explain that ?

Magudeshwaran commented 4 years ago

I hack this around installing the dependency directly at 2.11.0.

sorry what you mean by that?

Installing the dependency directly at 2.11.0 fixed my issue.

What I think was happening was that one of my dependencies has as a dependency on this library, but with a bad model version that was installing an incompatible code with my current setup. So that update should have been a major, or the dependency should have specified the correct model version. (By model version, I mean the ~, or ^, etc). I hope I made myself clear.

It is not the first time something crash in my projects because of one transitive update.

Can you specify exactly what you updated ?

Magudeshwaran commented 4 years ago

Go to node_modules -> react-natie-tab-view -> lib -> module Change 'accessibilityRole' value to 'none' in 'TabBarItem.js' and 'TabBar.js'
Solved for me.

YobertyGarcia commented 4 years ago

Have the same issue, the only way it got solved was manually changing the lines described by Magudeshwaran on May 23,

the lines 156 on TabBarItem.js and 241 on TabBar.js

This is not the better solution but it works