Skip to content
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

Add accessible text to disclosure menu on Categories/Entries screens #11251

Merged
merged 10 commits into from
Jun 9, 2022

Conversation

gcamacho079
Copy link
Contributor

@gcamacho079 gcamacho079 commented May 17, 2022

Description

  • Adds accessible text to disclosure menus that specify new entry/category type (Resolves DEV-443)
  • Adds ariaLabel and role to Craft.ui.createButton config
  • Enables keyboard operation of New Entry/New Category menus (Resolves DEV-684)

Related issues

@gcamacho079 gcamacho079 requested a review from brandonkelly May 17, 2022 19:57
@linear
Copy link

linear bot commented May 17, 2022

DEV-443 New Category and New Entry disclosure menu triggers do not have associated text

The expandable menus next to New Category and New Entry buttons do not have programmatically-determinable text

Add aria-label attributes on the buttons, or visually-hidden text

Screen Shot 2022-04-07 at 5.47.13 PM.png

Resolves CMS-113

@gcamacho079 gcamacho079 marked this pull request as ready for review May 17, 2022 19:57
@gcamacho079 gcamacho079 requested review from nfourtythree and a team as code owners May 17, 2022 19:57
@gcamacho079 gcamacho079 added the accessibility 👤 features related to accessibility label May 24, 2022
@brandonkelly
Copy link
Member

“Specify new entry type” could be confusing because Craft already has a concept called “entry types”.

Can we change the wording to “Choose a category group” and “Choose a section”?

@gcamacho079
Copy link
Contributor Author

@brandonkelly I've updated the translations to match your suggestions! I did realize while making that update that having different button text for the disclosure button depending on whether the user is in a group/section or on the index page is a failure under 3.2.4 Consistent Identification.

So I streamlined the button text on the index page so that it's consistent with the split button's accessible text:
Screenshot showing a disclosure button with the text 'Choose a section' on the All entries page

@brandonkelly
Copy link
Member

brandonkelly commented Jun 8, 2022

The button should definitely still be labelled “New entry”/“New category”. Without that, it’s not clear why you’d be “choosing a section” or “choosing a category group” in the first place.

Can the original button labels be retained (and spoken), and have “Choose a section”/“Choose a category group” be spoken out in addition to that, when the button is activated?

@gcamacho079
Copy link
Contributor Author

@brandonkelly that makes complete sense. Let me think through this a little more and I'll see what I can come up with. 🤔

@linear
Copy link

linear bot commented Jun 9, 2022

DEV-684 Users can't operate primary action menu on entry/category index pages with keyboard only

Page Area:

Entry and category index pages

Issue Description:

When a user activates the split action button to add a new element and choose its type, they can't make a selection via the keyboard only

Action:

Use a button role and add Enter/Spacebar handlers for selecting a new element type

Screenshot/Code Snippet:

Screenshot showing the disclosure menu in question, immediately following the search/filter toolbar:

Screen Shot 2022-06-02 at 11.49.55 AM.png

Resolves CMS-229

# Conflicts:
#	src/web/assets/cp/dist/cp.js
#	src/web/assets/cp/dist/cp.js.map
@brandonkelly brandonkelly merged commit 07b8950 into 4.1 Jun 9, 2022
@brandonkelly brandonkelly deleted the a11y/disclosure-menu-text branch June 9, 2022 22:07
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
accessibility 👤 features related to accessibility
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants