Streamline Your Data Validation with Vest
Unit Testing Meets Data Validation
Vest is a powerful JavaScript data validation library that borrows its syntax from modern JS frameworks like Mocha or Jest. As a framework-agnostic solution, you can seamlessly integrate Vest into your code.
Vest allows you to apply unit testing principles to data validation, making it easy to write and manage tests for your input data. By exporting a validation function, or “suit,” you can perform tests on input data passed as an object. This function can be called whenever validation is required in your logic.
const validate = vest.create('suite_name', {
'username': 'equired',
'email': ['required', 'email']
});
Collecting and Passing Data
To get started, you’ll need to collect data from your form. Whether you’re using vanilla JS or a framework like React, Vest makes it easy to gather data and pass it to your validation function.
const userData = {
username: 'johnDoe',
email: '[email protected]'
};
validate(userData);
Handling Validation Results
Once you’ve collected and passed your data, you’ll need to handle the result of the validation suit. Vest returns an object containing a pool of useful information and methods, including a .done()
method that can be chained multiple times to handle the response gracefully.
validate(userData).done(() => {
console.log('Validation successful!');
});
Error Handling and Warnings
To check if any tests have failed, you can call the .hasErrors()
response method. If true, you can access the full list of errors using the .getErrors()
method. Vest also allows you to separate response messages between two different levels of importance using vest.warn()
.
if (validate(userData).hasErrors()) {
const errors = validate(userData).getErrors();
console.log(errors);
} else {
console.log('No errors found!');
}
Grouping Tests and Filtering Inputs
Tests can be grouped to filter which inputs should be tested at a certain point in your logic. This is particularly useful for validating multipage forms sending data in sequential steps. You can also use vest.skip()
to avoid testing certain fields or groups under certain conditions.
const validatePage1 = vest.create('page1', {
'username': 'equired',
'email': ['required', 'email']
});
const validatePage2 = vest.create('page2', {
'password': 'equired',
'confirmPassword': 'equired'
});
Real-Time Validation and Async Testing
Vest allows for real-time validation, making it easy to update your application state accordingly. You can also use vest.only()
to execute tests for a particular field or group only. Additionally, Vest supports async validation, which is useful when checking data against entries in a database.
validate(userData).only('username').done(() => {
console.log('Username validated!');
});
Custom Rules and Class Names
Vest provides a range of customization options, including the ability to create custom rules using enforce()
and associate CSS classes with DOM elements based on the validation state using classNames()
.
vest.enforce('customRule', (value) => {
// Custom validation logic here
});
vest.classNames('input-field', {
valid: 'is-valid',
invalid: 'is-invalid'
});
By leveraging Vest’s powerful features, you can streamline your data validation process and ensure that your application is robust and reliable. Whether you’re building a complex form or a simple input field, Vest has got you covered.