This UI design pattern keeps coming up and I'm wondering whether there are any best practices out there that can improve the quality of my solution.
The pattern is: type your email (or password), re-type to confirm in another field. Now I know that some consider this an anti-pattern, but that's not what's up for debate right now, as I'm locked into customer requirements.
This is mobile design, so we have to consider convenience affordances like a "Next" button on the soft keyboard when in field 1 but just a "done" button when in field 2.
We also want error messages to come up when the two fields don't match BUT perhaps not on first run, when the second field is empty because you just haven't gotten to it. An automatic error message that you can't avoid is just annoying.
But we also have the (edge) case where the user has already filled both fields and for some (obscure) reason has cleared one of the fields. So checking for empty fields is not a guarantee that you're capturing the intent.
And then we must consider the user coming back after successfully filling in the fields, and re-editing them later (like on an edit profile page). In that case the fields start out filled out.
There are many successful implementations of these requirements in the wild, and if nothing is forthcoming from this SE question, I'll be performing an audit of the best practices and find a way to abstract and document them.
Before I go ahead and do that exhaustive work, I'd love to see whether there are any documented decision trees, flow diagrams or even pseudo-code out there already, so I don't duplicate effort.