Search code examples
javascripthtmlregexvalidationpasswords

HTML Input Pattern claims mismatch while JavaScript test claims match


I am attempting to do a pattern match on a password input and for some reason HTML claims there is a mismatch while JavaScript claims it matches. Testing my RegExp on regexr.com/7gmmi claims it is a-okay...

What am I missing?

<input id="password" type="password" placeholder="Password Input" pattern="/^(?!.*(.)\1{1})(?=(.*[\d]){2,})(?=(.*[a-z]){2,})(?=(.*[A-Z]){2,})(?=(.*[\D\W\S]){2,})(?:[\d\w\S]){8,64}$/">
const patternPass = new RegExp(/^(?!.*(.)\1{1})(?=(.*[\d]){2,})(?=(.*[a-z]){2,})(?=(.*[A-Z]){2,})(?=(.*[\D\W\S]){2,})(?:[\d\w\S]){8,64}$/);

console.log(patternPass.test("FAGX@s#A2dred01sd"));

/// true

Solution

  • Have you tried removing those slashes at the beginning and end of the pattern attribute and testing again?