4 ms·
It's also easily misused. Take the regular expression validator for passwords on the California DMV website, for example. The website states "Must include at le
by montag 2y ago
It's also easily misused. Take the regular expression validator for passwords on the California DMV website, for example. The website states "Must include at least 4 alpha characters". But the validation pattern
^(?=(.*[a-zA-Z]){4,})(?=.*[0-9!#$%]).+$
requires that these characters appear consecutively.
- deleted 2y ago[deleted]
- eddd-ddde 2y agoThe {4} is being applied to the whole group which includes a .* Isn't that correct?
- Izkata 2y agoYep, and the .* means "0 or more of anything", so it's 4 or more groups that each end with a letter. They can be consecutive or not and a group can be a single letter but doesn't need to be - so whatever the failure was, it wasn't that (or the regex was typo'd here to be correct instead of what was actually on the site).
- account42 2y agoThe regexp still requires four letters before the last digit or special character which is a weird requirement.
- GrantMoyer 2y agoThe (?=…) are "lookaheads". They match the enclosed pattern without advancing the cursor.
- everdimension 2y agoThat's exactly the case where the "customValidity" attribute shines! I have nothing against regex and the "pattern" attribute is the way to go for many cases, but having this is an alternative is also very nice: const valid = value.length => 4 && isAlphanumeric(value); return ( <Input value={value} customValidity={valid ? 'at least 4 alpha characters' : ''} /> )
- everdimension 2y agoYeah well I promise it does read nicely when there's formatting which HN comments do not allow :)
- kaoD 2y agoAFAIK customValidity is not an attribute and you can only use an imperative setCustomValidity API which is terrible cumbersome to use in a declarative framework like React.
- everdimension 2y agoYeah this is exactly what I'm writing about in the article :)