# Input fields have appropriate type and autocomplete attributes

- **Pattern:** `ab-000122` (`accessibility-wcag.understandable.input-autocomplete`)
- **Severity:** low
- **Lifecycle:** active
- **Last modified:** 2026-04-18
- **Canonical URL:** https://auditbuffet.com/patterns/ab-000122
- **License:** CC-BY-4.0 — attribute to AuditBuffet Pattern Catalog (https://auditbuffet.com/patterns/ab-000122)

## Why it matters

Input fields without semantic `type` attributes and `autocomplete` tokens force users to manually re-enter information the browser already knows. For users with motor disabilities, dyslexia, or limited dexterity, autocomplete is not a convenience but a functional requirement. WCAG 2.2 SC 1.3.5 (Identify Input Purpose) is a Level AA requirement: input fields collecting personal data must use the standardized `autocomplete` attribute values from the HTML 5.2 spec so assistive technologies and password managers can populate them.

## Severity rationale

Low because missing autocomplete attributes degrade usability for motor-impaired users without completely blocking form access — a WCAG 2.2 SC 1.3.5 Level AA compliance gap.

## Remediation

Add the correct `type` and `autocomplete` attribute to every input that collects personal or contact information.

```tsx
{/* Identity */}
<input type="text" autoComplete="given-name" placeholder="First name" />
<input type="text" autoComplete="family-name" placeholder="Last name" />

{/* Contact */}
<input type="email" autoComplete="email" />
<input type="tel" autoComplete="tel" />

{/* Address */}
<input type="text" autoComplete="street-address" />
<input type="text" autoComplete="postal-code" />

{/* Auth */}
<input type="password" autoComplete="current-password" />
<input type="password" autoComplete="new-password" />
```

Search the codebase for `type="text"` inputs that collect email, phone, or name data — every one is a missing semantic type. Reference the WHATWG autocomplete token list for the full set of valid values.

## Detection

- **ID:** `input-autocomplete`
- **Severity:** `low`
- **What to look for:** Enumerate every relevant item. Check form input fields. Verify that they have `type` attributes matching their purpose (email, tel, date, number, etc.) and `autocomplete` attributes for common fields (email, name, address, phone).
- **Pass criteria:** At least 1 of the following conditions is met. Input fields have correct `type` attributes and `autocomplete` attributes for common fields.
- **Fail criteria:** Inputs lack type attributes or use `type="text"` for everything.
- **Skip (N/A) when:** The project has no forms.
- **Detail on fail:** Example: `"Email field uses <input type='text'> instead of type='email'. Phone field has no autocomplete attribute"`
- **Remediation:** Use semantic input types:

  ```tsx
  <input type="email" autocomplete="email" />
  <input type="tel" autocomplete="tel" />
  <input type="date" autocomplete="bday" />
  <input type="number" autocomplete="cc-exp-year" />
  ```

## External references

- wcag 1.3.5
- section-508 501.1

Taxons: accessibility

HTML version: https://auditbuffet.com/patterns/ab-000122