search

microsoft / moaw

Grab-and-go resources to help you learn new skills, with all the tools you need to create, host and share your own workshop
https://aka.ms/moaw
Creative Commons Attribution Share Alike 4.0 International
103 stars 77 forks source link

"Workshop", "Contribute" and "Github" link is not visible on applying reflow settings(320px*256px): A11y_Maow_Home Page_Reflow #111

Closed AnKushSingh05 closed 4 months ago

AnKushSingh05 commented 5 months ago

GitHub Tags

A11yTCS; #A11ySev2; #Win11; #GH_Maow_Web_Mar24; #DesktopWeb; #Maow; #Reflow: #A11YWCAG2.1; #A11yMAS; #WCAG1.4.10;#Closed;

Environment Details:

Application Name: Maow

URL: https://moaw.dev/

Operating system: Windows 11 Enterprise Insider Preview 22H2 (OS build 25324.1000) Microsoft Edge: Version 118.0.2048.1 (Official build) dev (64-bit)

Pre-requisites:

  1. Open Chrome/Edge dev Inspect tools. Keyboard shortcut "Ctrl+Shift+I"
  2. Ensure devtools are customized to Dock location: "undock into separate window". Minimize devtools so they are not obscuring the page.
  3. Zoom the browser window of the page to be tested to 200%.
  4. Adjust the browser window's height and width to the required viewport of 320px*256px.
  5. After Refresh the browser window.

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://moaw.dev/
  2. Moaw screen will get open.
  3. TAB till Github link.
  4. Verify that "Workshop", "Contribute" and "Github" link is not visible on applying reflow settings(320px*256px) or not.

Actual:

"Workshop", "Contribute" and "Github" link is not visible on applying reflow settings(320px*256px)

Expected:

"Workshop", "Contribute" and "Github" link should be visible on applying reflow settings(320px*256px)

User Impact:

Low vision users will not be able to see the links if not visible after applying the reflow.

Attachment:

Bug_111

sinedied commented 4 months ago

@AnKushSingh05 this one has been fixed, could you validate it?

AnKushSingh05 commented 3 months ago

Verified the issue in below environment https://moaw.dev/ Issue is fixed. Hence closing the bug

Uploading Bug_fixed_111.mp4…

sinedied commented 3 months ago

:tada: This issue has been resolved in version 1.5.0 :tada:

The release is available on npm package (@latest dist-tag)

Your semantic-release bot :package::rocket: