Feature/form validator (#34)

* Renamed from base-validator -> base-field-validator.
* Added BaseValidator.
* Refactored props interface naming.
* Added ValidateForm in value helpers. Refactored.
* Added Origin to FormErorr.
* Updated FormStoreState with new FormState.
* Error property has now flag.
* Validating and Error from fields flags w/ tests.
* Added ValidateForm.
* Added FormStateProps.
* Started making tests for subscriber validation form.
* Updated contracts index in simplr-forms-core.
* Update subscriber ValidateForm and cascading in ValidateField.
* Moved default ValidationType to Form prop fieldsValidationType.
* Error -> HasError.
* Added GetInitialStateProperties method.
* Fixed error: Error -> HasError.
* Added form-store test: Touched false after value updated to identical one.

Author: DovydasNavickas

packages/simplr-forms-core/__tests__/stores/form-store.test.ts

@@ -337,4 +337,65 @@ describe("Form store", () => {
             }
         }
     });
+
+    describe("state properties", () => {
+        it("pristine false after field value changed", () => {
+            const fieldId = "field id";
+
+            formStore.RegisterField(fieldId, "");
+            expect(formStore.GetState().Pristine).toBe(true);
+
+            formStore.UpdateFieldValue(fieldId, "next value");
+            expect(formStore.GetState().Pristine).toBe(false);
+        });
+
+        it("touched true after field value changed", () => {
+            const fieldId = "field id";
+
+            formStore.RegisterField(fieldId, "");
+            expect(formStore.GetState().Touched).toBe(false);
+
+            formStore.UpdateFieldValue(fieldId, "next value");
+            expect(formStore.GetState().Touched).toBe(true);
+        });
+
+        it("touched false after value updated to identical one", () => {
+            const fieldId = "field id";
+
+            formStore.RegisterField(fieldId, "");
+            expect(formStore.GetState().Touched).toBe(false);
+
+            formStore.UpdateFieldValue(fieldId, "");
+            expect(formStore.GetState().Touched).toBe(false);
+        });
+
+        it("error true is after field error ", async done => {
+            const fieldId = "field id";
+            try {
+                formStore.RegisterField(fieldId, "");
+                expect(formStore.GetState().HasError).toBe(false);
+
+                await formStore.ValidateField(fieldId, new Promise<void>((resolve, reject) => {
+                    reject("error message");
+                }));
+                expect(formStore.GetState().HasError).toBe(true);
+            } catch (error) {
+                done.fail(error);
+            }
+
+            done();
+        });
+
+        it("validating true after field error ", () => {
+            const fieldId = "field id";
+            formStore.RegisterField(fieldId, "");
+            expect(formStore.GetState().Validating).toBe(false);
+
+            formStore.ValidateField(fieldId, new Promise<void>((resolve, reject) => {
+                reject("error message");
+            }));
+
+            expect(formStore.GetState().Validating).toBe(true);
+        });
+    });
 });

packages/simplr-forms-core/src/abstractions/base-form.ts

@@ -2,6 +2,7 @@ import * as React from "react";
 import * as PropTypes from "prop-types";
 
 import * as FormContracts from "../contracts/form";
+import { FieldValidationType } from "../contracts/validation";
 import { FormStore } from "../stores/form-store";
 import { FSHContainer, FormStoresHandler } from "../stores/form-stores-handler";
 
@@ -20,6 +21,9 @@ export abstract class BaseForm<TProps extends FormContracts.FormProps, TState> e
 
     static defaultProps: FormContracts.FormProps = {
         destroyOnUnmount: true,
+        fieldsValidationType: FieldValidationType.OnFieldRegistered |
+        FieldValidationType.OnValueChange |
+        FieldValidationType.OnPropsChange,
         disabled: false
     };
 

packages/simplr-forms-core/src/abstractions/core-field.ts

@@ -5,7 +5,6 @@ import * as PropTypes from "prop-types";
 import {
     CoreFieldProps,
     FieldValue,
-    FieldValidationType,
     FieldFormatValueCallback,
     FieldNormalizeValueCallback,
     FieldParseValueCallback,
@@ -18,6 +17,7 @@ import { FormStoreStateRecord } from "../contracts/form-store";
 import * as FormStoreActions from "../actions/form-store";
 // import { FieldsGroupContextProps } from "../contracts/fields-group";
 import { FSHContainer } from "../stores/form-stores-handler";
+import { FieldValidationType } from "../contracts/validation";
 
 export interface CoreFieldState {
     Field?: FieldStateRecord;
@@ -47,9 +47,6 @@ export abstract class CoreField<TProps extends CoreFieldProps, TState extends Co
     static defaultProps: CoreFieldProps = {
         // Empty string checked to have value in componentWillMount
         name: "",
-        validationType: FieldValidationType.OnFieldRegistered |
-        FieldValidationType.OnValueChange |
-        FieldValidationType.OnPropsChange,
         // By default, fields data should be retained, even if the field is unmounted
         destroyOnUnmount: false
     };

packages/simplr-forms-core/src/contracts/error.ts

@@ -1,4 +1,16 @@
+import { TypedRecord } from "typed-immutable-record/dist";
 // Future self might love usage of an object with message property instead of a plain string
+
 export interface FormError {
     Message: string;
+    // Told you so.
+    Origin?: FormErrorOrigin;
+}
+
+export interface FormErrorRecord extends TypedRecord<FormErrorRecord>, FormError { }
+
+export enum FormErrorOrigin {
+    None,
+    Validation,
+    Submit
 }

packages/simplr-forms-core/src/contracts/field.ts

@@ -1,5 +1,6 @@
 import { TypedRecord } from "typed-immutable-record";
-import { FormError } from "./error";
+import { FormErrorRecord } from "./error";
+import { FieldValidationType } from "./validation";
 
 // Field value can be of any type or undefined
 export type FieldValue = any | undefined;
@@ -43,11 +44,3 @@ export type FieldStateProps = CoreFieldProps & React.Props<any>;
 
 export interface FieldStateRecord extends TypedRecord<FieldStateRecord>, FieldState { }
 export interface FieldStatePropsRecord extends TypedRecord<FieldStatePropsRecord>, FieldStateProps { }
-export interface FormErrorRecord extends TypedRecord<FormErrorRecord>, FormError { }
-
-export enum FieldValidationType {
-    None,
-    OnFieldRegistered = 1 << 1,
-    OnValueChange = 1 << 2,
-    OnPropsChange = 1 << 3
-}

packages/simplr-forms-core/src/contracts/form-store.ts

@@ -3,13 +3,19 @@ import { TypedRecord } from "typed-immutable-record";
 
 import { FieldStateRecord } from "../contracts/field";
 import { FieldsGroupStoreState } from "../contracts/fields-group";
-import { FormStateRecord, FormPropsRecord } from "../contracts/form";
+import { FormStateRecord } from "../contracts/form";
 
-export interface FormStoreState {
+export interface FormStoreState extends FormStoreStateStatus {
     Fields: Immutable.Map<string, FieldStateRecord>;
     FieldsGroups: Immutable.Map<string, FieldsGroupStoreState>;
     Form: FormStateRecord;
-    FormProps: FormPropsRecord;
+}
+
+export interface FormStoreStateStatus {
+    Validating: boolean;
+    HasError: boolean;
+    Pristine: boolean;
+    Touched: boolean;
 }
 
 export interface FormStoreStateRecord extends TypedRecord<FormStoreStateRecord>, FormStoreState { }

packages/simplr-forms-core/src/contracts/form.ts

@@ -1,30 +1,34 @@
 import { TypedRecord } from "typed-immutable-record";
 
-import { FormError } from "./error";
 import { FormStore } from "../stores/form-store";
+import { FormErrorRecord } from "./error";
+import { FieldValidationType } from "./validation";
 
 export interface FormProps {
     formId?: string;
     formStore?: FormStore;
     destroyOnUnmount?: boolean;
     forceSubmit?: boolean;
     disabled?: boolean;
+    fieldsValidationType?: FieldValidationType;
+    formValidationType?: FieldValidationType;
 }
 
-export interface FormPropsRecord extends TypedRecord<FormPropsRecord>, FormProps { }
+export type FormStateProps = FormProps & React.Props<any>;
+
+export interface FormPropsRecord extends TypedRecord<FormPropsRecord>, FormStateProps { }
 
 export interface FormChildContext {
     FormId: string;
 }
 
 export interface FormState {
+    Props: FormStateProps;
     Validating: boolean;
-    Pristine: boolean;
-    Error?: FormError;
+    Error?: FormErrorRecord;
+    SubmitCallback?: () => void;
     Submitting: boolean;
-    Touched: boolean;
     SuccessfullySubmitted: boolean;
-    SubmitCallback?: () => void;
     ActiveFieldId?: string;
 }
 

packages/simplr-forms-core/src/contracts/index.ts

@@ -4,3 +4,4 @@ export * from "./fields-group";
 export * from "./form-store";
 export * from "./form";
 export * from "./value";
+export * from "./validation";

packages/simplr-forms-core/src/contracts/validation.ts

@@ -0,0 +1,6 @@
+export enum FieldValidationType {
+    None,
+    OnFieldRegistered = 1 << 1,
+    OnValueChange = 1 << 2,
+    OnPropsChange = 1 << 3
+}