# Event Form Validation Test Checklist

**Last Updated:** 2026-01-28

## Overview

This document provides a comprehensive test checklist for validating the event form's validation logic, form reset behavior, and dropdown functionality. Use this checklist when making changes to form validation or reset logic.

## Pre-Testing Setup

1. **Start local server:**

   ```bash
   # Ensure PHP server is running on port 8003
   php -S localhost:8003
   ```

2. **Open form page:**
   - Navigate to: `http://localhost:8003/events/internorga-2026-tablet`
   - Or use any event form page

3. **Open browser DevTools:**
   - Press F12 or right-click → Inspect
   - Open Console tab for error checking
   - Open Elements tab for DOM inspection

## Test Categories

### 1. Email Validation Tests

#### Test 1.1: Empty Required Field

- [ ] Clear email field
- [ ] Click outside field (blur event)
- [ ] **Expected:** Error message "E-Mail ist erforderlich" shown
- [ ] **Expected:** Field has red border (`.error` class)
- [ ] **Expected:** No success icon visible

#### Test 1.2: Invalid Email Formats

Test each invalid format:

- [ ] `test@example` (no TLD)
- [ ] `test@example.` (trailing dot)
- [ ] `test@` (missing domain)
- [ ] `@example.com` (missing local part)
- [ ] `test.example.com` (missing @)
- [ ] `test@example..com` (double dot)
- [ ] `test@.example.com` (leading dot in domain)
- [ ] **Expected:** Error message shown for each
- [ ] **Expected:** Field has red border
- [ ] **Expected:** No success icon

#### Test 1.3: Valid Email Formats

Test each valid format:

- [ ] `test@example.com` (simple)
- [ ] `test.user@example.com` (dot in local part)
- [ ] `test+tag@example.com` (plus sign)
- [ ] `test_user@example.co.uk` (subdomain, multi-part TLD)
- [ ] `user.name+tag@subdomain.example.com` (complex)
- [ ] **Expected:** Green checkmark shown for each
- [ ] **Expected:** Field has green border (`.valid` class)
- [ ] **Expected:** Success icon visible
- [ ] **Expected:** No error message

#### Test 1.4: Email Validation on Input

- [ ] Type invalid email → blur
- [ ] **Expected:** Error shown
- [ ] Fix to valid email → blur
- [ ] **Expected:** Error cleared, success shown
- [ ] Clear field → blur
- [ ] **Expected:** Error shown (required field)

### 2. Phone Validation Tests

#### Test 2.1: Empty Optional Field

- [ ] Clear phone field
- [ ] Click outside field (blur event)
- [ ] **Expected:** No error message
- [ ] **Expected:** Hint shown (if hint element exists)
- [ ] **Expected:** No validation state (no error, no success)

#### Test 2.2: Valid German Numbers

Test each valid format:

- [ ] `+49 123 456789` (11 digits - minimum)
- [ ] `+49 123 4567890` (12 digits)
- [ ] `+49 123 45678901` (13 digits)
- [ ] `0049 123 456789` (00 prefix)
- [ ] **Expected:** Green checkmark shown
- [ ] **Expected:** Field has green border
- [ ] **Expected:** Success icon visible
- [ ] **Expected:** No error message

#### Test 2.3: Invalid German Numbers

Test each invalid format:

- [ ] `+49 123 45678` (too short - 10 digits)
- [ ] `+49 123 456789012345` (too long - 17 digits)
- [ ] `+49 123` (too short - 5 digits)
- [ ] `+49 abc 456789` (contains letters)
- [ ] **Expected:** Error message shown
- [ ] **Expected:** Field has red border
- [ ] **Expected:** No success icon

#### Test 2.4: Valid International Numbers

Test each valid format:

- [ ] `+1 123 4567890` (US format)
- [ ] `+44 20 1234 5678` (UK format)
- [ ] `1234567890` (10 digits)
- [ ] **Expected:** Green checkmark shown
- [ ] **Expected:** Field has green border
- [ ] **Expected:** Success icon visible

#### Test 2.5: Invalid International Numbers

Test each invalid format:

- [ ] `123456789` (too short - 9 digits)
- [ ] `1234567890123456` (too long - 16 digits)
- [ ] **Expected:** Error message shown
- [ ] **Expected:** Field has red border

### 3. Form Reset Tests

#### Test 3.1: Validation State Clearing

- [ ] Fill form with valid data (email, phone, all fields)
- [ ] Trigger validation (blur fields or submit)
- [ ] **Verify:** Fields show green checkmarks
- [ ] **Verify:** Success icons visible
- [ ] Submit form successfully
- [ ] Click "Add Another" or change owner
- [ ] **Expected:** All fields empty
- [ ] **Expected:** No green checkmarks visible
- [ ] **Expected:** No success icons visible
- [ ] **Expected:** No `.valid` classes on fields
- [ ] **Expected:** No `aria-invalid` attributes

#### Test 3.2: Error State Clearing

- [ ] Fill form with invalid data (invalid email, etc.)
- [ ] Trigger validation
- [ ] **Verify:** Error messages shown
- [ ] **Verify:** Fields have red borders
- [ ] Submit form (will fail validation)
- [ ] Fix errors and submit successfully
- [ ] Click "Add Another"
- [ ] **Expected:** No error messages visible
- [ ] **Expected:** No `.error` classes on fields
- [ ] **Expected:** No error elements visible

#### Test 3.3: Field Value Clearing

- [ ] Fill all form fields (text inputs, textareas, dropdowns)
- [ ] Submit form successfully
- [ ] Click "Add Another"
- [ ] **Expected:** All text inputs empty
- [ ] **Expected:** All textareas empty
- [ ] **Expected:** Dropdowns reset to first option (except owner)
- [ ] **Expected:** Checkboxes unchecked
- [ ] **Expected:** Owner dropdown preserved (if applicable)

#### Test 3.4: Multiple Resets

- [ ] Fill and submit form
- [ ] Click "Add Another"
- [ ] Fill and submit form again
- [ ] Click "Add Another"
- [ ] Repeat 3-5 times
- [ ] **Expected:** Form resets correctly each time
- [ ] **Expected:** No validation states persist
- [ ] **Expected:** No console errors
- [ ] **Expected:** No memory leaks (check DevTools → Performance)

### 4. Dropdown Functionality Tests

#### Test 4.1: Initial Load

- [ ] Load form page
- [ ] **Expected:** All dropdowns visible
- [ ] **Expected:** Dropdowns show first option or placeholder
- [ ] Click each dropdown
- [ ] **Expected:** Dropdown menu opens
- [ ] **Expected:** Options are clickable
- [ ] Select an option
- [ ] **Expected:** Dropdown closes
- [ ] **Expected:** Selected value displayed
- [ ] **Expected:** Hidden input updated

#### Test 4.2: After Form Reset

- [ ] Fill form and submit
- [ ] Click "Add Another"
- [ ] **Expected:** Dropdowns reset to first option
- [ ] Click each dropdown
- [ ] **Expected:** Dropdown menu opens
- [ ] **Expected:** Options are clickable
- [ ] Select an option
- [ ] **Expected:** Dropdown closes
- [ ] **Expected:** Selected value displayed
- [ ] **Expected:** Hidden input updated

#### Test 4.3: Keyboard Navigation

- [ ] Focus dropdown button
- [ ] Press Enter or Space
- [ ] **Expected:** Dropdown opens
- [ ] Press Arrow Down
- [ ] **Expected:** Next option focused
- [ ] Press Arrow Up
- [ ] **Expected:** Previous option focused
- [ ] Press Enter
- [ ] **Expected:** Option selected, dropdown closes
- [ ] Press Escape
- [ ] **Expected:** Dropdown closes without selection

#### Test 4.4: Multiple Resets

- [ ] Fill form and submit
- [ ] Click "Add Another"
- [ ] Test dropdowns work
- [ ] Fill form and submit again
- [ ] Click "Add Another"
- [ ] Test dropdowns work again
- [ ] **Expected:** Dropdowns work correctly after each reset
- [ ] **Expected:** No duplicate event listeners (check DevTools → Elements → Event Listeners)

### 5. Integration Tests

#### Test 5.1: Complete Form Flow

- [ ] Load form page
- [ ] Fill all required fields with valid data
- [ ] **Expected:** All fields validate correctly
- [ ] Submit form
- [ ] **Expected:** Success message shown
- [ ] Click "Add Another"
- [ ] **Expected:** Form resets completely
- [ ] **Expected:** No validation states visible
- [ ] Fill form again with different data
- [ ] Submit form
- [ ] **Expected:** Second submission successful
- [ ] **Expected:** No errors or issues

#### Test 5.2: Error Recovery Flow

- [ ] Fill form with invalid data
- [ ] Submit form
- [ ] **Expected:** Validation errors shown
- [ ] Fix errors
- [ ] **Expected:** Errors clear as fields become valid
- [ ] Submit form
- [ ] **Expected:** Success message shown
- [ ] Click "Add Another"
- [ ] **Expected:** Form resets cleanly
- [ ] **Expected:** No error states persist

#### Test 5.3: Owner Change Flow

- [ ] Fill form and submit
- [ ] Click "Change Owner" (if available)
- [ ] Select different owner
- [ ] **Expected:** Form resets
- [ ] **Expected:** New owner selected
- [ ] **Expected:** All validation states cleared
- [ ] **Expected:** Dropdowns work correctly

### 6. Automated Testing

#### Test 6.1: Python Validation Tests

```bash
python3 v2/scripts/test-event-form-validation.py
```

- [ ] **Expected:** All email tests pass
- [ ] **Expected:** All phone tests pass
- [ ] **Expected:** Exit code 0

#### Test 6.2: Browser Console Tests

1. Load form page
2. Open browser console (F12)
3. Load test script:
   ```javascript
   // Copy contents of v2/scripts/test-event-form-validation-reset.js
   ```
4. Run: `testEventFormValidationReset()`

- [ ] **Expected:** All tests pass
- [ ] **Expected:** No failures reported
- [ ] **Expected:** Summary shows all checks passed

### 7. Edge Cases

#### Test 7.1: Rapid Submissions

- [ ] Submit form
- [ ] Immediately click "Add Another"
- [ ] Immediately fill and submit again
- [ ] Repeat 5 times rapidly
- [ ] **Expected:** No race conditions
- [ ] **Expected:** All submissions successful
- [ ] **Expected:** Form resets correctly each time

#### Test 7.2: Browser Navigation

- [ ] Fill form (don't submit)
- [ ] Press browser back button
- [ ] Press browser forward button
- [ ] **Expected:** Form state handled correctly
- [ ] **Expected:** No validation state issues

#### Test 7.3: Browser Autofill

- [ ] Use browser autofill to fill form
- [ ] **Expected:** Validation triggers correctly
- [ ] **Expected:** Valid fields show success state
- [ ] Submit form
- [ ] Click "Add Another"
- [ ] **Expected:** Form resets correctly
- [ ] **Expected:** No validation states persist

#### Test 7.4: Form Reset During Validation

- [ ] Start typing in email field
- [ ] Before blur, click "Add Another" (if form was previously submitted)
- [ ] **Expected:** Form resets correctly
- [ ] **Expected:** No validation state issues

## Test Results Template

```
Test Date: YYYY-MM-DD
Tester: [Name]
Browser: [Browser + Version]
PHP Version: [Version]

Results:
- Email Validation: ✅ Pass / ❌ Fail
- Phone Validation: ✅ Pass / ❌ Fail
- Form Reset: ✅ Pass / ❌ Fail
- Dropdown Functionality: ✅ Pass / ❌ Fail
- Integration Tests: ✅ Pass / ❌ Fail
- Edge Cases: ✅ Pass / ❌ Fail

Issues Found:
1. [Description]
2. [Description]

Notes:
[Any additional observations]
```

## Quick Test Commands

```bash
# Run Python validation tests
python3 v2/scripts/test-event-form-validation.py

# Check for console errors (manual)
# Open browser console and check for errors

# Test form reset (manual)
# Use browser console script: testEventFormValidationReset()
```

## Related Documentation

- [Event Form Implementation Guide](EVENT_FORM_IMPLEMENTATION.md)
- [Form Configuration Reference](FORM_CONFIGURATION_REFERENCE.md)
- [Duplicate Prevention Testing](DUPLICATE_PREVENTION_TESTING.md)
