[Question] Password strength measurement (multiple tests on same field at once – not one after the other)

[hmalaud]

I have a quite specific use case and don't know how far I can go with tweaking Vee-Validate or if I should only let the plugin validate the field and let Vue handle the rest.

I have 2 password fields that need to be the same -> cross validation field ✅
rules="required|matching_fields:@password"

The first of these fields needs to contain:

• min 8 characters
• min 1 lowercase letter
• min 1 uppercase letter
• min 1 special character
  -> custom rule/extend ✅
  rules="required|password_format"
  or
  rules="required|password_min_length|password_lowercase|password_uppercase|password_special_char"
  (see 1./2. below)

These 4 requirements must be indicated next to the field (in green when passed, in red when not, e.g. ✅ min 8 letters, ❌ min 1 special character) and updated when the user is typing in the field.

I'm wondering how it's best to do:

1. Should there be 1 custom rule per field so that there is track of each passed requirement? Problem -> to my knowledge, there is no way to know all the requirements that are erroring (failedRules does not output an object with all pending rules but only the first erroring in the above list)
2. Should there be 1 custom rule for the whole field (and if so, I'm lacking knowledge on how to achieve this, so any help is welcome :) )
3. Should I only use Vee-Validate for the matching_fields part and use Vue for the rest of it?
4. Any other option?

[logaretm]

I converted this to a discussion because it is not really an issue with vee-validate.

Your analysis on failedRules is correct, as you won't be able to tell the difference between a rule that was not run yet or a rule that passed. This is probably a short sight on my part for building this feature.

Should there be 1 custom rule for the whole field

It is up to you on how to organize your rules, you could use smaller re-usable rules or combine them to make it easy to maintain or change. Personally, I prefer smaller rules unless a field is the only one that requires a complex validation requirement.

---

So to answer your inquiry, I would say to only use vee-validate for validation, this meta-information about the missing requirements could be built separately as you watch for the field model or listen to its input events.