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

[m2-assistant[bot]]

trafficstars

This issue is automatically created based on existing pull request: magento/pwa-studio#3791: AC-2493::Items within actions menu are not operable for keyboard-only…

---

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.

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.

[supernova-at]

@magento export issue to JIRA project PWA as Story

[github-jira-sync-bot]

:white_check_mark: Jira issue https://jira.corp.magento.com/browse/PWA-2814 is successfully created for this GitHub issue.