[Adaptive Cards - Restaurant Order.JSON] - Ensures every form element has a label (.ac-input.ac-multichoiceInput.ac-choiceSetInput-filtered)
vagpt opened this issue · 0 comments
Target Platforms
Other
SDK Version
1.6
Application Name
Adaptive Cards
Problem Description
Test Environment:
URL: https://adaptivecards.io/
OS Version: Dev (OS Build 27695.1000)
Browser Version: Version 130.0.2849.1 (Official build) dev (64-bit)
Tool: Accessibility Insight For Web
Repro steps:
- Open the above URL in the edge dev browser.
- Navigate to the 'Sample' option and press enter key to activate it.
- Press tab key and navigate to the 'Restaurant order' link and press enter key to activate it.
- Run the tool and observe the issue.
Actual Result:
Form field present under 'Malt & Vine order form' does not have a label.
Expected Result:
Ensures every form element has a label (.ac-input.ac-multichoiceInput.ac-choiceSetInput-filtered)
Element path:
#__ac-aa99fbc6-f4f6-4386-a239-70f1fe2b9a88 > .ac-input.ac-multichoiceInput.ac-choiceSetInput-filtered
Snippet:
How to fix:
Fix any of the following:
Form element does not have an implicit (wrapped)
Form element does not have an explicit
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
Element has no placeholder attribute
Element's default semantics were not overridden with role="none" or role="presentation"
User Impact:
It will impact the screen reader user if the form field does not have proper label due to this user will not able to know about the form field.
WCAG Reference:
https://www.w3.org/WAI/WCAG21/Understanding/name-role-value.html
Have feedback to share on Bugs ? please tag bug as “A11yRCA” and add your feedback in the comment section
Screenshots
Card JSON
NA
Sample Code Language
No response
Sample Code
No response