search

Azure / responsible-ai-hub

A "Responsible AI For Developers" hub to help developer audiences (students, entrepreneurs and professionals) discover workshop, events and resources that can help them learn and use Responsible AI concepts and resources effectively in their own projects.
https://aka.ms/rai-hub/website
MIT License
36 stars 20 forks source link

At reflow resolution "Workshops" and "Collections" control are not accessible using keyboard keys.:A11y_AzureResponsibleAIworkshop_Header_Keyboard. #51

Open PoojaNamde opened 5 months ago

PoojaNamde commented 5 months ago

"Check out Accessibility Insights! - Identify accessibility bugs before check-in and make bug fixing faster and easier."

Please do not close this bug. This bug should only be closed by Trusted Tester after verification.

Tags:

A11yTCS; #A11yMAS; #A11ySev2; #WCP; #Win11; #ChromiumEdge; #FTP; #DesktopWeb; #Azure Responsible AI workshop; #Feature_Azure Responsible AI workshop_Mar2024; #WCAG2.1.1; #Keyboard;

Environment Details:

Application Name: Azure Responsible AI workshop URL: https://azure.github.io/responsible-ai-hub Chromium Edge Version 124.0.2478.6 (Official build) dev (64-bit) Window Version: Win 11 OS Build: 22621.3085

Prerequisites:

  1. Open the web page / screen of the web application that is to be tested
  2. Open Chrome/Edge dev Inspect tools. Keyboard shortcut "Ctrl+Shift+I"
  3. Ensure devtools are customized to Dock location: "undock into separate window". Minimize devtools so they are not obscuring the page.
  4. Zoom the browser window of the page to be tested to 200%.
  5. Adjust the browser window's height and width to the required viewport of 320px*256px. As long as devtools remain open while resizing the viewport size will be displayed in the upper right corner of the browser so the size can be verified.

Alternatively:

  1. Change the OS display settings to a resolution of 1280x1024 at 100% dpi scaling.
  2. Open the web page / screen of the web application that is to be tested.
  3. Adjust the browser window’s zoom level to 400%.
  4. Set the browser to full screen. Keyboard shortcut "F11" key.
  5. If any browser sidebars are still visible (e.g., the Edge discover sidebar), these must be closed.

Repro Steps:

  1. Hit the URL: (https://azure.github.io/responsible-ai-hub/)
  2. Set the reflow resolution and navigate using TAB key.
  3. Observe the issue.

Actual Results:

At reflow resolution "Workshops" and "Collections" control are not accessible using keyboard keys.

Expected Results:

At reflow resolution "Workshops" and "Collections" controls should be accessible using keyboard keys

User Impact:

Low vision users with keyboard will not be able to access the control and will miss the information about it.

Attachment:

51_A11y_AzureResponsibleAIworkshop_Header_Keyboard.webm