Analyze and validate forms on web pages. Use when users ask to check form accessibility, verify form labels, audit input fields, check form validation, or analyze form UX. Detects missing labels, invalid input types, accessibility issues, and validation problems.
name: check-forms
description: Analyze and validate forms on web pages. Use when users ask to check form accessibility, verify form labels, audit input fields, check form validation, or analyze form UX. Detects missing labels, invalid input types, accessibility issues, and validation problems.
argument-hint: [URL]
allowed-tools: Bash(bun:*), Read, WebFetch
Check Forms
Analyze and validate forms on web pages for accessibility and UX compliance.
Quick Start
cd /path/to/html-checker/scripts
bun src/check-forms.ts <URL>
CLI Options
Option
Short
Default
Description
--verbose
-v
false
Show all form elements
--json
-j
false
Output results as JSON
Checks Performed
Check
Severity
Description
Missing label
Error
Input has no associated label
Empty label
Error
Label exists but has no text
Missing id
Warning
Input has no id for label association
Placeholder as label
Warning
Using placeholder instead of label
Missing required
Info
Required field without required attribute
Invalid input type
Warning
Using text for email/phone/date fields
Missing autocomplete
Info
No autocomplete for common fields
No submit button
Warning
Form has no submit mechanism
Missing form action
Warning
Form has no action attribute
Missing method
Info
Form has no method (defaults to GET)
Usage Examples
# Basic check
bun src/check-forms.ts https://example.com
# Verbose output
bun src/check-forms.ts https://example.com --verbose
# JSON output
bun src/check-forms.ts https://example.com --json
Output Example
Form Analysis for https://example.com
Summary:
Total Forms: 2
Total Inputs: 12
Issues Found: 6
Form 1: Login Form
Inputs: 3 (email, password, submit)
[OK] All inputs have labels
[WARNING] Password field missing autocomplete="current-password"
Form 2: Contact Form
Inputs: 9 (name, email, phone, subject, message, checkbox, submit)
[ERROR] Phone input missing label
[WARNING] Email using type="text" instead of type="email"
[WARNING] Phone using type="text" instead of type="tel"
[INFO] Missing autocomplete on name field
Issues:
[ERROR ] Missing label for input at position 5
<input type="text" name="phone" placeholder="Phone">
[WARNING] Wrong input type at position 4
<input type="text" name="email"> should be type="email"
Recommendations:
- Add <label for="phone">Phone</label> to input
- Change input type to "email" for email fields
- Change input type to "tel" for phone fields
- Add autocomplete attributes for better UX
Accessibility (WCAG)
SC 1.3.1: Labels must be programmatically associated
SC 3.3.2: Labels or instructions required for inputs
SC 4.1.2: Name, role, value must be exposed
Best Practices
Every input needs a visible label (not just placeholder)
Use appropriate input types (email, tel, date, number)
Add autocomplete for common fields
Mark required fields with required attribute and visual indicator