From f70e58f3559b2f22c41ed867940dcfe170955548 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Estev=C3=A3o=20Lucas?= Date: Mon, 15 Apr 2019 10:42:02 -0700 Subject: [PATCH] - remove accessibilityComponentType and accessibilityTraits props (a11y) (#24344) Summary: Closes: https://github.com/facebook/react-native/issues/24016 React Native 0.57 introduced cross-platform `accessibilityRole` and `accessibilityStates` props in order to replace `accessibilityComponentType` (for android) and `accessibilityTraits` (for iOS). With #24095 `accessibilityRole` and `accessibilityStates` will increase, receiving more options, which seems to be a good moment to remove deprecated props. Remove deprecated `accessibilityComponentType` and `accessibilityTraits` props. [General] [Removed] - Remove accessibilityComponentType and accessibilityTraits props Pull Request resolved: https://github.com/facebook/react-native/pull/24344 Reviewed By: rickhanlonii Differential Revision: D14842214 Pulled By: cpojer fbshipit-source-id: 279945e503d8a23bfee7a49d42f5db490c5f6069 --- .../Touchable/TouchableWithoutFeedback.js | 20 +--- .../View/ReactNativeViewAttributes.js | 2 - .../Components/View/ViewAccessibility.js | 29 ----- Libraries/Components/View/ViewPropTypes.js | 32 +----- .../DeprecatedViewAccessibility.js | 25 ----- .../DeprecatedViewPropTypes.js | 29 ----- Libraries/Text/TextProps.js | 7 +- React/Views/RCTViewManager.m | 11 -- .../react/uimanager/AccessibilityHelper.java | 101 ------------------ .../react/uimanager/BaseViewManager.java | 6 -- .../uimanager/NativeViewHierarchyManager.java | 2 +- 11 files changed, 4 insertions(+), 260 deletions(-) delete mode 100644 ReactAndroid/src/main/java/com/facebook/react/uimanager/AccessibilityHelper.java diff --git a/Libraries/Components/Touchable/TouchableWithoutFeedback.js b/Libraries/Components/Touchable/TouchableWithoutFeedback.js index a78de287e41e77..33c64215679ad6 100755 --- a/Libraries/Components/Touchable/TouchableWithoutFeedback.js +++ b/Libraries/Components/Touchable/TouchableWithoutFeedback.js @@ -20,20 +20,13 @@ const createReactClass = require('create-react-class'); const ensurePositiveDelayProps = require('ensurePositiveDelayProps'); const { - DeprecatedAccessibilityComponentTypes, DeprecatedAccessibilityRoles, DeprecatedAccessibilityStates, - DeprecatedAccessibilityTraits, } = require('DeprecatedViewAccessibility'); import type {SyntheticEvent, LayoutEvent, PressEvent} from 'CoreEventTypes'; import type {EdgeInsetsProp} from 'EdgeInsetsPropType'; -import type { - AccessibilityComponentType, - AccessibilityRole, - AccessibilityStates, - AccessibilityTraits, -} from 'ViewAccessibility'; +import type {AccessibilityRole, AccessibilityStates} from 'ViewAccessibility'; type TargetEvent = SyntheticEvent< $ReadOnly<{| @@ -47,13 +40,11 @@ type FocusEvent = TargetEvent; const PRESS_RETENTION_OFFSET = {top: 20, left: 20, right: 20, bottom: 30}; const OVERRIDE_PROPS = [ - 'accessibilityComponentType', 'accessibilityLabel', 'accessibilityHint', 'accessibilityIgnoresInvertColors', 'accessibilityRole', 'accessibilityStates', - 'accessibilityTraits', 'hitSlop', 'nativeID', 'onBlur', @@ -64,13 +55,11 @@ const OVERRIDE_PROPS = [ export type Props = $ReadOnly<{| accessible?: ?boolean, - accessibilityComponentType?: ?AccessibilityComponentType, accessibilityLabel?: ?Stringish, accessibilityHint?: ?Stringish, accessibilityIgnoresInvertColors?: ?boolean, accessibilityRole?: ?AccessibilityRole, accessibilityStates?: ?AccessibilityStates, - accessibilityTraits?: ?AccessibilityTraits, children?: ?React.Node, delayLongPress?: ?number, delayPressIn?: ?number, @@ -105,18 +94,11 @@ const TouchableWithoutFeedback = ((createReactClass({ accessible: PropTypes.bool, accessibilityLabel: PropTypes.node, accessibilityHint: PropTypes.string, - accessibilityComponentType: PropTypes.oneOf( - DeprecatedAccessibilityComponentTypes, - ), accessibilityIgnoresInvertColors: PropTypes.bool, accessibilityRole: PropTypes.oneOf(DeprecatedAccessibilityRoles), accessibilityStates: PropTypes.arrayOf( PropTypes.oneOf(DeprecatedAccessibilityStates), ), - accessibilityTraits: PropTypes.oneOfType([ - PropTypes.oneOf(DeprecatedAccessibilityTraits), - PropTypes.arrayOf(PropTypes.oneOf(DeprecatedAccessibilityTraits)), - ]), /** * When `accessible` is true (which is the default) this may be called when * the OS-specific concept of "focus" occurs. Some platforms may not have diff --git a/Libraries/Components/View/ReactNativeViewAttributes.js b/Libraries/Components/View/ReactNativeViewAttributes.js index 3ab651c37778b3..59690b94045df5 100644 --- a/Libraries/Components/View/ReactNativeViewAttributes.js +++ b/Libraries/Components/View/ReactNativeViewAttributes.js @@ -19,11 +19,9 @@ ReactNativeViewAttributes.UIView = { accessible: true, accessibilityActions: true, accessibilityLabel: true, - accessibilityComponentType: true, accessibilityLiveRegion: true, accessibilityRole: true, accessibilityStates: true, - accessibilityTraits: true, accessibilityHint: true, importantForAccessibility: true, nativeID: true, diff --git a/Libraries/Components/View/ViewAccessibility.js b/Libraries/Components/View/ViewAccessibility.js index ed7eb4d68e50b8..42f85f827a7bdc 100644 --- a/Libraries/Components/View/ViewAccessibility.js +++ b/Libraries/Components/View/ViewAccessibility.js @@ -10,35 +10,6 @@ 'use strict'; -export type AccessibilityTrait = - | 'none' - | 'button' - | 'link' - | 'header' - | 'search' - | 'image' - | 'selected' - | 'plays' - | 'key' - | 'text' - | 'summary' - | 'disabled' - | 'frequentUpdates' - | 'startsMedia' - | 'adjustable' - | 'allowsDirectInteraction' - | 'pageTurn'; - -export type AccessibilityTraits = - | AccessibilityTrait - | $ReadOnlyArray; - -export type AccessibilityComponentType = - | 'none' - | 'button' - | 'radiobutton_checked' - | 'radiobutton_unchecked'; - // This must be kept in sync with the AccessibilityRolesMask in RCTViewManager.m export type AccessibilityRole = | 'none' diff --git a/Libraries/Components/View/ViewPropTypes.js b/Libraries/Components/View/ViewPropTypes.js index ed23042dacd71c..d7ddbdd20e61e3 100644 --- a/Libraries/Components/View/ViewPropTypes.js +++ b/Libraries/Components/View/ViewPropTypes.js @@ -15,12 +15,7 @@ import type {EdgeInsetsProp} from 'EdgeInsetsPropType'; import type React from 'React'; import type {ViewStyleProp} from 'StyleSheet'; import type {TVViewProps} from 'TVViewPropTypes'; -import type { - AccessibilityComponentType, - AccessibilityTrait, - AccessibilityRole, - AccessibilityStates, -} from 'ViewAccessibility'; +import type {AccessibilityRole, AccessibilityStates} from 'ViewAccessibility'; export type ViewLayout = Layout; export type ViewLayoutEvent = LayoutEvent; @@ -254,16 +249,6 @@ type AndroidViewProps = $ReadOnly<{| */ needsOffscreenAlphaCompositing?: ?boolean, - /** - * Indicates to accessibility services to treat UI component like a - * native one. Works for Android only. - * - * @platform android - * - * See http://facebook.github.io/react-native/docs/view.html#accessibilitycomponenttype - */ - accessibilityComponentType?: ?AccessibilityComponentType, - /** * Indicates to accessibility services whether the user should be notified * when this view changes. Works for Android API >= 19 only. @@ -336,21 +321,6 @@ type IOSViewProps = $ReadOnly<{| */ accessibilityIgnoresInvertColors?: ?boolean, - /** - * Provides additional traits to screen reader. By default no traits are - * provided unless specified otherwise in element. - * - * You can provide one trait or an array of many traits. - * - * @platform ios - * - * See http://facebook.github.io/react-native/docs/view.html#accessibilitytraits - */ - accessibilityTraits?: ?( - | AccessibilityTrait - | $ReadOnlyArray - ), - /** * A value indicating whether VoiceOver should ignore the elements * within views that are siblings of the receiver. diff --git a/Libraries/DeprecatedPropTypes/DeprecatedViewAccessibility.js b/Libraries/DeprecatedPropTypes/DeprecatedViewAccessibility.js index 890dd49f0f8672..5b5c8a8164757b 100644 --- a/Libraries/DeprecatedPropTypes/DeprecatedViewAccessibility.js +++ b/Libraries/DeprecatedPropTypes/DeprecatedViewAccessibility.js @@ -11,31 +11,6 @@ 'use strict'; module.exports = { - DeprecatedAccessibilityTraits: [ - 'none', - 'button', - 'link', - 'header', - 'search', - 'image', - 'selected', - 'plays', - 'key', - 'text', - 'summary', - 'disabled', - 'frequentUpdates', - 'startsMedia', - 'adjustable', - 'allowsDirectInteraction', - 'pageTurn', - ], - DeprecatedAccessibilityComponentTypes: [ - 'none', - 'button', - 'radiobutton_checked', - 'radiobutton_unchecked', - ], // This must be kept in sync with the AccessibilityRolesMask in RCTViewManager.m DeprecatedAccessibilityRoles: [ 'none', diff --git a/Libraries/DeprecatedPropTypes/DeprecatedViewPropTypes.js b/Libraries/DeprecatedPropTypes/DeprecatedViewPropTypes.js index 0d5b0746c4a3d8..34dec0784734c6 100644 --- a/Libraries/DeprecatedPropTypes/DeprecatedViewPropTypes.js +++ b/Libraries/DeprecatedPropTypes/DeprecatedViewPropTypes.js @@ -17,8 +17,6 @@ const DeprecatedStyleSheetPropType = require('DeprecatedStyleSheetPropType'); const DeprecatedViewStylePropTypes = require('DeprecatedViewStylePropTypes'); const { - DeprecatedAccessibilityComponentTypes, - DeprecatedAccessibilityTraits, DeprecatedAccessibilityRoles, DeprecatedAccessibilityStates, } = require('DeprecatedViewAccessibility'); @@ -69,18 +67,6 @@ module.exports = { */ accessibilityIgnoresInvertColors: PropTypes.bool, - /** - * Indicates to accessibility services to treat UI component like a - * native one. Works for Android only. - * - * @platform android - * - * See http://facebook.github.io/react-native/docs/view.html#accessibilitycomponenttype - */ - accessibilityComponentType: PropTypes.oneOf( - DeprecatedAccessibilityComponentTypes, - ), - /** * Indicates to accessibility services to treat UI component like a specific role. */ @@ -118,21 +104,6 @@ module.exports = { 'no-hide-descendants', ]), - /** - * Provides additional traits to screen reader. By default no traits are - * provided unless specified otherwise in element. - * - * You can provide one trait or an array of many traits. - * - * @platform ios - * - * See http://facebook.github.io/react-native/docs/view.html#accessibilitytraits - */ - accessibilityTraits: PropTypes.oneOfType([ - PropTypes.oneOf(DeprecatedAccessibilityTraits), - PropTypes.arrayOf(PropTypes.oneOf(DeprecatedAccessibilityTraits)), - ]), - /** * A value indicating whether VoiceOver should ignore the elements * within views that are siblings of the receiver. diff --git a/Libraries/Text/TextProps.js b/Libraries/Text/TextProps.js index bb56651a47836a..f7b5b67c465c4d 100644 --- a/Libraries/Text/TextProps.js +++ b/Libraries/Text/TextProps.js @@ -13,11 +13,7 @@ import type {LayoutEvent, PressEvent, TextLayoutEvent} from 'CoreEventTypes'; import type React from 'React'; import type {TextStyleProp} from 'StyleSheet'; -import type { - AccessibilityRole, - AccessibilityStates, - AccessibilityTrait, -} from 'ViewAccessibility'; +import type {AccessibilityRole, AccessibilityStates} from 'ViewAccessibility'; export type PressRetentionOffset = $ReadOnly<{| top: number, @@ -40,7 +36,6 @@ export type TextProps = $ReadOnly<{| accessibilityLabel?: ?Stringish, accessibilityRole?: ?AccessibilityRole, accessibilityStates?: ?AccessibilityStates, - accessibilityTraits?: ?(AccessibilityTrait | Array), /** * Whether font should be scaled down automatically. diff --git a/React/Views/RCTViewManager.m b/React/Views/RCTViewManager.m index ea84d99903e1b1..44d5fdf3d537a6 100644 --- a/React/Views/RCTViewManager.m +++ b/React/Views/RCTViewManager.m @@ -110,7 +110,6 @@ - (RCTShadowView *)shadowView RCT_REMAP_VIEW_PROPERTY(accessibilityActions, reactAccessibilityElement.accessibilityActions, NSArray) RCT_REMAP_VIEW_PROPERTY(accessibilityLabel, reactAccessibilityElement.accessibilityLabel, NSString) RCT_REMAP_VIEW_PROPERTY(accessibilityHint, reactAccessibilityElement.accessibilityHint, NSString) -RCT_REMAP_VIEW_PROPERTY(accessibilityTraits, reactAccessibilityElement.accessibilityTraits, UIAccessibilityTraits) RCT_REMAP_VIEW_PROPERTY(accessibilityViewIsModal, reactAccessibilityElement.accessibilityViewIsModal, BOOL) RCT_REMAP_VIEW_PROPERTY(accessibilityElementsHidden, reactAccessibilityElement.accessibilityElementsHidden, BOOL) RCT_REMAP_VIEW_PROPERTY(accessibilityIgnoresInvertColors, reactAccessibilityElement.shouldAccessibilityIgnoresInvertColors, BOOL) @@ -159,16 +158,6 @@ - (RCTShadowView *)shadowView view.reactAccessibilityElement.accessibilityTraits = (view.reactAccessibilityElement.accessibilityTraits & ~AccessibilityRolesMask) | maskedTraits; } -RCT_CUSTOM_VIEW_PROPERTY(accessibilityStates, UIAccessibilityTraits, RCTView) -{ - // This mask must be kept in sync with the AccessibilityStates enum defined in ViewAccessibility.js and DeprecatedViewAccessibility.js - const UIAccessibilityTraits AccessibilityStatesMask = UIAccessibilityTraitNotEnabled | UIAccessibilityTraitSelected; - - UIAccessibilityTraits newTraits = json ? [RCTConvert UIAccessibilityTraits:json] : defaultView.accessibilityTraits; - UIAccessibilityTraits maskedTraits = newTraits & AccessibilityStatesMask; - view.reactAccessibilityElement.accessibilityTraits = (view.reactAccessibilityElement.accessibilityTraits & ~AccessibilityStatesMask) | maskedTraits; -} - RCT_CUSTOM_VIEW_PROPERTY(nativeID, NSString *, RCTView) { view.nativeID = json ? [RCTConvert NSString:json] : defaultView.nativeID; diff --git a/ReactAndroid/src/main/java/com/facebook/react/uimanager/AccessibilityHelper.java b/ReactAndroid/src/main/java/com/facebook/react/uimanager/AccessibilityHelper.java deleted file mode 100644 index faa5a74c6c07e4..00000000000000 --- a/ReactAndroid/src/main/java/com/facebook/react/uimanager/AccessibilityHelper.java +++ /dev/null @@ -1,101 +0,0 @@ -/** - * Copyright (c) Facebook, Inc. and its affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -package com.facebook.react.uimanager; - -import android.view.View; -import android.view.accessibility.AccessibilityEvent; -import android.view.accessibility.AccessibilityNodeInfo; -import android.widget.Button; -import android.widget.RadioButton; - -/** - * Helper class containing logic for setting accessibility View properties. - */ -/* package */ class AccessibilityHelper { - - private static final String BUTTON = "button"; - private static final String RADIOBUTTON_CHECKED = "radiobutton_checked"; - private static final String RADIOBUTTON_UNCHECKED = "radiobutton_unchecked"; - - private static final View.AccessibilityDelegate BUTTON_DELEGATE = - new View.AccessibilityDelegate() { - @Override - public void onInitializeAccessibilityEvent(View host, AccessibilityEvent event) { - super.onInitializeAccessibilityEvent(host, event); - event.setClassName(Button.class.getName()); - } - - @Override - public void onInitializeAccessibilityNodeInfo(View host, AccessibilityNodeInfo info) { - super.onInitializeAccessibilityNodeInfo(host, info); - info.setClassName(Button.class.getName()); - } - }; - - private static final View.AccessibilityDelegate RADIOBUTTON_CHECKED_DELEGATE = - new View.AccessibilityDelegate() { - @Override - public void onInitializeAccessibilityEvent(View host, AccessibilityEvent event) { - super.onInitializeAccessibilityEvent(host, event); - event.setClassName(RadioButton.class.getName()); - event.setChecked(true); - } - - @Override - public void onInitializeAccessibilityNodeInfo(View host, AccessibilityNodeInfo info) { - super.onInitializeAccessibilityNodeInfo(host, info); - info.setClassName(RadioButton.class.getName()); - info.setCheckable(true); - info.setChecked(true); - } - }; - - private static final View.AccessibilityDelegate RADIOBUTTON_UNCHECKED_DELEGATE = - new View.AccessibilityDelegate() { - @Override - public void onInitializeAccessibilityEvent(View host, AccessibilityEvent event) { - super.onInitializeAccessibilityEvent(host, event); - event.setClassName(RadioButton.class.getName()); - event.setChecked(false); - } - - @Override - public void onInitializeAccessibilityNodeInfo(View host, AccessibilityNodeInfo info) { - super.onInitializeAccessibilityNodeInfo(host, info); - info.setClassName(RadioButton.class.getName()); - info.setCheckable(true); - info.setChecked(false); - } - }; - - public static void updateAccessibilityComponentType(View view, String componentType) { - if (componentType == null) { - view.setAccessibilityDelegate(null); - return; - } - switch (componentType) { - case BUTTON: - view.setAccessibilityDelegate(BUTTON_DELEGATE); - break; - case RADIOBUTTON_CHECKED: - view.setAccessibilityDelegate(RADIOBUTTON_CHECKED_DELEGATE); - break; - case RADIOBUTTON_UNCHECKED: - view.setAccessibilityDelegate(RADIOBUTTON_UNCHECKED_DELEGATE); - break; - default: - view.setAccessibilityDelegate(null); - break; - } - } - - public static void sendAccessibilityEvent(View view, int eventType) { - view.sendAccessibilityEvent(eventType); - } - -} diff --git a/ReactAndroid/src/main/java/com/facebook/react/uimanager/BaseViewManager.java b/ReactAndroid/src/main/java/com/facebook/react/uimanager/BaseViewManager.java index 3e6354f041080e..2c2867378988ee 100644 --- a/ReactAndroid/src/main/java/com/facebook/react/uimanager/BaseViewManager.java +++ b/ReactAndroid/src/main/java/com/facebook/react/uimanager/BaseViewManager.java @@ -32,7 +32,6 @@ public abstract class BaseViewManager