@overgear/yup-ast v1.0.3
- YUP AST to validatior generator
We wanted to create a system where validations did not have to be statically compiled into the frontend sources, but rather served from the backend database, and usable by both the backend and the frontend simultaneously.
To do this we created a simple [https://en.wikipedia.org/wiki/Abstract_syntax_tree] model using [https://github.com/jquense/yup] for validation.
For many examples of the AST we can look into the [./source/tests/converter.test.js] file, where different use cases are defined.
- Installing
With NPM: #+BEGIN_SRC bash npm install @overgear/yup-ast #+END_SRC
With yarn: #+BEGIN_SRC bash yarn add @overgear/yup-ast #+END_SRC
- Schema
The schema is defined as follows:
A simple array with a string name is seen as a prefix notational function lookup.
#+BEGIN_SRC json "yup.object" #+END_SRC
Is seen as a call to the function #+BEGIN_SRC javascript yup.object() #+END_SRC
Functions can be chained together by surrounding them by an array:
#+BEGIN_SRC json [ "yup.object", "yup.required", ] #+END_SRC
Becomes #+BEGIN_SRC javascript yup .object() .required() #+END_SRC
Anything else in the array after the prefix function is treated as an argument to be passed to that function:
#+BEGIN_SRC json [ "yup.number", "yup.required", "yup.min", 50, "yup.max", 500,
] #+END_SRC Becomes #+BEGIN_SRC javascript yup .object() .required() .min(50) .max(500) #+END_SRC
(Which validates that a number is required, greater than 50 and less than 500.
Multiple arguments can be passed to functions
#+BEGIN_SRC json [ "yup.number", "yup.required", "yup.min", 50, "This is the error for failing this validation", "yup.max", 500, "Number should be less than 500", ] #+END_SRC
Becomes #+BEGIN_SRC javascript yup .object() .required() .min(50, "This is the error for failing this validation") .max(500, "Number should be less than 500") #+END_SRC
and additional yup validators
#+BEGIN_SRC json [ "yup.object", "yup.required", [ "yup.shape", { "game": ["yup.string", "yup.required", "wizard.validations.is_required"], "locale": ["yup.string", "yup.required", "wizard.validations.is_required"], "category": ["yup.string", "yup.required", "wizard.validations.is_required"], "subcategory": ["yup.string", "yup.required", "wizard.validations.is_required"], }, ], ] #+END_SRC
Becomes #+BEGIN_SRC javascript yup .object() .required() .shape({ "game": yup.string().required("wizard.validations.is_required"), "locale": yup.string().required("wizard.validations.is_required"), "category": yup.string().required("wizard.validations.is_required"), "subcategory": yup.string().required("wizard.validations.is_required"), }) #+END_SRC
Custom validators ~addCustomValidator(name, validator, binding = false)~ Adds a custom validator by name: #+BEGIN_SRC javascript addCustomValidator('myCustomValidator', yup.number().min(50).max(500)) #+END_SRC Which creates a custom validator, to be used as: #+BEGIN_SRC json [ "myCustomValidator" ] #+END_SRC ~getCustomValidator(name)~ Gets the value of a custom validator ** ~delCustomValidator(name)~ Removes a validator which the user has added
Generated validator
Since the result of a call to transformAll is a yup validator, please see the [https://github.com/jquense/yup] for more information about features available.