What a form submission test should cover
A complete form test covers more than the happy path. It should verify that required field validation fires correctly, that error messages are visible and accurate, that submission succeeds when all fields are valid, and that the post-submission state (confirmation message, redirect, data persistence) is correct.
Testing only the happy path gives a false sense of coverage. Real users submit incomplete forms, enter invalid data, and encounter edge cases. A test suite that only checks the success path will miss the validation logic that users encounter on almost every form interaction.
- Happy path: all valid fields, successful submission, correct confirmation state
- Validation: required field errors, format validation, field-level error messages
- Edge cases: maximum field lengths, special characters, concurrent submissions
- Post-submission: redirect, confirmation message, or updated data state
The Assert scenario approach
In Assert, a form test is written as a plain-English scenario that describes what the user does and what they should see. The scenario covers the happy path, validation state, and success confirmation without requiring any Playwright API knowledge from the scenario author.
## Contact form — successful submission - Navigate to /contact - Assert the page heading says "Get in Touch" - Click in the Name field and type "Jane Smith" - Click in the Email field and type "jane@example.com" - Click in the Message field and type "Testing the contact form end to end." - Click "Send Message" - Assert a success message is visible - Assert the success message contains "We'll be in touch" ## Contact form — required field validation - Navigate to /contact - Click "Send Message" without filling any fields - Assert the Name field shows a required error - Assert the Email field shows a required error - Assert the Message field shows a required error - Assert the form has not been submitted
FAQ
How do I test form validation in Playwright?
Fill in the form partially or not at all, trigger the submit action, and assert that the appropriate error messages are visible using Playwright's getByText or getByRole locators. Use await expect(page.getByText('This field is required')).toBeVisible() rather than checking the DOM directly, as Playwright's expect retries automatically.
How do I test file upload in Playwright?
Use page.setInputFiles() to set a file on an input element, or page.locator('input[type=file]').setInputFiles(filePath) with a path to a test fixture file. For drag-and-drop upload areas, Playwright supports dispatching drag events on the drop zone.
How do I test form submission that triggers an API call?
Use page.waitForResponse() to wait for the specific API endpoint to respond after form submission. Assert on both the UI state (confirmation message) and optionally intercept the request with page.route() to verify the correct payload was sent.
Put the workflow in your repo, not in a chat transcript
Assert is strongest when scenarios become durable project assets: readable Markdown in the repo, generated execution underneath, and result inspection in the dashboard.