diff --git a/__tests__/Formsy.spec.tsx b/__tests__/Formsy.spec.tsx index 646636d4..d34c0c2c 100755 --- a/__tests__/Formsy.spec.tsx +++ b/__tests__/Formsy.spec.tsx @@ -172,6 +172,7 @@ describe('mapModel', () => { { 'parent.child': 'test', testChange: true }, expect.any(Function), expect.any(Function), + expect.any(Object), ); }); }); @@ -556,7 +557,12 @@ describe('value === false', () => { const form = mount(); form.simulate('submit'); - expect(onSubmit).toHaveBeenCalledWith({ foo: false }, expect.any(Function), expect.any(Function)); + expect(onSubmit).toHaveBeenCalledWith( + { foo: false }, + expect.any(Function), + expect.any(Function), + expect.any(Object), + ); }); it('should allow dynamic changes to false', () => { @@ -589,7 +595,12 @@ describe('value === false', () => { const form = mount(); (form.instance() as TestForm).changeValue(); form.simulate('submit'); - expect(onSubmit).toHaveBeenCalledWith({ foo: false }, expect.any(Function), expect.any(Function)); + expect(onSubmit).toHaveBeenCalledWith( + { foo: false }, + expect.any(Function), + expect.any(Function), + expect.any(Object), + ); }); it('should say the form is submitted', () => { @@ -961,3 +972,27 @@ describe('form valid state', () => { expect(isValid).toEqual(true); }); }); + +describe('onSubmit/onValidSubmit/onInvalidSubmit', () => { + ['onSubmit', 'onValidSubmit', 'onInvalidSubmit'].forEach((key) => { + it(`should pass submit event to "${key}"`, () => { + const submitSpy = jest.fn(); + + const form = mount( + + + {key === 'onInvalidSubmit' && } + , + ); + const button = form.find('#submit'); + button.simulate('submit'); + + expect(submitSpy).toHaveBeenCalledWith( + expect.any(Object), + expect.any(Function), + expect.any(Function), + expect.objectContaining({ type: 'submit' }), + ); + }); + }); +}); diff --git a/src/Formsy.ts b/src/Formsy.ts index f3cfdae5..ff90d8e9 100644 --- a/src/Formsy.ts +++ b/src/Formsy.ts @@ -21,16 +21,23 @@ import { PassDownProps } from './withFormsy'; type FormHTMLAttributesCleaned = Omit, 'onChange' | 'onSubmit'>; +type OnSubmitCallback = ( + model: IModel, + resetModel: IResetModel, + updateInputsWithError: IUpdateInputsWithError, + event: React.SyntheticEvent>, +) => void; + export interface FormsyProps extends FormHTMLAttributesCleaned { disabled: boolean; mapping: null | ((model: IModel) => IModel); onChange: (model: IModel, isChanged: boolean) => void; onInvalid: () => void; - onInvalidSubmit: (model: IModel, resetModel: IResetModel, updateInputsWithError: IUpdateInputsWithError) => void; onReset?: () => void; - onSubmit?: (model: IModel, resetModel: IResetModel, updateInputsWithError: IUpdateInputsWithError) => void; + onSubmit?: OnSubmitCallback; + onValidSubmit?: OnSubmitCallback; + onInvalidSubmit: OnSubmitCallback; onValid: () => void; - onValidSubmit?: (model: IModel, resetModel: IResetModel, updateInputsWithError: IUpdateInputsWithError) => void; preventDefaultSubmit?: boolean; preventExternalInvalidation?: boolean; validationErrors?: null | object; @@ -331,7 +338,7 @@ export class Formsy extends React.Component { public isChanged = () => !utils.isSame(this.getPristineValues(), this.getCurrentValues()); // Update model, submit to url prop and send the model - public submit = (event?: any) => { + public submit = (event?: React.SyntheticEvent) => { const { onSubmit, onValidSubmit, onInvalidSubmit, preventDefaultSubmit } = this.props; const { isValid } = this.state; @@ -344,12 +351,12 @@ export class Formsy extends React.Component { // so validation becomes visible (if based on isPristine) this.setFormPristine(false); const model = this.getModel(); - onSubmit(model, this.resetModel, this.updateInputsWithError); + onSubmit(model, this.resetModel, this.updateInputsWithError, event); if (isValid) { - onValidSubmit(model, this.resetModel, this.updateInputsWithError); + onValidSubmit(model, this.resetModel, this.updateInputsWithError, event); } else { - onInvalidSubmit(model, this.resetModel, this.updateInputsWithError); + onInvalidSubmit(model, this.resetModel, this.updateInputsWithError, event); } };