Feat/accessibility state alias by ankit-tailor · Pull Request #34524 · facebook/react-native

ankit-tailor · 2022-08-29T07:39:39Z

Summary

This adds aliasing for accessibility state, it's used as requested on #34424.

aria-disabled to equivalent accessibilityState.disabled
aria-busy to equivalent accessibilityState.busy
aria-checked to equivalent accessibilityState.checked
aria-expanded to equivalent accessibilityState.expanded
aria-selected to equivalent accessibilityState.selected

Changelog

[General] [Added] - Add aria-disabled, aria-busy, aria-checked, aria-expanded and aria-selected prop to core components

Test Plan

<View
  aria-disabled={true}
  aria-selected={false}
  aria-checked={true}
  aria-expanded={true}
  aria-busy={true}
  style={{backgroundColor: '#527FE4', padding: 5}}>
  <Text style={{fontSize: 11}}>Blue background</Text>
</View>

ankit-tailor · 2022-08-29T07:40:29Z

Hi @necolas, I will be adding other components to this PR.

Libraries/Components/Pressable/Pressable.js

Libraries/Text/Text.js

necolas · 2022-08-29T17:46:53Z

Please take a look at the failing tests. thanks

ankit-tailor · 2022-08-29T17:50:40Z

Yes, looking into it.

…state-alias

analysis-bot · 2022-08-30T07:10:00Z

Platform	Engine	Arch	Size (bytes)	Diff
android	hermes	arm64-v8a	7,639,245	+1,010
android	hermes	armeabi-v7a	7,051,502	+999
android	hermes	x86	7,940,841	+1,009
android	hermes	x86_64	7,912,841	+1,002
android	jsc	arm64-v8a	9,513,506	+1,270
android	jsc	armeabi-v7a	8,289,111	+1,255
android	jsc	x86	9,452,839	+1,272
android	jsc	x86_64	10,043,907	+1,276

Base commit: 62f83a9
Branch: main

analysis-bot · 2022-08-30T07:54:15Z

Platform	Engine	Arch	Size (bytes)	Diff
ios	-	universal	n/a	--

Base commit: 62f83a9
Branch: main

facebook-github-bot · 2022-08-30T16:49:53Z

@jacdebug has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator.

Libraries/Components/Pressable/Pressable.js

ankit-tailor · 2022-08-31T20:22:23Z

Hi @necolas, I've added alias for core components. Just wanted clarification regarding failing test cases for undefined values.

necolas · 2022-08-31T20:26:33Z

If in review a member of RN wants to do things differently for undefined values, they can bring that up. But you should update the snapshots so tests pass.

ankit-tailor · 2022-08-31T20:54:46Z

@necolas updated all snapshots.

facebook-github-bot · 2022-09-01T11:08:17Z

@jacdebug has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator.

ankit-tailor · 2022-09-01T17:04:46Z

@necolas @jacdebug Updated the latest changes, Let me know if anything else needs to be done.

…state-alias

facebook-github-bot · 2022-09-08T09:24:01Z

@jacdebug has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator.

react-native-bot · 2022-09-08T10:45:05Z

This pull request was successfully merged by @ankit-tailor in 98d84e5.

^{When will my fix make it into a release? | Upcoming Releases}

Summary: `aria-checked` prop should accept `mixed` as value as given [here](https://www.w3.org/WAI/GL/wiki/Using_WAI-ARIA_aria-checked%3Dmixed) and also [accessibilityState.checked](https://reactnative.dev/docs/accessibility#accessibilitystate) accepts mixed to represent checkboxes. This change refers to issue #34424 and PR #34524 ## Changelog [General] [Added] - Added `mixed` value for `aria-checked`. Pull Request resolved: #34633 Test Plan: ```js <TouchableOpacity accessibilityRole="checkbox" aria-checked="mixed" accessibilityHint="click me to change state"> <Text>Checkbox example</Text> </TouchableOpacity> ``` Reviewed By: lunaleaps Differential Revision: D39382158 Pulled By: necolas fbshipit-source-id: fa026274111305cc0bcbb42ed974ca1be7d779a5

ankit-tailor added 2 commits August 29, 2022 13:03

feat: typing for accessibilit state alias

9b93788

feat: mapping for accssibility state alias

374ea18

facebook-github-bot added the CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. label Aug 29, 2022

facebook-github-bot added the Shared with Meta Applied via automation to indicate that an Issue or Pull Request has been shared with the team. label Aug 29, 2022

react-native-bot added the Type: Enhancement A new feature or enhancement of an existing feature. label Aug 29, 2022

ankit-tailor added 5 commits August 29, 2022 13:22

fix: add aria-busy

b65c50d

fix: remove log

3adb318

feat: accessibility state typings for pressable

c28ca60

feat: accessibility state alias for text

5686e1e

feat: accessibility state alias typing for text

b5a03ff

necolas reviewed Aug 29, 2022

View reviewed changes

Libraries/Components/Pressable/Pressable.js Show resolved Hide resolved

necolas reviewed Aug 29, 2022

View reviewed changes

Libraries/Text/Text.js Show resolved Hide resolved

necolas mentioned this pull request Aug 29, 2022

[w3c] ☂️ Web Props (Part 1) umbrella issue #34424

Closed

70 tasks

ankit-tailor added 2 commits August 30, 2022 11:56

fix: remove undefined keys

e58b762

Merge remote-tracking branch 'upstream/main' into feat/accessibility-…

14af27f

…state-alias

ankit-tailor added 2 commits August 30, 2022 15:03

fix: alpha sorted props

1ab9b3b

fix: object dot notation

885543f

necolas reviewed Aug 30, 2022

View reviewed changes

Libraries/Components/Pressable/Pressable.js Outdated Show resolved Hide resolved

ankit-tailor added 4 commits September 1, 2022 00:21

feat: alias for accessibilit state

2ed706e

feat: alias for accessibilit state

2bd848f

feat: alias accessibility state for TextInput

c5ea82d

feat: accessibility state alias

73778b5

ankit-tailor added 2 commits September 1, 2022 02:17

fix: remove undefined key logic

4f628a7

feat: update snapshot

2848bf5

fix: undefined check

4b543bf

ankit-tailor added 3 commits September 1, 2022 22:35

fix: remove trailing space

190a8b0

fix: accessibility state assignment

89f7de9

fix: resolve conflicts

0e123bc

ankit-tailor requested a review from necolas September 5, 2022 13:49

ankit-tailor added 5 commits September 5, 2022 23:19

Merge remote-tracking branch 'upstream/main' into feat/accessibility-…

7ee1978

…state-alias

fix: const variables

4c4955c

Merge remote-tracking branch 'upstream/main' into feat/accessibility-…

a4bb35c

…state-alias

feat: accessibility state example

bd8dec6

Merge remote-tracking branch 'upstream/main' into feat/accessibility-…

377ec76

…state-alias

facebook-github-bot closed this in 98d84e5 Sep 8, 2022

react-native-bot added the Merged This PR has been merged. label Sep 8, 2022

ankit-tailor mentioned this pull request Sep 8, 2022

fix: add mixed to aria-checked typings #34633

Closed

jacdebug added the Needs TypeScript Update label Sep 8, 2022

jgillick mentioned this pull request Mar 17, 2023

0.71 breaks multi-line TextInput focus accessibility for legacy renderer #36465

Closed

jgillick mentioned this pull request Jun 13, 2024

Accessibility broken for multi-line TextInput focus accessibility (since 0.71) #44915

Closed

Conversation

ankit-tailor commented Aug 29, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Changelog

Test Plan

Uh oh!

ankit-tailor commented Aug 29, 2022

Uh oh!

Uh oh!

Uh oh!

necolas commented Aug 29, 2022

Uh oh!

ankit-tailor commented Aug 29, 2022

Uh oh!

analysis-bot commented Aug 30, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

analysis-bot commented Aug 30, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

facebook-github-bot commented Aug 30, 2022

Uh oh!

Uh oh!

ankit-tailor commented Aug 31, 2022

Uh oh!

necolas commented Aug 31, 2022

Uh oh!

ankit-tailor commented Aug 31, 2022

Uh oh!

facebook-github-bot commented Sep 1, 2022

Uh oh!

ankit-tailor commented Sep 1, 2022

Uh oh!

facebook-github-bot commented Sep 8, 2022

Uh oh!

react-native-bot commented Sep 8, 2022

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants

ankit-tailor commented Aug 29, 2022 •

edited

Loading

analysis-bot commented Aug 30, 2022 •

edited

Loading

analysis-bot commented Aug 30, 2022 •

edited

Loading