Adding invalid callback for validateFields action, fixes #89 + unit tests

Author: davidkpiano

src/actions/field-actions.js

@@ -131,7 +131,7 @@ const validateErrors = (model, errorValidators) => (dispatch, getState) => {
   dispatch(setErrors(model, errors));
 };
 
-const validateFields = (model, fieldValidators, callback) => (dispatch, getState) => {
+const validateFields = (model, fieldValidators, validCB, invalidCB) => (dispatch, getState) => {
   const value = _get(getState(), model);
 
   const fieldsValidity = mapValues(fieldValidators, (validator, field) => {
@@ -144,12 +144,14 @@ const validateFields = (model, fieldValidators, callback) => (dispatch, getState
     return fieldValidity;
   });
 
-  if (callback) {
+  if (validCB || invalidCB) {
     const form = getForm(getState(), model);
     const formValid = form ? form.valid : true;
 
-    if (formValid && isValid(fieldsValidity)) {
-      callback();
+    if (validCB && formValid && isValid(fieldsValidity)) {
+      validCB();
+    } else if (invalidCB) {
+      invalidCB();
     }
   }
 

src/components/form-component.js

@@ -8,6 +8,16 @@ import mapValues from 'lodash/mapValues';
 import actions from '../actions';
 import { getValidity, getForm } from '../utils';
 
+function dispatchValidCallback(modelValue, callback) {
+  return callback
+    ? () => callback(modelValue)
+    : undefined;
+}
+
+function dispatchInvalidCallback(model, dispatch) {
+  return () => dispatch(actions.setSubmitFailed(model));
+}
+
 class Form extends Component {
   constructor(props) {
     super(props);
@@ -86,14 +96,14 @@ class Form extends Component {
       return modelValue;
     }
 
-    const validationCallback = onSubmit
-      ? () => onSubmit(modelValue)
-      : undefined;
+    const validCallback = dispatchValidCallback(modelValue, onSubmit);
+    const invalidCallback = dispatchInvalidCallback(model, dispatch);
 
     dispatch(actions.validateFields(
       model,
       validators,
-      validationCallback));
+      validCallback,
+      invalidCallback));
 
     return modelValue;
   }

test/form-component-spec.js

@@ -427,6 +427,12 @@ describe('<Form> component', () => {
       assert.isNull(submitValue);
     });
 
+    it('should set submitFailed to true if form is invalid and submitted', () => {
+      TestUtils.Simulate.submit(formElement);
+
+      assert.isTrue(store.getState().testForm.submitFailed);
+    });
+
     it('should call onSubmit with model value if form is valid', () => {
       barControl.value = 'bar';