CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-vuelidate--validators

Comprehensive validation library for Vue.js applications providing common validators with built-in error messages and customization options

87

1.14x
Overview
Eval results
Files

task.mdevals/scenario-9/

User Profile Form with Conditional Validation

Build a user profile form validation system that implements conditional field requirements based on user selections and input values.

Requirements

Form Fields

The form should validate the following fields:

  • accountType: The type of user account (e.g., "personal" or "business")
  • companyName: Required only when account type is "business"
  • taxId: Required only when account type is "business"
  • age: User's age in years
  • parentEmail: Required only when age is under 18
  • hasInsurance: Boolean indicating if user has insurance
  • insuranceProvider: Required only when user has insurance
  • preferredContact: Method of contact (e.g., "email" or "phone")
  • phoneNumber: Required unless preferred contact method is "email"

Validation Rules

  1. Company name must be required when account type is "business"
  2. Tax ID must be required when account type is "business"
  3. Parent email must be required when age is less than 18
  4. Insurance provider must be required when user indicates they have insurance
  5. Phone number must be required unless the preferred contact method is "email"

Test Cases

  • When accountType is "business", companyName validation should fail if empty @test
  • When accountType is "personal", companyName validation should pass even if empty @test
  • When age is 16, parentEmail validation should fail if empty @test
  • When age is 20, parentEmail validation should pass even if empty @test
  • When hasInsurance is true, insuranceProvider validation should fail if empty @test
  • When hasInsurance is false, insuranceProvider validation should pass even if empty @test
  • When preferredContact is "phone", phoneNumber validation should pass even if empty @test
  • When preferredContact is "sms", phoneNumber validation should fail if empty @test

@generates

API

/**
 * Creates validation rules for the user profile form with conditional requirements.
 *
 * @param {Object} formData - The reactive form data object containing all form fields
 * @returns {Object} Validation rules object compatible with a validation library
 */
function createValidationRules(formData) {
  // Returns an object with validation rules for each field
}

module.exports = { createValidationRules };

Dependencies { .dependencies }

@vuelidate/validators { .dependency }

Provides validation functions including conditional validators for dynamic form validation requirements.

Install with Tessl CLI

npx tessl i tessl/npm-vuelidate--validators

tile.json