New issue
Advanced search Search tips

Issue 791665 link

Starred by 2 users

Issue metadata

Status: Assigned
Owner:
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Linux , Windows , Chrome , Mac
Pri: 2
Type: Feature
Team-Accessibility



Sign in to add a comment

MD Extensions: A11y: Improve action association

Project Member Reported by hcarmona@chromium.org, Dec 4 2017

Issue description

From Issue 606526:

We need a better way to associate the buttons per each extension (remove, enable/disable toggle) with the extension name. Right now, if you didn't visually see which extension those items correspond with, it could be very confusing. I think we should insert the extension name into the utterance of those buttons so you actually hear "remove ___, button" for example. 
 

Comment 1 by sdy@chromium.org, Dec 6 2017

Components: UI>Accessibility UI>Browser>WebUI
Labels: -Type-Bug Type-Feature
Components: -UI>Browser>WebUI UI>Browser>ExtensionsManagement
Please use the correct component when filing MD extensions bug, or use go/md-extensions-bug for a pre-populated template.
Owner: hcarmona@chromium.org
Status: Started (was: Unconfirmed)
 Issue 789280  has been merged into this issue.
Labels: a11y-secondary
Project Member

Comment 6 by bugdroid1@chromium.org, Dec 20 2017

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/dc8229d2f35d0dbf949d0c7814a90456543c0cb9

commit dc8229d2f35d0dbf949d0c7814a90456543c0cb9
Author: Hector Carmona <hcarmona@chromium.org>
Date: Wed Dec 20 01:03:45 2017

MD Extensions: A11y - Add extension to description of all controls.

Bug: 791665
Cq-Include-Trybots: master.tryserver.chromium.linux:closure_compilation
Change-Id: Iaa6082db8d58b426b110bdb4fcecb6c9f0a6cc9b
Reviewed-on: https://chromium-review.googlesource.com/831346
Commit-Queue: Hector Carmona <hcarmona@chromium.org>
Reviewed-by: Demetrios Papadopoulos <dpapad@chromium.org>
Cr-Commit-Position: refs/heads/master@{#525208}
[modify] https://crrev.com/dc8229d2f35d0dbf949d0c7814a90456543c0cb9/chrome/app/md_extensions_strings.grdp
[modify] https://crrev.com/dc8229d2f35d0dbf949d0c7814a90456543c0cb9/chrome/browser/resources/md_extensions/item.html
[modify] https://crrev.com/dc8229d2f35d0dbf949d0c7814a90456543c0cb9/chrome/browser/resources/md_extensions/item.js
[modify] https://crrev.com/dc8229d2f35d0dbf949d0c7814a90456543c0cb9/chrome/browser/ui/webui/extensions/extensions_ui.cc

Status: Fixed (was: Started)
Status: Available (was: Fixed)
Chrome: 65.0.3353.0 Canary
NVDA: 2017.4

The new labels are only read when tabbing or when pressing 'b' to jump to the button. When using down arrow, only the visual text is read.
The accessible label is a bit too verbose

This could be improved by implementing option 1. Other suggestions could improve the experience

1. Setting the button aria-label to the action +<extension name>
Example: <button aria-label="Details for Google Docs Offline">Details</button>
          <button aria-label="remove Google Docs Offline">Remove</button>

2. Make the extension name a heading to make it easier to jump to the next extension
Example: <h2>Application Launcher for Drive (by Google)</h2>

3. Group the elements in an extension listing together with aria-group
<div role="group" aria-label]"Extension">
Extension Icon
Added by a third-party
Application Launcher for Drive (by Google)
Open Drive files directly from your browser in compatible applications installed on your computer.
DETAILS 
REMOVE 
Extension Enabled
</div>
Status: Assigned (was: Available)
Re comment #8's proposals:

1. Setting label for "Action + Extension"
  This would be an ideal solution, but would require doubling the number of strings for i18n because we can't just concat strings since the order could be different in other languages. When we first implemented the solution with "related to extension" we did that as a compromise between many strings and not being usable.

2. Make the extension name a heading for easier navigation
  This should be doable, I don't know if there's any down sides to doing this

3. Group elements together
  This sounds like it could be a good working solution if it allows people on screen readers to know what the buttons are associated with.

Sign in to add a comment