The auro-formvalidation is a JavaScript utility that handles element validation. The purpose of having a separate validation utility is to ensure consistent validation workflow and results across all form element.
The AuroDesignSystem validation workflow closely mirrors the HTML5 form elements validation workflow.
For the most up to date information on UI development browser support
$ npm i @aurodesignsystem/auro-formvalidationInstalling as a direct, dev or peer dependency is up to the user installing the package. If you are unsure as to what type of dependency you should use, consider reading this stack overflow answer.
import "@aurodesignsystem/auro-formvalidation";Validation allows for setting the following optional requirements on a form element. These options can be used individually or in any combination.
required: Specifies whether a form field needs to be filled in before the form can be submitted.minlengthandmaxlength: Specifies the minimum and maximum length of textual data (strings).minandmax: Specifies the minimum and maximum values of numerical input types.type: Specifies whether the data needs to be a number, an email address, or some other specific preset type.pattern: Specifies a regular expression that defines a pattern the entered data needs to follow.error: Forces the validation state to be invalid and defines the custom validation message to display.
In order to develop against this project, if you are not part of the core team, you will be required to fork the project prior to submitting a pull request.
Please be sure to review the contribution guidelines for this project. Please make sure to pay special attention to the conventional commits section of the document.
The custom element API file is generated in the build and committed back to the repo with a version change. If the API doc has changed without a version change, author's are to run npm run build:api to generate the doc and commit to version control.
Automated tests are required for every Auro component. See .\test\auro-formvalidation.test.js for the tests for this component. Run npm test to run the tests and check code coverage. Tests must pass and meet a certain coverage threshold to commit. See the testing documentation for more details.