The purpose of each input field collecting information about the user can be programmatically determined when:
- The input field serves a purpose identified in the Input Purposes for User Interface Components section; and
- The content is implemented using technologies with support for identifying the expected meaning for form input data.
Identify Input Purpose (WCAG Definition)
Who is it for?
The purpose of this requirement is to make it faster and easier to fill out forms for people with cognitive and mobility disabilities.
As someone with pretty severe ADHD, I love the autofill feature. It reduces the amount of mistakes that I make when I fill out a form. All I need to do is verify, fill in a few custom inputs and submit the form.
What’s important to know?
The most important thing to know about this is that the autocomplete should only be added to inputs that deal with information specifically related to the individual.
Not every form input will need to have this added to it. If it doesn’t specifically relate the an individual or there is no correlating item in the Input Purposes for User Interface Components section, then you are not required to add an autocomplete attribute.
How do I code it?
When it is required, add the autocomplete to the input with the corresponding input purpose value.
Codepen with some Input Purpose examples
How to test it?
- Does the form input collect information about the user? Yes, continue. No, the input passes as “not applicable”.
- Does the purpose of the input exist in the Input Purposes for User Interface Components section? Yes, continue. No, the input passes as “not applicable”.
- Does the input have a well formed autocomplete attribute with a valid value? Yes, continue. No, mark as failed.
- Is the autocomplete value the correct value for the purpose of the input? Yes, pass. No mark as failed.