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

[Programmatic Access - Make code - Home Page]: Accessible name is not defined for the 'Link' present under ''Plant watering' button. #6087

Open
vroopea opened this issue Feb 13, 2025 · 1 comment

Comments

@vroopea
Copy link

vroopea commented Feb 13, 2025

User Experience:

Visually impaired people who depend on screen reader will get impacted if accessible name is not defined for the interactive elements present on the page. Due to which, the end users will not be able to know the purpose and cannot access it efficiently.

Note:
User credentials should NOT be included in the bug.

Repro Steps:

  1. Launch application URL: https://makecode.microbit.org/beta#
  2. Home page will open.
  3. Navigate to 'Science' section and expand it.
  4. Turn on the AI (Accessibility insights for web) and observe whether accessible name is defined for the 'Link' or not.

Actual Result:

Issue: Accessible name is not defined for the 'Link' present under ''Plant watering' button.

Expected Result:

Accessible name should be defined for the 'Link' present under ''Plant watering' button.

Example: Aria-label="Show instructions" can be defined for the link.

Issue:

Ensures links have discernible text (link-name - https://accessibilityinsights.io/info-examples/web/link-name)

Target application:

Microsoft MakeCode for micro:bit - https://makecode.microbit.org/beta#

Element path:

.attached[href$="plant-watering"][target="_blank"]:nth-child(1)

Snippet:

<a class="ui icon link button attached" href="/projects/plant-watering" target="_blank" rel="noopener noreferrer" role="presentation" tabindex="-1"><i class="icon file text " aria-hidden="true" role="presentation"></i></a>

How to fix:

Fix any of the following:

  • Element does not have text that is visible to screen readers
  • aria-label attribute does not exist or is empty
  • aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty
  • Element has no title attribute

MAS Reference:

MAS 4.1.2 – Name, Role, Value

ARIA Authoring Ref Link/Fluent Patterns Guidance /HITS Guidance:

NA

UIA/DOM details available:

Yes (Refer attachment)

Reference Links:

  • Accessibility Insights! - Identify accessibility bugs before check-in and make bug fixing faster and easier.
  • External Bug Process: If this bug belongs to an external team, mark it as resolved/done and assign it back to the tester with notes on where to file/route the bug. For more information, please use this External Bug Process (sharepoint.com). “HCL Staff should not log any third-party external bugs. Should be routed to EDAD team”.
  • Please reach out to C&AI Teams channel for any process-related queries.

Test Environment:

  • OS Version: Windows 11 24H2 (OS Build:26100.3037)
  • Browser: Chrome Version 132.0.6834.196 (Official Build) (64-bit)
  • Test Matrix: Chrome + NVDA
  • URL: https://makecode.microbit.org/.

Attachment:

Image
@vroopea
Copy link
Author

vroopea commented Feb 13, 2025

#Accessibility; #A11yAuto; #K4W; #A11yMAS; #A11ySev2; #MAS4.1.2; #HCL; #Benchmark; #Win11-Chrome; #WCP; #BM-HCL-MakeCode-Feb2025

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment