I built my portfolio site as my first JavaScript project, working with an AI design partner for review. The live site and the repo are public. It has a contact form with custom validation: my own code checks each field and writes its own error message under it. This post is about one bug in that form, and the wrong place I went looking for it.

What I saw

A few days after I called the site finished, I was testing it on my phone. I typed an invalid email address, one with the wrong format, and pressed send. The message that appeared was not mine. It was the browser's own small tooltip, in the browser's wording and style.

I had written code for exactly this case, so I tried an empty email field to see whether my messages were broken everywhere or only in this one situation. With the field empty, my message appeared, in my wording, under the field.

At the time I read that as pointing at my format check.…