a11y.form input missing name

a11y.form-input-missing-name

Rule ID: a11y.form-input-missing-name Severity: WARN Category: a11y Target Standards: WCAG 2.2 Success Criterion 4.1.2 (Name, Role, Value - Level A), HTML5 Specification (Section 4.10.5 The input element & form submission), W3C Form Usability & Autofill Standards

---

1. Overview & Core Invariant

Ensures form input controls declare an identifying name or id attribute for form submission and autofill (WCAG 4.1.2)

Core Invariant:

"Form input controls (, , <textarea>) must declare an identifying 'name' or 'id' attribute."

---

2. Technical Grounding & Engine Realities

Browsers, password managers, and native form processors rely on 'name' and 'id' attributes to identify field context.

When form controls lack both 'name' and 'id':

1. Autofill Failure: Chrome, Safari, and password managers (1Password, Bitwarden) cannot identify whether an input is for email, username, or credit card, forcing users to type manually.
2. Silent Form Data Loss: Standard HTML submission constructs FormData from controls with a 'name' attribute. Inputs without 'name' are completely omitted from the payload.
3. Unidentifiable Tree Nodes: Screen readers and automated testing frameworks cannot reference or locate the input deterministically.

Charites flags form controls that fail to specify at least one identifying key ('name' or 'id').

---

3. Vulnerability & Risk Taxonomy

Risk Vector	Severity	Impact
Silent Form Submission Data Loss	HIGH	Form inputs without 'name' attributes are excluded from native FormData submissions.
Password Manager & Autofill Breakdown	MEDIUM	Browser autofill cannot populate user credentials, causing login drop-off.

---

4. Non-Compliant Code Patterns (Bad Examples)

TSX (Input missing both name and id attributes):

<input type="email" className="w-full border px-3 py-2" placeholder="nama@domain.com" />

ASTRO (Select dropdown without name or id identifier):

<select class="border p-2"><option value="id">Indonesia</option></select>

---

5. Compliant Implementation Patterns (Good Examples)

TSX (Properly identified input with matching name and id):

<input id="user-email" name="email" type="email" className="w-full border px-3 py-2" placeholder="nama@domain.com" />

ASTRO (Select dropdown with descriptive name and id):

<select name="country" id="country" class="border p-2"><option value="id">Indonesia</option></select>

---

6. How to Suppress (Ignore Directives)

If this pattern is required for an intentional exception, suppress the diagnostic using the canonical Charites Rule ID:

<!-- charites:ignore a11y.form-input-missing-name intentional exception -->

// charites:ignore a11y.form-input-missing-name intentional exception

---

7. Configuration Reference (charites.yaml)

rules:
  a11y.form-input-missing-name:
    severity: warn # error | warn | info | off

---

8. Architectural Domain & Verification Reference

• Domain Architecture & Analysis Pipeline: See the a11y Category Guide.
• 1-SSOT Golden Tri-Corpus Test Matrix: See the Verification Harness on the Master Home page.
• Rule Catalog Index: See Master Wiki Home.