[a11y]: ai-chat should not only use placeholder text to convey instructions #879
Description
Browser
No response
Operating System
No response
Package version
0.18.0
React version
18.3.1
Automated testing tool and ruleset
n/a
Assistive technology
JAWS
Description
The User instruction given with in the Chat Edit Field is presented in "Place holder" which is not a standard practice as per Accessibility standards , also the same is not descriptive.
Recommended fix: Placeholder is not a recommended method of conveying info as per accessibility standards , avoid the same :1. Provide a clear, descriptive, instruction as a visible label or helper text that sets the user’s expectation, e.g. “Type your queries related to IBM Cloud ".
Programmatically associate the instruction with the chat input field using appropriate Technics.
User impact: Impact Screen reader , Keyboard-only and cognitive users: Because the placeholder disappears on typing, they lose access to the instruction once they begin entering text, leading to uncertainty or errors.
WCAG 2.1 Violation
WCAG Mapping: 3.3.2 Labels or Instruction
Reproduction/example
n/a
Steps to reproduce
- make sure JAWS is active
- open ai-chat
- ask a question
- see that the instruction "type something..." is given only as placeholder
Code of Conduct
- I agree to follow this project's Code of Conduct
- I checked the current issues for duplicate problems