accessibilityTraits + accessibilityComponentType >> accessibilityRole…

… + accessibilityStates 1/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 wrote a script that focuses on replacing instances of the two properties that only added a single role to `accessibilityTraits` and `accessibilityComponentType`. In summary, this script:
* replaces instances of `accessibilityTraits = "<iOStrait>"` with `accessibilityRole = "<iOStrait>"`
* replaces instances of `accessibilityTraits = {['<iOStrait>']}` with `accessibilityRole = "<iOStrait>"`
* replaces instances of `accessibilityTraits = {"<iOStrait>"}` with `accessibilityRole = "<iOStrait>"`
* removes instances of `accessibilityComponentType`

```

The following is the codeshift script I wrote:
/**
 * Copyright (c) 2015-present, Facebook, Inc.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 *
 * format
 */

'use strict';

export default function transformer(file, api) {
  const j = api.jscodeshift;
  const root = j(file.source);

  let hasChanges = false;
  const elements = root.find(j.JSXElement);
  let values;
  let valuess;
  let valuesss;
  elements.forEach(path => {
    const openEl = path.node.openingElement;
    hasChanges = true;
    for (let i = 0; i < openEl.attributes.length; i++) {
		if (openEl.attributes[i].name.name === 'accessibilityComponentType') {
        	openEl.attributes.splice(i, 1);
        }
      if (openEl.attributes[i].name.name === 'accessibilityTraits') {
        if (openEl.attributes[i].value.expression) {
          if (openEl.attributes[i].value.expression.type === 'Literal') {
            values = openEl.attributes[i].value.expression.value;
            openEl.attributes[i] = j.jsxAttribute(
              j.jsxIdentifier('accessibilityRole'),
              j.literal(values),
            );
          }
        }

        if (openEl.attributes[i].value) {
          if (
            openEl.attributes[i].value &&
            openEl.attributes[i].value.type === 'Literal'
          ) {
            valuess = openEl.attributes[i].value.value;
            openEl.attributes[i] = j.jsxAttribute(
              j.jsxIdentifier('accessibilityRole'),
              j.literal(valuess),
            );
          }
        }

        if (openEl.attributes[i].value.expression) {
          if (
            openEl.attributes[i].value.expression.type === 'ArrayExpression' &&
            openEl.attributes[i].value.expression.elements.length === 1
          ) {
            valuesss = openEl.attributes[i].value.expression.elements[0].value;
            openEl.attributes[i] = j.jsxAttribute(
              j.jsxIdentifier('accessibilityRole'),
              j.literal(valuesss),
            );
          }
        }
      }
    }
  });
  if (hasChanges) {
    return root.toSource();
  } else {
    return null;
  }
}
```
I then used this command to run the codemod:

```
./scripts/js1/node_modules/.bin/jscodeshift -c 10 --parser=flow --transform ./scripts/js1/commands/codeshift/add-accessibilityRoles/index.js /data/sandcastle/boxes/instance-ide/xplat/js/RKJSModules/Apps
hg status -n | xargs /data/sandcastle/boxes/instance-ide/tools/third-party/prettier/node_modules/.bin/prettier --single-quote --no-bracket-spacing --jsx-bracket-same-line --trailing-comma all --parser flow --write --require-pragma --no-config
hg status -n | xargs ./scripts/eslint/eslint --plugin lint --no-eslintrc --parser babel-eslint --rule "lint/sort-requires: 1" --fix
js1 build buckfiles
```

Lastly, I had to add a few manual fixes:
* Checked that instances of `accessibilityComponentType` that were deleted were indeed replaced with `accessibilityRole`
* Added props  `accessibilityRole` and `accessibilityStates` to `TouchableWithoutFeedBack` components and `TextProps` because they don't inherit properties directly from view.

Reviewed By: PeteTheHeat

Differential Revision: D8937323

fbshipit-source-id: 85bf4d596e8e7c7ace75ab0b0e68599043760840

Libraries/Components/Touchable/TouchableWithoutFeedback.js

@@ -22,13 +22,17 @@ const warning = require('fbjs/lib/warning');
 
 const {
   AccessibilityComponentTypes,
+  AccessibilityRoles,
+  AccessibilityStates,
   AccessibilityTraits,
 } = require('ViewAccessibility');
 
 import type {PressEvent} from 'CoreEventTypes';
 import type {EdgeInsetsProp} from 'EdgeInsetsPropType';
 import type {
   AccessibilityComponentType,
+  AccessibilityRole,
+  AccessibilityState,
   AccessibilityTraits as AccessibilityTraitsFlow,
 } from 'ViewAccessibility';
 
@@ -44,6 +48,8 @@ export type Props = $ReadOnly<{|
     | Array<any>
     | any,
   accessibilityHint?: string,
+  accessibilityRole?: ?AccessibilityRole,
+  accessibilityStates?: ?Array<AccessibilityState>,
   accessibilityTraits?: ?AccessibilityTraitsFlow,
   children?: ?React.Node,
   delayLongPress?: ?number,
@@ -78,6 +84,10 @@ const TouchableWithoutFeedback = ((createReactClass({
     accessibilityLabel: PropTypes.node,
     accessibilityHint: PropTypes.string,
     accessibilityComponentType: PropTypes.oneOf(AccessibilityComponentTypes),
+    accessibilityRole: PropTypes.oneOf(AccessibilityRoles),
+    accessibilityStates: PropTypes.arrayOf(
+      PropTypes.oneOf(AccessibilityStates),
+    ),
     accessibilityTraits: PropTypes.oneOfType([
       PropTypes.oneOf(AccessibilityTraits),
       PropTypes.arrayOf(PropTypes.oneOf(AccessibilityTraits)),

Libraries/Text/TextProps.js

@@ -10,6 +10,8 @@
 
 'use strict';
 
+import type {AccessibilityRole} from 'ViewAccessibility';
+import type {AccessibilityState} from 'ViewAccessibility';
 import type {AccessibilityTrait} from 'ViewAccessibility';
 
 import type {Node} from 'react';
@@ -29,6 +31,8 @@ export type PressRetentionOffset = $ReadOnly<{|
  */
 export type TextProps = $ReadOnly<{
   accessible?: ?boolean,
+  accessibilityRole?: AccessibilityRole,
+  accessibilityStates?: Array<AccessibilityState>,
   accessibilityTraits?: AccessibilityTrait | Array<AccessibilityTrait>,
   allowFontScaling?: ?boolean,
   children?: Node,