Question

I am creating a registration form.
I want to use the placeholder attribute on a password input to explain, in part, what type of regex is used for validation, using the pattern attribute.

This is the regex i found at http://www.html5pattern.com :

(?=^.{6,}$)((?=.*\d)|(?=.*\W+))(?![.\n])(?=.*[A-Z])(?=.*[a-z]).*$

The explanation for this regex was as follows:

Password (UpperCase, LowerCase, Number/SpecialChar and min 6 Chars)

The example i have used in the placeholder attribute, along with the title attribute, is this : Examp1e.
I would like to ensure that a user does not specifically enter “Examp1e” as their password.
Does anyone have any advice, suggestions, or input as to how i should go about this task?

Answer 1

That regex you started with is bad. For one thing, JavaScript’s \W is equivalent to [^A-Za-z0-9_]: any character that isn’t an ASCII word character. That includes all of the ASCII punctuation, whitespace and control characters, plus all non-ASCII characters. There’s no official definition for “special characters” that I know of, but I’m pretty sure this is not what the author meant.

To move this along, I’ll assume only ASCII characters are allowed in the password, and that “special characters” refers to punctuation characters:

[!"#$%&'()*+,\-./:;<=>?@\[\\\]^_`{|}~]

That would make the regex

^(?=[!-~]{6,20}$)(?=.*[A-Z])(?=.*[a-z])(?=.*[\d!"#$%&'()*+,\-./:;<=>?@\[\\\]^_`{|}~]).*$

Notes:

• Notice how I pulled the ^ out of the first group; it’s there to anchor the whole regex, not just that one lookahead.

• I also merged the “digits” and “specials” lookaheads into one. It’s not a big deal in this case, but one of my rules thumb is that you should never use an alternation if a character class will do the job.

• [!-~] is an old Perl idiom for any “visible” ASCII character (i.e., anything but whitespace or control characters).

• I haven’t the slightest idea what the original author was trying to do with that (?![.\n]).