feat: custom validator

docs/handler/validate.md

@@ -26,4 +26,14 @@ You can provide a translation function to change representation of errors per `a
 }/>
 ```
 
-
+You can add errors on top of the schema validation by injecting your own validator.
+```jsx
+import { finalizeName } from 'liform-react-final'
+const myValidator = (values, liformApi) => {
+    // inspect the values and return a flat error object
+    return {
+        [finalizeName('my.object.property')]: 'some error',
+    }
+}
+<Liform {...liformProps} validate={myValidator}/>
+```

src/form.jsx

@@ -92,7 +92,8 @@ export function Liform(props) {
 
     const onValidate = useMemo(() => buildFlatValidatorHandler(buildFlatValidatorStack(
         buildFlatAjvValidate(props.ajv, liformApi.schema, props.ajvTranslator || translateAjv),
-    ), liformApi), [props.ajv, props.ajvTranslator, liformApi])
+        ...[props.validate].filter(Boolean),
+    ), liformApi), [props.ajv, props.ajvTranslator, liformApi, props.validate])
 
     const finalFormProps = {
         debug: props.debug,
@@ -168,6 +169,7 @@ Liform.propTypes = {
 
     ajv: PropTypes.func,
     ajvTranslator: PropTypes.func,
+    validate: PropTypes.func,
 
     ...FinalForm.propTypes,
 }

src/validate.js

@@ -51,11 +51,11 @@ export const flatAjvValidate = (ajv, schema, ajvTranslate, values) => {
 }
 
 export const buildFlatValidatorStack = (...validators) => {
-    return (values) => {
+    return (values, liform) => {
         const flatErrors = {}
 
         for (const validator of validators) {
-            const newErrors = validator(values)
+            const newErrors = validator(values, liform)
             for (const fieldName in newErrors) {
                 flatErrors[fieldName] = (flatErrors[fieldName] || []).concat(
                     Array.isArray(newErrors[fieldName]) ? newErrors[fieldName] : [newErrors[fieldName]],
@@ -69,7 +69,7 @@ export const buildFlatValidatorStack = (...validators) => {
 
 export const buildFlatValidatorHandler = (flatErrorValidator, liform) => {
     return (values) => {
-        const flatErrors = flatErrorValidator(values)
+        const flatErrors = flatErrorValidator(values, liform)
         liform.validationErrors = flatErrors
         return Object.keys(flatErrors).length > 0 ? { [FORM_ERROR]: 'The form has errors - see Liform.validationErrors' } : {}
     }

test/form.jsx

@@ -143,4 +143,31 @@ describe('Liform', () => {
 
         expect(getLastProps(fieldState).dirty).toBe(false)
     })
+
+    it('use custom validator', () => {
+        const container = jest.fn(() => null)
+        const theme = { render: { container } }
+
+        const validator = jest.fn(() => ({
+            'foo.bar': 'baz',
+        }))
+
+        Renderer.create(<Liform theme={theme} validate={validator}/>)
+
+        expect(container).toBeCalled()
+
+        Renderer.act(() => {
+            getLastProps(container).form.registerField('someField', () => null, {})
+            getLastProps(container).form.change('someField', 'someValue')
+        })
+
+        expect(validator).toBeCalledWith(
+            {'someField': 'someValue', '_': undefined},
+            getLastProps(container).liform,
+        )
+
+        expect(getLastProps(container).liform.validationErrors).toEqual({
+            'foo.bar': ['baz'],
+        })
+    })
 })

test/validate.js

@@ -97,7 +97,7 @@ describe('Flat validator stack', () => {
         stack(values)
 
         for(const f of validators) {
-            expect(f).toBeCalledWith(values)
+            expect(f).toBeCalledWith(values, undefined)
         }
     })