User stories
The following user stories can be used to understand when this component should be used, and how to know when it's been implemented correctly.
- As someone using the component, I want to be able to understand the information required from me.
- As someone with a cognitive disability, I want to be able to understand if any personal information is required, for example whether it's my full address.
- As someone with a cognitive disability, I want to be able to understand any errors related to the text area field, as well as how to resolve the error.
- As a keyboard-only user, I want to be able to navigate to the text area field using the Tab key.
- As a screen reader user, I want the label relating to the text area field to be announced when navigating to the field.
- As a screen reader user, I want the hint text provided alongside the text area field's label to be announced when navigating to the field.
- As a screen reader user, I want any error messages relating to the text area field to be announced when they become present.
- As a voice-control user, I want to be able to navigate to the text area field using the associated label.
Test steps
Use these steps to check that the Textarea field component has been implemented correctly:
- Turn on a screen reader.
- Navigate to the text area field using the Tab key.
- Verify that the text area field has a visible label.
- Verify that a name for the text area field is announced and that it includes the visible label.
If any errors appear when the form is validated, complete the following checks:
- Turn on a screen reader.
- Navigate to the text area field using the Tab key.
- Verify that once the text area field receives focus, that there is an announcement to convey that there is an error with this field.
|
Accessibility checklist |
|
|---|---|
|
User stories |
✅ |