fix: touchable-ripple-toggling-disable-prop (#1226)

pan-pawel · ferrannp · commit 16e356971403 · 2019-07-19T12:14:12.000+02:00
diff --git a/src/components/Button.tsx b/src/components/Button.tsx
@@ -245,7 +245,7 @@ class Button extends React.Component<Props, State> {
           accessibilityTraits={disabled ? ['button', 'disabled'] : 'button'}
           accessibilityComponentType="button"
           accessibilityRole="button"
-          accessibilityStates={disabled ? ['disabled'] : undefined}
+          accessibilityStates={disabled ? ['disabled'] : []}
           disabled={disabled}
           rippleColor={rippleColor}
           style={touchableStyle}
diff --git a/src/components/CheckboxAndroid.tsx b/src/components/CheckboxAndroid.tsx
@@ -126,7 +126,7 @@ class CheckboxAndroid extends React.Component<Props, State> {
         accessibilityTraits={disabled ? ['button', 'disabled'] : 'button'}
         accessibilityComponentType="button"
         accessibilityRole="button"
-        accessibilityStates={disabled ? ['disabled'] : undefined}
+        accessibilityStates={disabled ? ['disabled'] : []}
         accessibilityLiveRegion="polite"
         style={styles.container}
       >
diff --git a/src/components/CheckboxIOS.tsx b/src/components/CheckboxIOS.tsx
@@ -82,7 +82,7 @@ class CheckboxIOS extends React.Component<Props> {
         accessibilityTraits={disabled ? ['button', 'disabled'] : 'button'}
         accessibilityComponentType="button"
         accessibilityRole="button"
-        accessibilityStates={disabled ? ['disabled'] : undefined}
+        accessibilityStates={disabled ? ['disabled'] : []}
         accessibilityLiveRegion="polite"
         style={styles.container}
       >
diff --git a/src/components/Drawer/DrawerItem.tsx b/src/components/Drawer/DrawerItem.tsx
@@ -84,7 +84,7 @@ class DrawerItem extends React.Component<Props> {
           accessibilityTraits={active ? ['button', 'selected'] : 'button'}
           accessibilityComponentType="button"
           accessibilityRole="button"
-          accessibilityStates={active ? ['selected'] : undefined}
+          accessibilityStates={active ? ['selected'] : []}
         >
           <View style={styles.wrapper}>
             {icon ? (
diff --git a/src/components/FAB/FAB.tsx b/src/components/FAB/FAB.tsx
@@ -204,7 +204,7 @@ class FAB extends React.Component<Props, State> {
           accessibilityTraits={disabled ? ['button', 'disabled'] : 'button'}
           accessibilityComponentType="button"
           accessibilityRole="button"
-          accessibilityStates={disabled ? ['disabled'] : undefined}
+          accessibilityStates={disabled ? ['disabled'] : []}
           style={styles.touchable}
         >
           <View
diff --git a/src/components/IconButton.tsx b/src/components/IconButton.tsx
@@ -119,7 +119,7 @@ const IconButton = ({
       accessibilityTraits={disabled ? ['button', 'disabled'] : 'button'}
       accessibilityComponentType="button"
       accessibilityRole="button"
-      accessibilityStates={disabled ? ['disabled'] : undefined}
+      accessibilityStates={disabled ? ['disabled'] : []}
       disabled={disabled}
       hitSlop={
         // @ts-ignore - this should be fixed in react-theme-providersince withTheme() is not forwarding static property types
diff --git a/src/components/RadioButtonAndroid.tsx b/src/components/RadioButtonAndroid.tsx
@@ -133,7 +133,7 @@ class RadioButtonAndroid extends React.Component<Props, State> {
           checked ? 'radiobutton_checked' : 'radiobutton_unchecked'
         }
         accessibilityRole="button"
-        accessibilityStates={disabled ? ['disabled'] : undefined}
+        accessibilityStates={disabled ? ['disabled'] : []}
         accessibilityLiveRegion="polite"
         style={styles.container}
       >
diff --git a/src/components/RadioButtonIOS.tsx b/src/components/RadioButtonIOS.tsx
@@ -90,7 +90,7 @@ class RadioButtonIOS extends React.Component<Props> {
           checked ? 'radiobutton_checked' : 'radiobutton_unchecked'
         }
         accessibilityRole="button"
-        accessibilityStates={disabled ? ['disabled'] : undefined}
+        accessibilityStates={disabled ? ['disabled'] : []}
         accessibilityLiveRegion="polite"
         style={styles.container}
       >
diff --git a/src/components/__tests__/Appbar/__snapshots__/Appbar.test.js.snap b/src/components/__tests__/Appbar/__snapshots__/Appbar.test.js.snap
@@ -40,6 +40,7 @@ exports[`Appbar does not pass any additional props to Searchbar 1`] = `
   >
     <View
       accessibilityRole="button"
+      accessibilityStates={Array []}
       accessible={true}
       hitSlop={
         Object {
diff --git a/src/components/__tests__/__snapshots__/Banner.test.js.snap b/src/components/__tests__/__snapshots__/Banner.test.js.snap
@@ -214,6 +214,7 @@ exports[`renders visible banner, with action buttons and with image 1`] = `
         >
           <View
             accessibilityRole="button"
+            accessibilityStates={Array []}
             accessible={true}
             isTVSelectable={true}
             onResponderGrant={[Function]}
@@ -386,6 +387,7 @@ exports[`renders visible banner, with action buttons and without image 1`] = `
         >
           <View
             accessibilityRole="button"
+            accessibilityStates={Array []}
             accessible={true}
             isTVSelectable={true}
             onResponderGrant={[Function]}
@@ -472,6 +474,7 @@ exports[`renders visible banner, with action buttons and without image 1`] = `
         >
           <View
             accessibilityRole="button"
+            accessibilityStates={Array []}
             accessible={true}
             isTVSelectable={true}
             onResponderGrant={[Function]}
diff --git a/src/components/__tests__/__snapshots__/Button.test.js.snap b/src/components/__tests__/__snapshots__/Button.test.js.snap
@@ -16,6 +16,7 @@ exports[`renders button with color 1`] = `
 >
   <View
     accessibilityRole="button"
+    accessibilityStates={Array []}
     accessible={true}
     isTVSelectable={true}
     onResponderGrant={[Function]}
@@ -102,6 +103,7 @@ exports[`renders button with icon 1`] = `
 >
   <View
     accessibilityRole="button"
+    accessibilityStates={Array []}
     accessible={true}
     isTVSelectable={true}
     onResponderGrant={[Function]}
@@ -239,6 +241,7 @@ exports[`renders contained contained with mode 1`] = `
 >
   <View
     accessibilityRole="button"
+    accessibilityStates={Array []}
     accessible={true}
     isTVSelectable={true}
     onResponderGrant={[Function]}
@@ -416,6 +419,7 @@ exports[`renders loading button 1`] = `
 >
   <View
     accessibilityRole="button"
+    accessibilityStates={Array []}
     accessible={true}
     isTVSelectable={true}
     onResponderGrant={[Function]}
@@ -685,6 +689,7 @@ exports[`renders outlined button with mode 1`] = `
 >
   <View
     accessibilityRole="button"
+    accessibilityStates={Array []}
     accessible={true}
     isTVSelectable={true}
     onResponderGrant={[Function]}
@@ -771,6 +776,7 @@ exports[`renders text button by default 1`] = `
 >
   <View
     accessibilityRole="button"
+    accessibilityStates={Array []}
     accessible={true}
     isTVSelectable={true}
     onResponderGrant={[Function]}
@@ -857,6 +863,7 @@ exports[`renders text button with mode 1`] = `
 >
   <View
     accessibilityRole="button"
+    accessibilityStates={Array []}
     accessible={true}
     isTVSelectable={true}
     onResponderGrant={[Function]}
diff --git a/src/components/__tests__/__snapshots__/Checkbox.test.js.snap b/src/components/__tests__/__snapshots__/Checkbox.test.js.snap
@@ -3,6 +3,7 @@
 exports[`renders checked Checkbox with color 1`] = `
 <View
   accessibilityRole="button"
+  accessibilityStates={Array []}
   accessible={true}
   isTVSelectable={true}
   onResponderGrant={[Function]}
@@ -71,6 +72,7 @@ exports[`renders checked Checkbox with color 1`] = `
 exports[`renders checked Checkbox with onPress 1`] = `
 <View
   accessibilityRole="button"
+  accessibilityStates={Array []}
   accessible={true}
   isTVSelectable={true}
   onResponderGrant={[Function]}
@@ -139,6 +141,7 @@ exports[`renders checked Checkbox with onPress 1`] = `
 exports[`renders indeterminate Checkbox 1`] = `
 <View
   accessibilityRole="button"
+  accessibilityStates={Array []}
   accessible={true}
   isTVSelectable={true}
   onResponderGrant={[Function]}
@@ -207,6 +210,7 @@ exports[`renders indeterminate Checkbox 1`] = `
 exports[`renders indeterminate Checkbox with color 1`] = `
 <View
   accessibilityRole="button"
+  accessibilityStates={Array []}
   accessible={true}
   isTVSelectable={true}
   onResponderGrant={[Function]}
@@ -275,6 +279,7 @@ exports[`renders indeterminate Checkbox with color 1`] = `
 exports[`renders unchecked Checkbox with color 1`] = `
 <View
   accessibilityRole="button"
+  accessibilityStates={Array []}
   accessible={true}
   isTVSelectable={true}
   onResponderGrant={[Function]}
@@ -343,6 +348,7 @@ exports[`renders unchecked Checkbox with color 1`] = `
 exports[`renders unchecked Checkbox with onPress 1`] = `
 <View
   accessibilityRole="button"
+  accessibilityStates={Array []}
   accessible={true}
   isTVSelectable={true}
   onResponderGrant={[Function]}
diff --git a/src/components/__tests__/__snapshots__/DataTable.test.js.snap b/src/components/__tests__/__snapshots__/DataTable.test.js.snap
@@ -204,6 +204,7 @@ exports[`renders data table pagination 1`] = `
   />
   <View
     accessibilityRole="button"
+    accessibilityStates={Array []}
     accessible={true}
     hitSlop={
       Object {
@@ -284,6 +285,7 @@ exports[`renders data table pagination 1`] = `
   </View>
   <View
     accessibilityRole="button"
+    accessibilityStates={Array []}
     accessible={true}
     hitSlop={
       Object {
@@ -406,6 +408,7 @@ exports[`renders data table pagination with label 1`] = `
   </Text>
   <View
     accessibilityRole="button"
+    accessibilityStates={Array []}
     accessible={true}
     hitSlop={
       Object {
@@ -486,6 +489,7 @@ exports[`renders data table pagination with label 1`] = `
   </View>
   <View
     accessibilityRole="button"
+    accessibilityStates={Array []}
     accessible={true}
     hitSlop={
       Object {
diff --git a/src/components/__tests__/__snapshots__/DrawerItem.test.js.snap b/src/components/__tests__/__snapshots__/DrawerItem.test.js.snap
@@ -18,6 +18,7 @@ exports[`renders DrawerItem with icon 1`] = `
 >
   <View
     accessibilityRole="button"
+    accessibilityStates={Array []}
     accessible={true}
     isTVSelectable={true}
     onResponderGrant={[Function]}
@@ -247,6 +248,7 @@ exports[`renders basic DrawerItem 1`] = `
 >
   <View
     accessibilityRole="button"
+    accessibilityStates={Array []}
     accessible={true}
     isTVSelectable={true}
     onResponderGrant={[Function]}
diff --git a/src/components/__tests__/__snapshots__/FAB.test.js.snap b/src/components/__tests__/__snapshots__/FAB.test.js.snap
@@ -27,6 +27,7 @@ exports[`renders extended FAB 1`] = `
   <View
     accessibilityLabel="Add items"
     accessibilityRole="button"
+    accessibilityStates={Array []}
     accessible={true}
     isTVSelectable={true}
     onResponderGrant={[Function]}
@@ -185,6 +186,7 @@ exports[`renders normal FAB 1`] = `
 >
   <View
     accessibilityRole="button"
+    accessibilityStates={Array []}
     accessible={true}
     isTVSelectable={true}
     onResponderGrant={[Function]}
@@ -318,6 +320,7 @@ exports[`renders small FAB 1`] = `
 >
   <View
     accessibilityRole="button"
+    accessibilityStates={Array []}
     accessible={true}
     isTVSelectable={true}
     onResponderGrant={[Function]}
diff --git a/src/components/__tests__/__snapshots__/IconButton.test.js.snap b/src/components/__tests__/__snapshots__/IconButton.test.js.snap
@@ -93,6 +93,7 @@ exports[`renders disabled icon button 1`] = `
 exports[`renders icon button by default 1`] = `
 <View
   accessibilityRole="button"
+  accessibilityStates={Array []}
   accessible={true}
   hitSlop={
     Object {
@@ -176,6 +177,7 @@ exports[`renders icon button by default 1`] = `
 exports[`renders icon button with color 1`] = `
 <View
   accessibilityRole="button"
+  accessibilityStates={Array []}
   accessible={true}
   hitSlop={
     Object {
@@ -259,6 +261,7 @@ exports[`renders icon button with color 1`] = `
 exports[`renders icon button with size 1`] = `
 <View
   accessibilityRole="button"
+  accessibilityStates={Array []}
   accessible={true}
   hitSlop={
     Object {
@@ -342,6 +345,7 @@ exports[`renders icon button with size 1`] = `
 exports[`renders icon change animated 1`] = `
 <View
   accessibilityRole="button"
+  accessibilityStates={Array []}
   accessible={true}
   hitSlop={
     Object {
diff --git a/src/components/__tests__/__snapshots__/Menu.test.js.snap b/src/components/__tests__/__snapshots__/Menu.test.js.snap
@@ -109,6 +109,7 @@ exports[`renders not visible menu 1`] = `
   >
     <View
       accessibilityRole="button"
+      accessibilityStates={Array []}
       accessible={true}
       isTVSelectable={true}
       onResponderGrant={[Function]}
@@ -199,6 +200,7 @@ exports[`renders visible menu 1`] = `
   >
     <View
       accessibilityRole="button"
+      accessibilityStates={Array []}
       accessible={true}
       isTVSelectable={true}
       onResponderGrant={[Function]}
diff --git a/src/components/__tests__/__snapshots__/RadioButton.test.js.snap b/src/components/__tests__/__snapshots__/RadioButton.test.js.snap
@@ -3,6 +3,7 @@
 exports[`RadioButton on default platform renders properly 1`] = `
 <View
   accessibilityRole="button"
+  accessibilityStates={Array []}
   accessible={true}
   isTVSelectable={true}
   onResponderGrant={[Function]}
@@ -40,6 +41,7 @@ exports[`RadioButton on default platform renders properly 1`] = `
 exports[`RadioButton on ios platform renders properly 1`] = `
 <View
   accessibilityRole="button"
+  accessibilityStates={Array []}
   accessible={true}
   isTVSelectable={true}
   onResponderGrant={[Function]}
@@ -108,6 +110,7 @@ exports[`RadioButton on ios platform renders properly 1`] = `
 exports[`RadioButton when RadioButton is wrapped by RadioButtonContext.Provider renders properly 1`] = `
 <View
   accessibilityRole="button"
+  accessibilityStates={Array []}
   accessible={true}
   isTVSelectable={true}
   onResponderGrant={[Function]}
diff --git a/src/components/__tests__/__snapshots__/Searchbar.test.js.snap b/src/components/__tests__/__snapshots__/Searchbar.test.js.snap
@@ -21,6 +21,7 @@ exports[`renders with placeholder 1`] = `
 >
   <View
     accessibilityRole="button"
+    accessibilityStates={Array []}
     accessible={true}
     hitSlop={
       Object {
@@ -240,6 +241,7 @@ exports[`renders with text 1`] = `
 >
   <View
     accessibilityRole="button"
+    accessibilityStates={Array []}
     accessible={true}
     hitSlop={
       Object {
@@ -351,6 +353,7 @@ exports[`renders with text 1`] = `
   />
   <View
     accessibilityRole="button"
+    accessibilityStates={Array []}
     accessible={true}
     hitSlop={
       Object {
diff --git a/src/components/__tests__/__snapshots__/Snackbar.test.js.snap b/src/components/__tests__/__snapshots__/Snackbar.test.js.snap
@@ -159,6 +159,7 @@ exports[`renders snackbar with action button 1`] = `
     >
       <View
         accessibilityRole="button"
+        accessibilityStates={Array []}
         accessible={true}
         isTVSelectable={true}
         onResponderGrant={[Function]}
diff --git a/src/components/__tests__/__snapshots__/ToggleButton.test.js.snap b/src/components/__tests__/__snapshots__/ToggleButton.test.js.snap
@@ -103,6 +103,7 @@ exports[`renders disabled toggle button 1`] = `
 exports[`renders toggle button 1`] = `
 <View
   accessibilityRole="button"
+  accessibilityStates={Array []}
   accessible={true}
   hitSlop={
     Object {

Original file line number	Diff line number	Diff line change
`@@ -126,7 +126,7 @@ class CheckboxAndroid extends React.Component<Props, State> {`
`126`	`126`	`accessibilityTraits={disabled ? ['button', 'disabled'] : 'button'}`
`127`	`127`	`accessibilityComponentType="button"`
`128`	`128`	`accessibilityRole="button"`
`129`		`- accessibilityStates={disabled ? ['disabled'] : undefined}`
	`129`	`+ accessibilityStates={disabled ? ['disabled'] : []}`
`130`	`130`	`accessibilityLiveRegion="polite"`
`131`	`131`	`style={styles.container}`
`132`	`132`	`>`
Original file line number	Diff line number	Diff line change
`@@ -82,7 +82,7 @@ class CheckboxIOS extends React.Component<Props> {`
`82`	`82`	`accessibilityTraits={disabled ? ['button', 'disabled'] : 'button'}`
`83`	`83`	`accessibilityComponentType="button"`
`84`	`84`	`accessibilityRole="button"`
`85`		`- accessibilityStates={disabled ? ['disabled'] : undefined}`
	`85`	`+ accessibilityStates={disabled ? ['disabled'] : []}`
`86`	`86`	`accessibilityLiveRegion="polite"`
`87`	`87`	`style={styles.container}`
`88`	`88`	`>`
Original file line number	Diff line number	Diff line change
`@@ -84,7 +84,7 @@ class DrawerItem extends React.Component<Props> {`
`84`	`84`	`accessibilityTraits={active ? ['button', 'selected'] : 'button'}`
`85`	`85`	`accessibilityComponentType="button"`
`86`	`86`	`accessibilityRole="button"`
`87`		`- accessibilityStates={active ? ['selected'] : undefined}`
	`87`	`+ accessibilityStates={active ? ['selected'] : []}`
`88`	`88`	`>`
`89`	`89`	`<View style={styles.wrapper}>`
`90`	`90`	`{icon ? (`
Original file line number	Diff line number	Diff line change
`@@ -204,7 +204,7 @@ class FAB extends React.Component<Props, State> {`
`204`	`204`	`accessibilityTraits={disabled ? ['button', 'disabled'] : 'button'}`
`205`	`205`	`accessibilityComponentType="button"`
`206`	`206`	`accessibilityRole="button"`
`207`		`- accessibilityStates={disabled ? ['disabled'] : undefined}`
	`207`	`+ accessibilityStates={disabled ? ['disabled'] : []}`
`208`	`208`	`style={styles.touchable}`
`209`	`209`	`>`
`210`	`210`	`<View`
Original file line number	Diff line number	Diff line change
`@@ -133,7 +133,7 @@ class RadioButtonAndroid extends React.Component<Props, State> {`
`133`	`133`	`checked ? 'radiobutton_checked' : 'radiobutton_unchecked'`
`134`	`134`	`}`
`135`	`135`	`accessibilityRole="button"`
`136`		`- accessibilityStates={disabled ? ['disabled'] : undefined}`
	`136`	`+ accessibilityStates={disabled ? ['disabled'] : []}`
`137`	`137`	`accessibilityLiveRegion="polite"`
`138`	`138`	`style={styles.container}`
`139`	`139`	`>`
Original file line number	Diff line number	Diff line change
`@@ -90,7 +90,7 @@ class RadioButtonIOS extends React.Component<Props> {`
`90`	`90`	`checked ? 'radiobutton_checked' : 'radiobutton_unchecked'`
`91`	`91`	`}`
`92`	`92`	`accessibilityRole="button"`
`93`		`- accessibilityStates={disabled ? ['disabled'] : undefined}`
	`93`	`+ accessibilityStates={disabled ? ['disabled'] : []}`
`94`	`94`	`accessibilityLiveRegion="polite"`
`95`	`95`	`style={styles.container}`
`96`	`96`	`>`
Original file line number	Diff line number	Diff line change
@@ -40,6 +40,7 @@ exports[`Appbar does not pass any additional props to Searchbar 1`] = `
`40`	`40`	`>`
`41`	`41`	`<View`
`42`	`42`	`accessibilityRole="button"`
	`43`	`+ accessibilityStates={Array []}`
`43`	`44`	`accessible={true}`
`44`	`45`	`hitSlop={`
`45`	`46`	`Object {`