Add submitting state property that is true while onSubmit is pending

INTRODUCTION.md

@@ -884,6 +884,7 @@ MyComponentUsingUniformsContext.contextTypes = {
         state: PropTypes.shape({
             changed:    PropTypes.bool.isRequired,
             changedMap: PropTypes.object.isRequired,
+            submitting: PropTypes.bool.isRequired,
 
             label:       PropTypes.bool.isRequired,
             disabled:    PropTypes.bool.isRequired,
@@ -948,8 +949,8 @@ import filterDOMProps from 'uniforms/filterDOMProps';
 // This field works as follows: render standard submit field and disable it, when
 // the form is invalid. It's a simplified version of a default SubmitField from
 // uniforms-unstyled.
-const SubmitField = (props, {uniforms: {error, state: {disabled}}}) =>
-    <input disabled={!!(error || disabled)} type="submit" />
+const SubmitField = (props, {uniforms: {error, state: {disabled, submitting}}}) =>
+    <input disabled={!!(error || disabled || submitting)} type="submit" />
 ;
 
 SubmitField.contextTypes = BaseField.contextTypes;

packages/uniforms-antd/__tests__/_createContext.js

@@ -20,6 +20,7 @@ const createContext = (schema, context) => ({
                 changedMap: {},
 
                 changed:         false,
+                submitting:      false,
                 disabled:        false,
                 label:           false,
                 placeholder:     false,

packages/uniforms-bootstrap3/__tests__/_createContext.js

@@ -20,6 +20,7 @@ const createContext = (schema, context) => ({
                 changedMap: {},
 
                 changed:         false,
+                submitting:      false,
                 disabled:        false,
                 label:           false,
                 placeholder:     false,

packages/uniforms-bootstrap4/__tests__/_createContext.js

@@ -20,6 +20,7 @@ const createContext = (schema, context) => ({
                 changedMap: {},
 
                 changed:         false,
+                submitting:      false,
                 disabled:        false,
                 label:           false,
                 placeholder:     false,

packages/uniforms-material/__tests__/_createContext.js

@@ -23,6 +23,7 @@ const createContext = (schema, context) => ({
 
                 changed:         false,
                 disabled:        false,
+                submitting:      false,
                 label:           false,
                 placeholder:     false,
                 showInlineError: false,

packages/uniforms-semantic/__tests__/_createContext.js

@@ -20,6 +20,7 @@ const createContext = (schema, context) => ({
                 changedMap: {},
 
                 changed:         false,
+                submitting:      false,
                 disabled:        false,
                 label:           false,
                 placeholder:     false,

packages/uniforms-unstyled/__tests__/_createContext.js

@@ -20,6 +20,7 @@ const createContext = (schema, context) => ({
                 changedMap: {},
 
                 changed:         false,
+                submitting:      false,
                 disabled:        false,
                 label:           false,
                 placeholder:     false,

packages/uniforms/__tests__/BaseField.js

@@ -30,7 +30,15 @@ describe('BaseField', () => {
     const model = {a: {b: {c: 'example'}}};
     const onChange = jest.fn();
     const randomId = randomIds();
-    const state = {changed: !1, changedMap: {}, label: !0, disabled: !1, placeholder: !0, showInlineError: !0};
+    const state = {
+        changed: false,
+        changedMap: {},
+        submitting: false,
+        label: true,
+        disabled: false,
+        placeholder: true,
+        showInlineError: true
+    };
     const schema = createSchemaBridge({
         getDefinition (name) {
             // Simulate SimpleSchema.

packages/uniforms/__tests__/BaseForm.js

@@ -30,6 +30,8 @@ describe('BaseForm', () => {
     afterEach(() => {
         onChange.mockReset();
         onSubmit.mockReset();
+        onSubmitSuccess.mockReset();
+        onSubmitFailure.mockReset();
     });
 
     describe('child context', () => {
@@ -254,7 +256,7 @@ describe('BaseForm', () => {
             expect(onSubmit).toHaveBeenLastCalledWith(model);
         });
 
-        it('calls `onSubmit` with correct model (`modelTransform`)', () => {
+        it('calls `onSubmit` with the correctly `modelTransform`ed model', () => {
             wrapper.setProps({
                 modelTransform (mode, model) {
                     if (mode === 'submit') {
@@ -272,15 +274,39 @@ describe('BaseForm', () => {
             wrapper.setProps({modelTransform: undefined});
         });
 
-        it('does nothing without `onSubmit`', () => {
-            wrapper.setProps({onSubmit: undefined});
+        it('without `onSubmit` calls only `onSubmitSuccess`', async () => {
+            wrapper.setProps({onSubmit: undefined, onSubmitSuccess, onSubmitFailure});
             wrapper.find('form').simulate('submit');
 
+            await new Promise(resolve => process.nextTick(resolve));
             expect(onSubmit).not.toBeCalled();
+            expect(onSubmitSuccess).toBeCalledTimes(1);
+            expect(onSubmitFailure).not.toBeCalled();
+        });
+
+        it('sets `submitting` state', async () => {
+            let resolveSubmit = null;
+            wrapper.setProps({onSubmit: () => new Promise(resolve => resolveSubmit = resolve)});
+
+            const context1 = wrapper.instance().getChildContext().uniforms.state;
+            expect(context1).toHaveProperty('submitting', false);
+
+            wrapper.find('form').simulate('submit');
+            await new Promise(resolve => process.nextTick(resolve));
+
+            const context2 = wrapper.instance().getChildContext().uniforms.state;
+            expect(context2).toHaveProperty('submitting', true);
+
+            resolveSubmit();
+            await new Promise(resolve => process.nextTick(resolve));
+
+            const context3 = wrapper.instance().getChildContext().uniforms.state;
+            expect(context3).toHaveProperty('submitting', false);
         });
 
-        it('calls `onSubmitSuccess` when `onSubmit` resolves', async () => {
-            onSubmit.mockReturnValueOnce(Promise.resolve());
+        it('calls `onSubmitSuccess` with the returned value when `onSubmit` resolves', async () => {
+            const onSubmitValue = 'value';
+            onSubmit.mockReturnValueOnce(Promise.resolve(onSubmitValue));
 
             const wrapper = mount(
                 <BaseForm model={model} schema={schema} onSubmit={onSubmit} onSubmitSuccess={onSubmitSuccess} />
@@ -291,10 +317,12 @@ describe('BaseForm', () => {
             await new Promise(resolve => process.nextTick(resolve));
 
             expect(onSubmitSuccess).toHaveBeenCalledTimes(1);
+            expect(onSubmitSuccess).toHaveBeenLastCalledWith(onSubmitValue);
         });
 
-        it('calls `onSubmitFailure` when `onSubmit` rejects', async () => {
-            onSubmit.mockReturnValueOnce(Promise.reject());
+        it('calls `onSubmitFailure` with the thrown error when `onSubmit` rejects', async () => {
+            const onSubmitError = 'error';
+            onSubmit.mockReturnValueOnce(Promise.reject(onSubmitError));
 
             const wrapper = mount(
                 <BaseForm model={model} schema={schema} onSubmit={onSubmit} onSubmitFailure={onSubmitFailure} />
@@ -305,6 +333,7 @@ describe('BaseForm', () => {
             await new Promise(resolve => process.nextTick(resolve));
 
             expect(onSubmitFailure).toHaveBeenCalledTimes(1);
+            expect(onSubmitFailure).toHaveBeenLastCalledWith(onSubmitError);
         });
     });
 });

packages/uniforms/__tests__/connectField.js

@@ -13,7 +13,15 @@ describe('connectField', () => {
     const error = new Error();
     const onChange = jest.fn();
     const randomId = randomIds();
-    const state = {changed: !1, changedMap: {}, label: !0, disabled: !1, placeholder: !1, showInlineError: !0};
+    const state = {
+        changed: false,
+        changedMap: {},
+        submitting: false,
+        label: true,
+        disabled: false,
+        placeholder: false,
+        showInlineError: true
+    };
     const schema = createSchemaBridge({
         getDefinition (name) {
             return {

packages/uniforms/__tests__/injectName.js

@@ -14,7 +14,15 @@ describe('injectName', () => {
     const error = new Error();
     const onChange = () => {};
     const randomId = randomIds();
-    const state = {changed: !1, changedMap: {}, label: !0, disabled: !1, placeholder: !1, showInlineError: !0};
+    const state = {
+        changed: false,
+        changedMap: {},
+        submitting: false,
+        label: true,
+        disabled: false,
+        placeholder: false,
+        showInlineError: true
+    };
     const schema = createSchemaBridge({
         getDefinition (name) {
             return {

packages/uniforms/src/BaseForm.js

@@ -3,6 +3,7 @@ import React       from 'react';
 import cloneDeep   from 'lodash/cloneDeep';
 import get         from 'lodash/get';
 import set         from 'lodash/set';
+import isFunction  from 'lodash/isFunction';
 import {Component} from 'react';
 
 import changedKeys        from './changedKeys';
@@ -65,6 +66,7 @@ export default class BaseForm extends Component {
             state: PropTypes.shape({
                 changed:    PropTypes.bool.isRequired,
                 changedMap: PropTypes.object.isRequired,
+                submitting: PropTypes.bool.isRequired,
 
                 label:           PropTypes.bool.isRequired,
                 disabled:        PropTypes.bool.isRequired,
@@ -80,7 +82,13 @@ export default class BaseForm extends Component {
     constructor () {
         super(...arguments);
 
-        this.state = {bridge: createSchemaBridge(this.props.schema), changed: null, changedMap: {}, resetCount: 0};
+        this.state = {
+            bridge: createSchemaBridge(this.props.schema),
+            changed: null,
+            changedMap: {},
+            submitting: false,
+            resetCount: 0
+        };
 
         this.delayId = false;
         this.randomId = randomIds(this.props.id);
@@ -126,8 +134,9 @@ export default class BaseForm extends Component {
 
     getChildContextState () {
         return {
-            changed:  !!this.state.changed,
-            changedMap: this.state.changedMap,
+            changed:    !!this.state.changed,
+            changedMap:   this.state.changedMap,
+            submitting: !!this.state.submitting,
 
             label:           !!this.props.label,
             disabled:        !!this.props.disabled,
@@ -225,7 +234,7 @@ export default class BaseForm extends Component {
     }
 
     __reset (state) {
-        return {changed: false, changedMap: {}, resetCount: state.resetCount + 1};
+        return {changed: false, changedMap: {}, submitting: false, resetCount: state.resetCount + 1};
     }
 
     onReset () {
@@ -238,10 +247,16 @@ export default class BaseForm extends Component {
             event.stopPropagation();
         }
 
-        return Promise.resolve(
-            this.props.onSubmit &&
-            this.props.onSubmit(this.getModel('submit'))
-        ).then(
+        const result = this.props.onSubmit && this.props.onSubmit(this.getModel('submit'));
+        let submitting = Promise.resolve(result);
+
+        // Do not change the `submitting` state if onSubmit is not async
+        if (result && isFunction(result.then)) {
+            this.setState({submitting: true});
+            submitting = submitting.finally(() => this.setState({submitting: false}));
+        }
+
+        return submitting.then(
             this.props.onSubmitSuccess,
             this.props.onSubmitFailure
         );

packages/uniforms/src/filterDOMProps.js

@@ -20,6 +20,7 @@ const unwantedProps = [
     'parent',
     'placeholder',
     'showInlineError',
+    'submitting',
     'transform',
     'value',