Add changes to disabled property for components (e.g TouchableHighlight) #11278
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @@ -124,7 +128,7 @@ void ControlViewManager::OnPropertiesUpdated(ShadowNodeBase *node) { | |||
|
|
|||
| // If developer specifies either the accessible and focusable prop to be false | |||
| // remove accessibility and keyboard focus for component. | |||
| const auto isTabStop = (node->IsAccessible() && node->IsFocusable()); | |||
| const auto isTabStop = node->IsDisable() ? false : node->IsAccessible() && node->IsFocusable(); | |||
There was a problem hiding this comment.
nit: could use bang operator here
| const auto isTabStop = | ||
| (isPressable && isFocusable && isAccessible) || (!isPressable && (isFocusable || isAccessible)); | ||
| const auto isDisabled = pViewShadowNode->IsDisable(); | ||
| const auto isTabStop = (isDisabled ? false : ((isPressable && isFocusable && isAccessible) || (!isPressable && (isFocusable || isAccessible)))); |
There was a problem hiding this comment.
nit: same here re ! operator
|
|
||
| protected: | ||
| XamlView m_view; | ||
| bool m_updating = false; | ||
| bool m_isFocusable = true; | ||
| bool m_isAccessible = true; | ||
| bool m_isDisable = false; |
There was a problem hiding this comment.
consider naming this m_isDisabled and the above to IsDisabled to align with the disabled property name.
| if (finalizeBorderRadius && control.try_as<xaml::Controls::IControl7>()) { | ||
| // Control.CornerRadius is only supported on >= RS5, setting borderRadius on Controls have no effect < RS5 | ||
| UpdateCornerRadiusOnElement(nodeToUpdate, control); | ||
| // Control.CornerRadius is only supported on >= RS5, setting borderRadius on Controls have no effect < RS5 |
There was a problem hiding this comment.
nit: white space
|
It's worth testing that it works for <Pressable onPress={onPressFunction}>
<Text>I'm pressable!</Text>
</Pressable> |
| const auto isTabStop = | ||
| (isPressable && isFocusable && isAccessible) || (!isPressable && (isFocusable || isAccessible)); | ||
| (!isDisabled && |
There was a problem hiding this comment.
If you haven't already, I'd also double check that this issue (#10687) isn't being reintroduced just with the disabled prop causing it now
TatianaKapos
approved these changes
Mar 2, 2023
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
Added changes to prevent components that are disabled from being keyboard focusable. Used TouchableHighlight issue #8875 as example.
Type of Change
Why
Resolves [#8875 ]
What
Added logic to check
disabledproperty on components and, if true, make them not focusable.Screenshots
After:
Breakpoint on
disabled={true}Testing
Tested on a TouchableHighlight component in playground. When
disabledprop is set totrue, Touchable component no longer receives keyboard focus, both in and out of Narrator mode, as shown in 'After' screenshot. Also, breakpoint fordisabledproperty check inViewViewManageris being hit when Touchable component hasdisabled={true}.Microsoft Reviewers: Open in CodeFlow
Microsoft Reviewers: Open in CodeFlow