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

AC-2493::Items within actions menu are not operable for keyboard-only… #3791

Merged
merged 7 commits into from
Sep 1, 2022

Conversation

glo71317
Copy link
Collaborator

@glo71317 glo71317 commented Apr 26, 2022

Description

Items within actions menu are not operable for keyboard-only users (Shopping Bag)

Reproduction Steps
select "Blouses & Shirts" > select "Susanna Draped Tank" > add product to cart > select bag > select "Edit Shopping Bag" - [NODE][body>div:nth-of-type(1)>:nth-child(1)>:nth-child(3)]

  1. Press Tab to move through the content.
  2. When keyboard focus is on options (3 dots/"kebab") menu for a cart item, press Enter or Space to activate it.
  3. Tab through each item in the options menu and press Enter or Space to activate.

Actual Behavior
There are actionable elements that are not functional with the keyboard alone. Examples include:

Within actions menu:

"Move to favorites"
"Edit Item"
"Remove from cart"

Keyboard-only users cannot access this functionality. (Note that these controls can be activated when a screen reader is operating.)

Expected Behavior
Ensure that all functionality can be activated using keyboard alone.

Related Issue

Closes https://jira.corp.magento.com/browse/AC-2493

Verification Steps

Pre-Conditions:

  1. Have Magento instance with sample data installed
  2. Make sure to have pwa studio installed
  3. Make sure to have a customer login for front end login

Manual Steps executed:

Login to venia > select any product and add it to cart > select bag > select "Edit Shopping Bag"
Press Tab to move through the content.
When keyboard focus is on options (3 dots/"kebab") menu for a cart item, press Enter or Space to activate it.
Tab through each item in the options menu and press Enter or Space to activate.

✖️ Behaviour Before The Fix : There are actionable elements that are not functional with the keyboard alone. Examples include:

Within actions menu:
"Edit Item"
"Remove from cart"

✔️Behaviour After The Fix: All functionalities are activated using keyboard alone.
image
image

Checklist

  • I have added tests to cover my changes, if necessary.
  • I have added translations for new strings, if necessary.
  • I have updated the documentation accordingly, if necessary.

Resolved issues:

  1. resolves [Issue] AC-2493::Items within actions menu are not operable for keyboard-only… #3832: AC-2493::Items within actions menu are not operable for keyboard-only…

@pwa-studio-bot
Copy link
Collaborator

pwa-studio-bot commented Apr 26, 2022

Messages
📖

Associated JIRA tickets: AC-2493.

📖 DangerCI Failures related to missing labels/description/linked issues/etc will persist until the next push or next pr-test build run (assuming they are fixed).
📖

Access a deployed version of this PR here. Make sure to wait for the "pwa-pull-request-deploy" job to complete.

Generated by 🚫 dangerJS against 4c8b11b

@glo71317
Copy link
Collaborator Author

glo71317 commented May 2, 2022

run all tests

@supernova-at
Copy link
Contributor

@magento create issue from PR

jcalcaben
jcalcaben previously approved these changes Aug 26, 2022
@jcalcaben jcalcaben added the version: Patch This changeset includes backwards compatible bug fixes. label Aug 26, 2022
@dpatil-magento dpatil-magento changed the base branch from GL-web-accessibility to develop August 26, 2022 17:21
@dpatil-magento dpatil-magento dismissed jcalcaben’s stale review August 26, 2022 17:21

The base branch was changed.

@dpatil-magento
Copy link
Contributor

run pr-deploy

@pwa-test-bot
Copy link

pwa-test-bot bot commented Aug 26, 2022

Successfully started codebuild job for pr-deploy

@dpatil-magento
Copy link
Contributor

run pr-test

@pwa-test-bot
Copy link

pwa-test-bot bot commented Sep 1, 2022

Successfully started codebuild job for pr-test

@dpatil-magento
Copy link
Contributor

run cypress

@pwa-test-bot
Copy link

pwa-test-bot bot commented Sep 1, 2022

Successfully started codebuild job for cypress

@dpatil-magento
Copy link
Contributor

dpatil-magento commented Sep 1, 2022

Now screen reader announce list items but still there are things like Kebab menu just say button instead of informative text. But its not part of this ticket so merging it once CI jobs pass.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
pkg:venia-ui Progress: done version: Patch This changeset includes backwards compatible bug fixes.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Issue] AC-2493::Items within actions menu are not operable for keyboard-only…
5 participants