-
Notifications
You must be signed in to change notification settings - Fork 24.4k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat: Add role prop to Text component #34976
feat: Add role prop to Text component #34976
Conversation
@@ -286,3 +291,69 @@ export interface AccessibilityPropsIOS { | |||
*/ | |||
accessibilityIgnoresInvertColors?: boolean | undefined; | |||
} | |||
|
|||
export type Role = |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
These were missing on TS
556d37c
to
44a7a9b
Compare
Base commit: 5d8a712 |
44a7a9b
to
4799069
Compare
Base commit: 5d8a712 |
'use strict'; | ||
|
||
// Map role values to AccessibilityRole values | ||
export const roleToAccessibilityRoleMapping = { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This object roleToAccessibilityRoleMapping
needs to in JS VM heap all time after loading this JS. Consider making this is getter function so this object can be deallocated after the call, or better use a switch statement like this.
function normalizeKeyword(name) { |
cc @javache
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Sure, I've just refactor it to be a switch statement
Summary: I've been noticing this for a while now, every time that someone changes a file inside rn-tester Danger comments a bunch of warnings regarding inline styles, e.g. #34567 (comment), even though that is disabled inside .eslintrc https://github.com/facebook/react-native/blob/8edf4e9e3adcc85743e3c86a25ab3748b276a3da/packages/rn-tester/.eslintrc#L3 After some investigation, I realized that the problem was that the Eslint Node.js API used by [seadub/danger-plugin-eslint](https://www.npmjs.com/package/seadub/danger-plugin-eslint) was not able to locate any `.eslintrc` files due to the location of the directory where danger is invoked. By using `process.chdir` we can ensure that eslint will run from the root folder and that it will be able to find all .eslintrc files ## Changelog [Internal] [Fixed] - fix eslint config when running Danger Pull Request resolved: #34980 Test Plan: run `yarn danger pr https://github.com/facebook/react-native/pull/34976` After ![image](https://user-images.githubusercontent.com/11707729/195751496-5225a32f-f4b3-4ce2-833f-ae5723f647c0.png) Before ![image](https://user-images.githubusercontent.com/11707729/195751673-34ba87fc-ce50-4020-9688-a486e3021c4f.png) Reviewed By: cortinico Differential Revision: D40384300 Pulled By: yungsters fbshipit-source-id: e68eeafc42567dc9d7297dde3709a989cc70f4e2
4799069
to
15da31c
Compare
15da31c
to
02082e4
Compare
Summary: I've been noticing this for a while now, every time that someone changes a file inside rn-tester Danger comments a bunch of warnings regarding inline styles, e.g. facebook#34567 (comment), even though that is disabled inside .eslintrc https://github.com/facebook/react-native/blob/8edf4e9e3adcc85743e3c86a25ab3748b276a3da/packages/rn-tester/.eslintrc#L3 After some investigation, I realized that the problem was that the Eslint Node.js API used by [seadub/danger-plugin-eslint](https://www.npmjs.com/package/seadub/danger-plugin-eslint) was not able to locate any `.eslintrc` files due to the location of the directory where danger is invoked. By using `process.chdir` we can ensure that eslint will run from the root folder and that it will be able to find all .eslintrc files ## Changelog [Internal] [Fixed] - fix eslint config when running Danger Pull Request resolved: facebook#34980 Test Plan: run `yarn danger pr https://github.com/facebook/react-native/pull/34976` After ![image](https://user-images.githubusercontent.com/11707729/195751496-5225a32f-f4b3-4ce2-833f-ae5723f647c0.png) Before ![image](https://user-images.githubusercontent.com/11707729/195751673-34ba87fc-ce50-4020-9688-a486e3021c4f.png) Reviewed By: cortinico Differential Revision: D40384300 Pulled By: yungsters fbshipit-source-id: e68eeafc42567dc9d7297dde3709a989cc70f4e2
@jacdebug would you mind rereviwing this PR? |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks for the fixups, LGTM and sorry for delay!
@jacdebug has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator. |
This pull request was successfully merged by @gabrieldonadel in 20718e6. When will my fix make it into a release? | Upcoming Releases |
Summary: I've been noticing this for a while now, every time that someone changes a file inside rn-tester Danger comments a bunch of warnings regarding inline styles, e.g. facebook#34567 (comment), even though that is disabled inside .eslintrc https://github.com/facebook/react-native/blob/8edf4e9e3adcc85743e3c86a25ab3748b276a3da/packages/rn-tester/.eslintrc#L3 After some investigation, I realized that the problem was that the Eslint Node.js API used by [seadub/danger-plugin-eslint](https://www.npmjs.com/package/seadub/danger-plugin-eslint) was not able to locate any `.eslintrc` files due to the location of the directory where danger is invoked. By using `process.chdir` we can ensure that eslint will run from the root folder and that it will be able to find all .eslintrc files ## Changelog [Internal] [Fixed] - fix eslint config when running Danger Pull Request resolved: facebook#34980 Test Plan: run `yarn danger pr https://github.com/facebook/react-native/pull/34976` After ![image](https://user-images.githubusercontent.com/11707729/195751496-5225a32f-f4b3-4ce2-833f-ae5723f647c0.png) Before ![image](https://user-images.githubusercontent.com/11707729/195751673-34ba87fc-ce50-4020-9688-a486e3021c4f.png) Reviewed By: cortinico Differential Revision: D40384300 Pulled By: yungsters fbshipit-source-id: e68eeafc42567dc9d7297dde3709a989cc70f4e2
Summary: As pointed out by necolas on facebook#34424 (comment) we forgot we add the `role` prop mapping to the `Text` component. This PR adds a new `role` prop to `Text`, mapping the web `role` values to the already existing `accessibilityRole` prop and moves the `roleToAccessibilityRoleMapping` to a common file that can be imported by both the `Text` and `View` components as requested on facebook#34424. This PR also updates the RNTester AcessebilityExample to include a test using this new prop. ## Changelog [General] [Added] - Add role prop to Text component Pull Request resolved: facebook#34976 Test Plan: 1. Open the RNTester app and navigate to the Accessibility Example page 2. Test the `role` prop through the `Text with role = heading` section Reviewed By: yungsters Differential Revision: D40596039 Pulled By: jacdebug fbshipit-source-id: f72f02e8bd32169423ea517ad18b598b52257b17
Summary
As pointed out by @necolas on #34424 (comment) we forgot we add the
role
prop mapping to theText
component. This PR adds a newrole
prop toText
, mapping the webrole
values to the already existingaccessibilityRole
prop and moves theroleToAccessibilityRoleMapping
to a common file that can be imported by both theText
andView
components as requested on #34424. This PR also updates the RNTester AcessebilityExample to include a test using this new prop.Changelog
[General] [Added] - Add role prop to Text component
Test Plan
role
prop through theText with role = heading
section