From 31c3a145fb36ef85e29a6a5a3c71439095f2e103 Mon Sep 17 00:00:00 2001 From: fabriziobertoglio1987 Date: Tue, 15 Feb 2022 10:49:08 -0800 Subject: [PATCH] Text Component does not announce disabled and disables click functionality when disabled (#33076) Summary: This issue fixes https://github.com/facebook/react-native/issues/30937 fixes https://github.com/facebook/react-native/issues/30947 fixes https://github.com/facebook/react-native/issues/30840 ([Test Case 7.1][7.1], [Test Case 7.3][7.3], [Test Case 7.5][7.5]) . The issue is caused by: 1) The missing javascript logic on the `accessibilityState` in the Text component https://github.com/fabriziobertoglio1987/react-native/commit/6ab7ab34e56411a7e87f396feb2f7ece1c4f98dd (as previously implemented in [Button][20]). 2) The missing setter for prop `accessible` in `ReactTextAnchorViewManager` https://github.com/fabriziobertoglio1987/react-native/commit/17095c6615107695f44af262846da446868b4cd8 (More information in previous PR https://github.com/facebook/react-native/pull/31252) Related PR https://github.com/facebook/react-native/pull/33070 PR https://github.com/callstack/react-native-slider/pull/354 [20]: https://github.com/facebook/react-native/pull/31001/files#diff-4f225d043edf4cf5b8288285b6a957e2187fc0242f240bde396e41c4c25e4124R281-R289 [Android] [Fixed] - Text Component does not announce disabled and disables click functionality when disabled Pull Request resolved: https://github.com/facebook/react-native/pull/33076 Test Plan: [1]. Text has `disabled` and `accessibilityState={{disabled: false}}` ([link][1]) [2]. Text has `disabled` ([link][2]) [3]. Text has `accessibilityState={{disabled: true}}` ([link][3]) [4]. Text has `accessibilityState={{disabled:false}}` ([link][4]) [5]. Text has `disabled={false}` and `accessibilityState={{disabled:true}}` ([link][5]) [6]. Text has `accessibilityState={{disabled:true}}` and method `setAccessible` in `ReactTextAnchorViewManager` (tested on commit [b4cd8][10]) ([link][6]) 7. Test Cases on the main branch [7.1]. Text has `disabled` and `accessibilityState={{disabled: false}}` ([link][7.1]) [7.3] Text has `accessibilityState={{disabled: true}}` ([link][7.3]) [7.5] Text has `disabled={false}` and `accessibilityState={{disabled:true}}` ([link][7.5]) [7.6] Text has `onPress callback` and `accessibilityState={{disabled: true}}` ([link][7.6]) [7.7] Text has `accessibilityState={{disabled:true}}` and no method `setAccessible` in `ReactTextAnchorViewManager` (tested on commit [c4f98dd][11]) ([link][7.7]) [1]: https://github.com/fabriziobertoglio1987/react-native-notes/issues/1#issuecomment-1033465424 [2]: https://github.com/fabriziobertoglio1987/react-native-notes/issues/1#issuecomment-1033465631 [3]: https://github.com/fabriziobertoglio1987/react-native-notes/issues/1#issuecomment-1033465706 [4]: https://github.com/fabriziobertoglio1987/react-native-notes/issues/1#issuecomment-1033465755 [5]: https://github.com/fabriziobertoglio1987/react-native-notes/issues/1#issuecomment-1033465813 [6]: https://github.com/fabriziobertoglio1987/react-native-notes/issues/1#issuecomment-1038473783 [7.1]: https://github.com/fabriziobertoglio1987/react-native-notes/issues/1#issuecomment-1033465874 [7.3]: https://github.com/fabriziobertoglio1987/react-native-notes/issues/1#issuecomment-1033465961 [7.5]: https://github.com/fabriziobertoglio1987/react-native-notes/issues/1#issuecomment-1033466018 [7.6]: https://github.com/fabriziobertoglio1987/react-native-notes/issues/1#issuecomment-1033321965 [7.7]: https://github.com/fabriziobertoglio1987/react-native-notes/issues/1#issuecomment-1038471984 [10]: https://github.com/facebook/react-native/pull/33076/commits/17095c6615107695f44af262846da446868b4cd8 [11]: https://github.com/facebook/react-native/pull/33076/commits/6ab7ab34e56411a7e87f396feb2f7ece1c4f98dd Reviewed By: blavalla Differential Revision: D34211793 Pulled By: ShikaSD fbshipit-source-id: e153fb48c194f5884e30beb9172e66aca7ce1a41 --- Libraries/Text/Text.js | 15 ++++++++++++++- .../views/text/ReactTextAnchorViewManager.java | 5 +++++ 2 files changed, 19 insertions(+), 1 deletion(-) diff --git a/Libraries/Text/Text.js b/Libraries/Text/Text.js index dadf2a16379a9f..bc4fa226836d33 100644 --- a/Libraries/Text/Text.js +++ b/Libraries/Text/Text.js @@ -45,11 +45,22 @@ const Text: React.AbstractComponent< ...restProps } = props; + const [isHighlighted, setHighlighted] = useState(false); + + const _disabled = + restProps.disabled != null + ? restProps.disabled + : props.accessibilityState?.disabled; + const _accessibilityState = + _disabled !== props.accessibilityState?.disabled + ? {...props.accessibilityState, disabled: _disabled} + : props.accessibilityState; + const isPressable = (onPress != null || onLongPress != null || onStartShouldSetResponder != null) && - restProps.disabled !== true; + _disabled !== true; const initialized = useLazyInitialization(isPressable); const config = useMemo( @@ -167,7 +178,9 @@ const Text: React.AbstractComponent<