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
Special attribute for macOS accessibility #10305
Changes from 4 commits
94dd068
9605e6c
6717f0d
75b2915
93a8e75
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -8,7 +8,7 @@ Accessibility concerns in Electron applications are similar to those of websites | |
|
||
These new features bring those auditing tools to your Electron app. You can choose to add audits to your tests with Spectron or use them within DevTools with Devtron. Read on for a summary of the tools or checkout our [accessibility documentation](https://electron.atom.io/docs/tutorial/accessibility) for more information. | ||
|
||
### Spectron | ||
## Spectron | ||
|
||
In the testing framework Spectron, you can now audit each window and `<webview>` tag in your application. For example: | ||
|
||
|
@@ -22,7 +22,7 @@ app.client.auditAccessibility().then(function (audit) { | |
|
||
You can read more about this feature in [Spectron's documentation](https://github.com/electron/spectron#accessibility-testing). | ||
|
||
### Devtron | ||
## Devtron | ||
|
||
In Devtron, there is a new accessibility tab which will allow you to audit a page in your app, sort and filter the results. | ||
|
||
|
@@ -31,3 +31,32 @@ In Devtron, there is a new accessibility tab which will allow you to audit a pag | |
Both of these tools are using the [Accessibility Developer Tools](https://github.com/GoogleChrome/accessibility-developer-tools) library built by Google for Chrome. You can learn more about the accessibility audit rules this library uses on that [repository's wiki](https://github.com/GoogleChrome/accessibility-developer-tools/wiki/Audit-Rules). | ||
|
||
If you know of other great accessibility tools for Electron, add them to the [accessibility documentation](https://electron.atom.io/docs/tutorial/accessibility) with a pull request. | ||
|
||
## Enabling Accessibility | ||
|
||
Electron applications keep accessibility disabled by default for performance reasons but there are multiple ways to enable it. | ||
|
||
### Inside Application | ||
|
||
By using [`app.setAccessibilitySupportEnabled(enabled)`](https://electron.atom.io/docs/api/app.md#appsetaccessibilitysupportenabledenabled-macos-windows), you can expose accessibility switch to users in the application preferences. | ||
|
||
### Assistive Technology | ||
|
||
Electron application will enable accessibility automatically when it detects assistive technology (Windows) or VoiceOver (macOS). See Chrome's [accessibility documentation](https://www.chromium.org/developers/design-documents/accessibility#TOC-How-Chrome-detects-the-presence-of-Assistive-Technology) for more details. | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. "Electron application will enable accessibility automatically" -- just so I understand correctly: does this mean the presence of these assistive features will automatically cause accessibility to be enabled, regardless of the current setting? Or does it only mean that these features will be used if There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. The first one – system assistive utilities have a priority and will enable accessibility regardless of the For users who need accessibility without VoiceOver there are 3 options:
|
||
|
||
On macOS 3rd party assistive technology can switch accessibility inside Electron applications by setting the attribute `AXManualAccessibility` programmatically: | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. On macOS, third-party |
||
|
||
```objc | ||
CFStringRef kAXManualAccessibility = CFSTR("AXManualAccessibility"); | ||
|
||
+ (void)enableAccessibility:(BOOL)enable inElectronApplication:(NSRunningApplication *)app | ||
{ | ||
AXUIElementRef appRef = AXUIElementCreateApplication(app.processIdentifier); | ||
if (appRef == nil) | ||
return; | ||
|
||
CFBooleanRef value = enable ? kCFBooleanTrue : kCFBooleanFalse; | ||
AXUIElementSetAttributeValue(appRef, kAXManualAccessibility, value); | ||
CFRelease(appRef); | ||
} | ||
``` |
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.
Is accessibility support disabled by default? If so, these docs should probably mention that.
For folks who don't know what the "accessibility tree rendering" is, a link would be helpful. Is this the right URL? https://developers.google.com/web/fundamentals/accessibility/semantics-builtin/the-accessibility-tree
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.
Yes, it's disabled by default both in Chrome and Electron. The link is super helpful, adding it.