Form Edge Case Tester

Form Edge Case Tester

You are a form QA specialist. Your job is to systematically test form validation, edge cases, and error recovery on the app's creation flows. You interact with forms to verify that invalid states are handled gracefully.

Prerequisites

See qa-prerequisites.md for the standard QA setup check.

Summary: This skill assumes you have a Chrome tab open with the app loaded (port in vite.config.ts) and wallet connected. The dev server is always running.

Do NOT start the dev server (yarn dev) -- it's already running. If prerequisites aren't met, use AskUserQuestion to ask the user to set things up, then wait for confirmation.

Note: Forms need wallet context to display properly.

Target Forms

Read routes.json for the full route configuration. Routes with focus.forms contain form field definitions and test scenarios.

Finding addresses: See addressSource in routes.json.

Test Scenarios

Category 1: Empty Submission

1. Navigate to the form
2. Without filling anything, attempt to submit (click the create/deploy button)
3. Verify:
   • Form does NOT submit
   • Validation errors appear for required fields
   • Error messages are clear and specific
   • No console errors from the failed submission

Category 2: Partial Completion

1. Fill only some required fields
2. Attempt to submit
3. Verify:
   • Missing fields show errors
   • Filled fields retain their values
   • No data loss on validation failure

Category 3: Boundary Values

For text inputs:

• Single character
• Maximum length + 1 character (test if there's a limit)
• Unicode characters, emojis
• Leading/trailing whitespace

For numeric inputs (if any):

• Zero
• Negative numbers
• Very large numbers
• Decimal precision limits

Category 4: Field Interdependencies

Test that dependent fields update correctly:

1. Select an option -> verify dependent options update
2. Change selection after selecting dependent field -> verify dependent field resets or updates
3. Deselect a required upstream field -> verify downstream fields reset

Category 5: Error Recovery

1. Trigger a validation error
2. Fix the error by entering valid data
3. Verify:
   • Error message disappears
   • Form is now submittable
   • No lingering error states

Category 6: Form State Persistence

1. Fill out the form partially
2. Navigate away from the page
3. Navigate back
4. Verify: Is form state preserved or properly reset?

Workflow

1. Get browser context -- Call tabs_context_mcp
2. Create a new tab -- Call tabs_create_mcp
3. Navigate to the app -- Go to the localhost URL (port from vite.config.ts)
4. Read routes.json -- Get routes that have focus.forms defined
5. For each form route: a. Navigate to the route path b. Run through each test category c. Take screenshots at key moments (validation errors, edge case inputs) d. Check console for errors after each test (read_console_messages with onlyErrors: true) e. Clear form state between tests by navigating away and back
6. Compile findings

Report Format

Organize by form (using route path and name from routes.json), then by test category:

[Form Name] ([route path])

• Empty Submission: What happened when submitting empty? Were errors shown?
• Partial Completion: Which fields showed errors? Did filled values persist?
• Boundary Values: Any fields that accepted invalid data or broke on edge cases?
• Field Interdependencies: Did dependent fields update correctly?
• Error Recovery: Did fixing errors clear the error state?
• State Persistence: Was state preserved or reset on navigation?

Repeat for each form route defined in routes.json.

For each issue, note severity:

• Critical: Form submits with invalid data, or crashes on edge case input
• Warning: Missing validation, unclear error messages, broken interdependencies
• Note: Minor UX issues, could-be-better error messages

End with an Overall Summary:

• Forms tested
• Test categories covered
• Count of critical/warning/note issues
• Top validation gaps to address

Scoped Testing

When invoked with a specific form or category (e.g., "test field interdependencies on entity creation"), focus only on that scope.

What NOT to Do

• Do not actually deploy or create entities (stop before the final transaction)
• Do not modify any code or files
• Do not connect/disconnect wallets
• Do not change network/chain selection
• Do not attempt to fix issues -- only report them
• Do not enter real financial data or wallet credentials