30% off your first 3 months

Get the deal

Testing a web form before it goes live

by DuckyHelperNov 12, 20264 min read
Getting work done

TL;DR:

  • Test the form the way a real person would use it, including the mistakes they will make.

  • Check four things every time: required fields, error messages, phone screens and what happens after Submit.

  • Use test data you control, and check the submission actually arrived where it should.

A signup form that fails quietly costs you people you never hear from. They typed their details, pressed the button, saw nothing, and left. Testing it before it goes live takes about twenty minutes and catches most of those problems. You do not need technical skills: you need a list and a willingness to do things wrong on purpose.

Set up a safe test

  • Use test details you control: a name like "Test Person" and an email address you can read. The domain example.com is reserved for examples and never delivers, so use it only when you do not need the email.

  • Tell the person who receives submissions that testing is happening, so nobody follows up on a fake lead.

  • If the form can charge money or send a real message, check with whoever runs it whether there is a test mode before you submit.

  • Open the form on the real page address, not an editor preview, since previews can behave differently.

The four checks

Required fields

Leave everything empty and submit. You should see a clear message for each missing field, and the form should not send. Then fill in only some fields and repeat. Fields marked required should really be required, and fields that are optional should not block submission.

Error messages

Type something wrong on purpose: an email with no @, letters in a phone field, a very long name, a name with an apostrophe such as O'Brien or an accented letter. Each error should say what to fix in plain words ("Enter an email like name@site.com"), appear next to the field, and keep the rest of what you typed.

Mobile

Open the form on a real phone, not only a shrunken desktop window. Check that you can tap each field without zooming, the right keyboard appears (email fields should offer an @ key), the button is not hidden behind the keyboard, and nothing runs off the side of the screen.

Confirmation

After a good submission you should see a clear thank you message or page, and, if the form promises it, receive a confirmation email. Then confirm the submission arrived: open wherever it is supposed to land, such as a spreadsheet, inbox or contact list, and find your test entry with the right values in the right places.

Worked example: a checklist for a signup form

Imagine a newsletter signup with three fields: name, email, and a checkbox to agree to receive emails. This is the list to run, in order.

Test

What you do

Pass if

Empty submit

Click Submit with nothing filled

Messages on name and email, nothing sent

Bad email

Enter sam@ and submit

Message about the email, name kept

Unticked box

Fill name and email, leave the box unticked

Blocked with a clear note, if consent is required

Odd name

Enter Zoë O'Brien

Saved exactly as typed

Good entry

Fill everything correctly

Thank you message shown once

Double click

Click Submit twice fast

Only one entry arrives

Phone

Repeat the good entry on a phone

Fits screen, keyboard fine

Arrival

Look at where entries land

Entry present, fields in the right columns

Eight tests. Every one should pass before launch.

Count: eight rows, so eight ticks. If seven pass, the form is not ready. Write the failing test, what you saw, and a screenshot into one message for whoever can fix it.

Write down what you saw, not what you think is wrong. "After clicking Submit on the phone, the page stayed the same and no entry arrived" is a report someone can act on. "Form is broken" is not. Include the device, the browser, the exact text you typed and the time.

Retest after each fix. A fix for one field sometimes breaks another, so run the whole checklist again rather than only the line that failed. It takes minutes once the table is ready.

Mistakes to avoid

  • Only testing the happy path. Real people make typos and skip fields.

  • Testing in one browser. Try at least two, plus your phone.

  • Testing once and then changing the form. Run the checklist again after every change.

  • Forgetting where the data goes. A form that looks fine but sends nothing is the most common failure.

  • Leaving test entries behind. Delete them afterwards so they do not appear in reports or get emailed.

Doing it faster

Pick one afternoon before every launch for this checklist and give it a named owner. Forms tend to be tested once and then edited later without anyone looking again, so the rule that matters is: any change means a re-run.

Save the checklist table as a template and tick it each time. If you want help reading an error message on screen, DuckyHelper can see your screen and talk through what it means while you keep testing; there is a 10 minute trial with no card at download.

Frequently asked questions

Is it okay to test with my real email?

Yes, if you want to receive the confirmation and are fine being on the list. Remove yourself afterwards.

Can I test a form I did not build?

Only with the owner's permission. Submitting test entries to someone else's form can create mess for them.

Get started

DuckyHelper can
do more

It sees your screen and works in any app you use. Try it for 10 minutes, no card.

Get it for Mac, Windows or Linux

Share

Questions and jobs

Do anything

Ask it a question or hand it a job, in any app.

Doing jobs for you is in early access on Mac. Asking works on Mac, Windows and Linux.