[Programmatic Access - Make code - Image]: Accessible name is not defined for the <iframe> content which is present on the page.

[vroopea]

User Experience:

People with good vision can glance at a or <iframe> element to get a good idea of its content. People who use assistive technologies rely on the frame’s accessible name to determine whether it contains information relevant to their current needs.

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

Repro Steps:

1. Launch application URL: https://arcade.makecode.com/types/image.
2. Image page will open.
3. Navigate to 'Transparency and overlap' section.
4. Turn on the AI (Accessibility insights for web) and observe whether accessible name is defined for the <iframe> content or not.

Actual Result:

Issue: Accessible name is not defined for the <iframe> content which is present on the page.

Expected Result:

Accessible name should be defined for the <iframe> content which is present on the page.

Example: Aria-label="Transparent pixels from the image on top." can be defined for the <iframe'.

Issue:

Ensure <iframe> and elements have an accessible name (frame-title - https://accessibilityinsights.io/info-examples/web/frame-title)

Target application:

Image - https://arcade.makecode.com/types/image

Element path:

iframe

Snippet:

<iframe style="position:absolute;top:0;left:0;width:100%;height:100%;" allowfullscreen="allowfullscreen" frameborder="0" sandbox="allow-popups allow-forms allow-scripts allow-same-origin" src="/---run#nofooter=1" data-code="let%20greenBall%20%3D%20img%60%0A.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20%0A.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20%0A.%20.%20.%20.%20.%20.%206%206%206%206%20.%20.%20.%20.%20.%20.%20%0A.%20.%20.%20.%206%206%206%206%206%206%206%206%20.%20.%20.%20.%20%0A.%20.%20.%206%206%206%206%206%206%206%206%206%206%20.%20.%20.%20%0A.%20.%20.%206%206%206%206%206%206%206%206%206%206%20.%20.%20.%20%0A.%20.%206%206%206%206%206%206%206%206%206%206%206%206%20.%20.%20%0A.%20.%206%206%206%206%206%206%206%206%206%206%206%206%20.%20.%20%0A.%20.%206%206%206%206%206%206%206%206%206%206%206%206%20.%20.%20%0A.%20.%206%206%206%206%206%206%206%206%206%206%206%206%20.%20.%20%0A.%20.%20.%206%206%206%206%206%206%206%206%206%206%20.%20.%20.%20%0A.%20.%20.%206%206%206%206%206%206%206%206%206%206%20.%20.%20.%20%0A.%20.%20.%20.%206%206%206%206%206%206%206%206%20.%20.%20.%20.%20%0A.%20.%20.%20.%20.%20.%206%206%206%206%20.%20.%20.%20.%20.%20.%20%0A.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20%0A.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20.%20%0A%60%0Alet%20yellowSquare%20%3D%20image.create(16%2C%2016)%0AyellowSquare.fill(14)%0A%0Alet%20yellowSprite%20%3D%20sprites.create(yellowSquare)%0Alet%20greenSprite%20%3D%20sprites.create(greenBall)">

How to fix:

Fix any of the following:

• Element has no title attribute
• 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's default semantics were not overridden with role="none" or role="presentation"

MAS Reference:

MAS 4.1.2 – Name, Role, Value

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

frame-title

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://arcade.makecode.com/types/image

Attachment:

[vroopea]

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