Comprehensive validation library for Vue.js applications providing common validators with built-in error messages and customization options
87
{
"context": "This criteria evaluates the engineer's ability to use Vuelidate's validation configuration options ($lazy, $autoDirty, and manual validation control) to implement different validation behaviors for form fields. The focus is on correct usage of configuration APIs to control when and how validation occurs.",
"type": "weighted_checklist",
"checklist": [
{
"name": "useVuelidate setup",
"description": "Correctly imports and calls useVuelidate() from @vuelidate/core to set up validation for the form component",
"max_score": 10
},
{
"name": "Validator imports",
"description": "Imports required validators from @vuelidate/validators (required, email, minLength, sameAs)",
"max_score": 10
},
{
"name": "$lazy configuration",
"description": "Configures username and email fields with $lazy: true to enable lazy validation mode so validation only runs after blur/touch",
"max_score": 25
},
{
"name": "$autoDirty configuration",
"description": "Configures password field with $autoDirty: true to automatically mark the field as dirty on input changes",
"max_score": 25
},
{
"name": "Manual validation",
"description": "Implements manual validation control for confirm password field by not using $autoDirty or $lazy, and explicitly calling $validate() or $touch() when needed",
"max_score": 20
},
{
"name": "Form-level validation",
"description": "Uses the validation object's $validate() method in the submit handler to validate the entire form before submission",
"max_score": 10
}
]
}Install with Tessl CLI
npx tessl i tessl/npm-vuelidate--validatorsdocs
evals
scenario-1
scenario-2
scenario-3
scenario-4
scenario-5
scenario-6
scenario-7
scenario-8
scenario-9
scenario-10