🧪 Comprehensive UI Testing Playground

Complete collection of HTML form elements and interactive components for automation testing

📝 Basic Form Elements

📅 Date, Time & Number Inputs

Birth Date: Appointment Time: Meeting Date & Time: Birth Month: Academic Week: Age: Salary Range (USD): $75,000 Favorite Color:

🔽 Selection & Choice Elements

Country: Programming Languages (Multiple): Skills (with optgroups):

☑️ Checkboxes & Radio Buttons

Interests (Multiple Choice) Programming UI/UX Design Digital Marketing Music Production Game Development Artificial Intelligence

Experience Level (Single Choice) Beginner (0-1 years) Intermediate (2-5 years) Advanced (5-10 years) Expert (10+ years)

Employment Status Full-time Part-time Freelance Looking for work Student

Subscribe to our newsletter I agree to the Terms & Conditions

📁 File Upload Elements

Profile Picture: Resume/CV (PDF only): Portfolio Files (Multiple): Documents (Any type):

🔘 Button Variations

🎛️ Advanced Input Types

Hidden Field: Hidden input (value: secret-value) Read-only Field: Progress Bar: 45% 45% Meter/Gauge: 70% Disk usage: 70% Data List (with autocomplete): Custom Range with Steps: 50

🎯 Interactive Elements

Personal Information

First Name: Last Name: Middle Initial:

Professional Information

Job Title: Company: Years of Experience:

Preferences

Theme: Language:

🎯 Drag & Drop

Drag me to Zone 1

Drag me to Zone 2

Drag me anywhere

Drop Zone 1
Only accepts item 1

Drop Zone 2
Only accepts item 2

Universal Drop Zone
Accepts any item

📊 Interactive Data Table

ID	Name	Status
1	Alice Johnson	Active
2	Bob Smith	Pending
3	Charlie Brown	Inactive

📋 Accordion/Collapsible Content

📧 Contact Information

Email: Phone: Address:

🎓 Education & Certifications

Highest Degree: Field of Study: Graduation Year: Certifications:

💼 Work History

Current Position: Previous Company:

Employment Gap: No gaps Short gap (< 6 months) Long gap (> 6 months)

📋 Lists & Navigation

Unordered List:

JavaScript Programming
UI/UX Design
Database Management
Project Management
Quality Assurance

Ordered List (Priorities):

Code Quality
User Experience
Performance
Security
Maintainability

Definition List:

Frontend: User interface and experience development
Backend: Server-side logic and database management
DevOps: Development operations and infrastructure

🖼️ Embedded Content

Iframe Example:

Tooltip Elements:

This is a tooltip example This is a helpful tooltip message that appears on hover! that you can test hover interactions on.

Details/Summary (Collapsible):

Click to expand details

This content is hidden by default and can be expanded by clicking the summary. This is useful for FAQ sections or detailed information that users can choose to view.

Hidden Input:

🚀 TIER 1 & TIER 2 Testing Elements

🎯 Smart Locator Elements

Test ID Input: Test ID Button: Test ID Select: Search Test: Comment Box:

🖼️ Image Elements with Alt Text

Logo Upload: Banner Image:

🌐 Network & API Testing

API Response will appear here...

🖼️ Multiple Frame Testing

Frame 1 (Example):

Frame 2 (Form):

📱 Device Emulation Testing

Screen Width: Unknownpx

Screen Height: Unknownpx

User Agent: Unknown

Touch Support: Unknown

Location info will appear here...

⏳ Advanced Waiting Testing

Delayed content will appear here...

⌨️ Keyboard & Input Testing

Keyboard Test Area:

Key events will appear here...

File Upload Testing: Multi-step Form:

🧩 Additional UI Components

Enable Feature: Off Rate Your Experience:

☆ ☆ ☆ ☆ ☆

Tags (comma separated):

Automation UI Node.js

Let me know if you’d like icons, tooltips, or event handlers wired up for each!