accessibilityTraits + accessibilityComponentType >> accessibilityRole + accessibilityStates 3/3

Summary:
Previously, I created two props, `accessibilityRole` and `accessibilityStates` for view. These props were intended to be a cross-platform solution to replace  `accessibilityComponentType` on Android and `accessibilityTraits` on iOS.

In this stack, I ran a code mod to replace instances of the two old properties used in our codebase with the new ones.
For this diff, I did a search for the few remaining uses of `accessibilityTraits` that was not caught by my script or the previous diff in the stack, and I manually changed them to `accessibilityRole` and `accessibilityStates`.

Changes in this diff generally followed this pattern:

Before:
```
function accessibilityTraits(props: Props): Array<string> {
  const traits = ['button'];
  if (props.selected) {
    traits.push('selected');
  }
  return traits;
}

  <AdsManagerTouchableHighlight
        accessibilityTraits={accessibilityTraits(this.props)}
```

After:
```
function accessibilityStates(props: Props): Array<AccessibilityState> {
  const states = [];
  if (!props.enabled) {
    states.push('disabled');
  }
  if (props.checked) {
    states.push('selected');
  }
  return states;
}

  <AdsManagerTouchableHighlight
        accessibilityRole="button"
        accessibilityStates={accessibilityStates(this.props)}
```

Reviewed By: PeteTheHeat

Differential Revision: D8944741

fbshipit-source-id: 4b309d9c858e7e831fbf971aca2f546df7a1431d
This commit is contained in:
Ziqi Chen 2018-07-26 13:44:57 -07:00 committed by Facebook Github Bot
parent 52a55fd8d1
commit 1bc52267f5

View File

@ -29,7 +29,10 @@ class AccessibilityIOSExample extends React.Component<{}> {
<View accessibilityLabel="Some announcement" accessible={true}>
<Text>Accessibility label example</Text>
</View>
<View accessibilityTraits={['button', 'selected']} accessible={true}>
<View
accessibilityRole="button"
accessibilityStates={['selected']}
accessible={true}>
<Text>Accessibility traits example</Text>
</View>
<Text>