Repository navigation
fix: map aria-* props in Switch, ScrollView and ActivityIndicator - #59379
faciledictu wants to merge 3 commits into
Conversation
ed90278 to
0c00807
Compare
Visual regressionNo visual differences at ios: no capture |
0c00807 to
ab85ded
Compare
These components render a native component directly instead of a View, so the aria-*, id and tabIndex props reach the native side unconverted and are dropped. Move the conversion View does into a helper and use it in the three components.
ab85ded to
c0aa271
Compare
|
Rebased on |
|
@javache has imported this pull request. If you are a Meta employee, you can view this in D129043804. |
| if ( | ||
| accessibilityState != null || | ||
| ariaBusy != null || | ||
| ariaChecked != null || | ||
| ariaDisabled != null || | ||
| ariaExpanded != null || | ||
| ariaSelected != null | ||
| ) { | ||
| resolvedProps.accessibilityState = { | ||
| busy: ariaBusy ?? accessibilityState?.busy, | ||
| checked: ariaChecked ?? accessibilityState?.checked, | ||
| disabled: ariaDisabled ?? accessibilityState?.disabled, | ||
| expanded: ariaExpanded ?? accessibilityState?.expanded, | ||
| selected: ariaSelected ?? accessibilityState?.selected, | ||
| }; | ||
| } |
There was a problem hiding this comment.
Can you match the logic of https://github.com/react/react-native/pull/59807/changes, and remove accessibilityState != null from this condition? Ditto for accessibilityValue below.
There was a problem hiding this comment.
Done: accessibilityState and accessibilityValue now pass through unchanged, and a new object is built only when an aria-* prop is set, as in #59807.
Summary:
Part of #59377.
Switch,ScrollViewandActivityIndicatorrender a native component directly, not aView, soaria-*,idandtabIndexreach the native side under their web-style names, which the native side does not read.<Switch aria-label="Wi-Fi" />has no label (Android marks itNAF), whileaccessibilityLabelworks; the same forActivityIndicatorandScrollView.This change moves the conversion
Viewdoes intoresolveAriaProps(src/private/components/view) and uses it in the three components. The logic is copied fromView.jsunchanged, so the props behave the same as onView.View.jsitself is not changed here, to stay clear of #59102; it can switch to the helper afterwards.Overlap: #59072 maps
aria-hiddenonScrollViewandActivityIndicator. This change covers it as well (and also onSwitch, which #59072 leaves out on purpose); happy to rebase on it or drop the overlap, whichever the maintainers prefer.RefreshControlandModalare left out:Modalis not an accessibility element, andRefreshControlwraps the scroll view on Android.Changelog:
[GENERAL] [FIXED] -
aria-*,idandtabIndexonSwitch,ScrollViewandActivityIndicatorreach the native viewTest Plan:
yarn fantom packages/react-native/Libraries/Components/Switch packages/react-native/Libraries/Components/ScrollView/__tests__/ScrollView-itest.js packages/react-native/Libraries/Components/ActivityIndicator: 3 suites, 24 tests passed.yarn flow-check: no errors.yarn eslinton the changed files: no warnings.content-descinuiautomator dump(Android 17 emulator); on iOS A has no label (pairs C–F do not apply on iOS, see the issue). After, on iOS 27: A's label is "Wi-Fi A". After, on Android 17: A'scontent-descis "Wi-Fi A" (no longerNAF), C's is "Loading C", E's is "Photos E", matching theaccessibility*controls B, D, F.