diff --git a/packages/ra-core/src/form/Form.spec.tsx b/packages/ra-core/src/form/Form.spec.tsx index 9c18fe6cf7e..2d99b3e8e15 100644 --- a/packages/ra-core/src/form/Form.spec.tsx +++ b/packages/ra-core/src/form/Form.spec.tsx @@ -210,7 +210,10 @@ describe('Form', () => { fireEvent.click(screen.getByText('Submit')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ foo: null }); + expect(onSubmit).toHaveBeenCalledWith( + { foo: null }, + expect.anything() + ); }); }); @@ -235,7 +238,10 @@ describe('Form', () => { fireEvent.click(screen.getByText('Submit')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ foo: { bar: null } }); + expect(onSubmit).toHaveBeenCalledWith( + { foo: { bar: null } }, + expect.anything() + ); }); }); @@ -257,7 +263,10 @@ describe('Form', () => { fireEvent.click(screen.getByText('Submit')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ foo: str }); + expect(onSubmit).toHaveBeenCalledWith( + { foo: str }, + expect.anything() + ); }); }); it('should accept date values', async () => { @@ -283,7 +292,10 @@ describe('Form', () => { fireEvent.click(screen.getByText('Submit')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ foo: date }); + expect(onSubmit).toHaveBeenCalledWith( + { foo: date }, + expect.anything() + ); }); }); @@ -310,7 +322,10 @@ describe('Form', () => { fireEvent.click(screen.getByText('Submit')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ foo: arr }); + expect(onSubmit).toHaveBeenCalledWith( + { foo: arr }, + expect.anything() + ); }); }); @@ -337,7 +352,10 @@ describe('Form', () => { fireEvent.click(screen.getByText('Submit')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ foo: obj }); + expect(onSubmit).toHaveBeenCalledWith( + { foo: obj }, + expect.anything() + ); }); }); it('should accept deep object values', async () => { @@ -363,7 +381,10 @@ describe('Form', () => { fireEvent.click(screen.getByText('Submit')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ foo: obj }); + expect(onSubmit).toHaveBeenCalledWith( + { foo: obj }, + expect.anything() + ); }); }); it('should accept object values in arrays', async () => { @@ -389,7 +410,10 @@ describe('Form', () => { fireEvent.click(screen.getByText('Submit')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ foo: obj }); + expect(onSubmit).toHaveBeenCalledWith( + { foo: obj }, + expect.anything() + ); }); }); it('should accept adding objects in arrays', async () => { @@ -418,7 +442,10 @@ describe('Form', () => { fireEvent.click(screen.getByText('Submit')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ foo: obj }); + expect(onSubmit).toHaveBeenCalledWith( + { foo: obj }, + expect.anything() + ); }); }); it('should accept removing objects in array of objects', async () => { @@ -449,7 +476,10 @@ describe('Form', () => { fireEvent.click(screen.getByText('Submit')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ foo: obj }); + expect(onSubmit).toHaveBeenCalledWith( + { foo: obj }, + expect.anything() + ); }); }); describe('defaultValues', () => { @@ -519,7 +549,10 @@ describe('Form', () => { fireEvent.click(screen.getByText('Submit')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith(values); + expect(onSubmit).toHaveBeenCalledWith( + values, + expect.anything() + ); }); }); }); diff --git a/packages/ra-core/src/form/Form.tsx b/packages/ra-core/src/form/Form.tsx index cc8ad7440b1..3589e55f1f3 100644 --- a/packages/ra-core/src/form/Form.tsx +++ b/packages/ra-core/src/form/Form.tsx @@ -1,6 +1,11 @@ import * as React from 'react'; import { ReactNode } from 'react'; -import { FormProvider, FieldValues, UseFormProps } from 'react-hook-form'; +import { + FormProvider, + FieldValues, + UseFormProps, + SubmitHandler, +} from 'react-hook-form'; import { FormGroupsProvider } from './FormGroupsProvider'; import { RaRecord } from '../types'; @@ -77,6 +82,6 @@ export interface FormOwnProps { id?: string; record?: Partial; resource?: string; - onSubmit?: (data: FieldValues) => any | Promise; + onSubmit?: SubmitHandler; warnWhenUnsavedChanges?: boolean; } diff --git a/packages/ra-core/src/form/useAugmentedForm.ts b/packages/ra-core/src/form/useAugmentedForm.ts index 279b6fe2182..56a2f67467e 100644 --- a/packages/ra-core/src/form/useAugmentedForm.ts +++ b/packages/ra-core/src/form/useAugmentedForm.ts @@ -1,5 +1,10 @@ import { BaseSyntheticEvent, useCallback, useMemo, useEffect } from 'react'; -import { FieldValues, useForm, UseFormProps } from 'react-hook-form'; +import { + FieldValues, + SubmitHandler, + useForm, + UseFormProps, +} from 'react-hook-form'; import { RaRecord } from '../types'; import { useSaveContext } from '../controller'; @@ -135,14 +140,14 @@ export const useAugmentedForm = (props: UseAugmentedFormProps) => { // submit callbacks const handleSubmit = useCallback( - async values => { + async (values, event) => { let errors; if (onSubmit) { - errors = await onSubmit(values); + errors = await onSubmit(values, event); } if (onSubmit == null && saveContext?.save) { - errors = await saveContext.save(values); + errors = await saveContext.save(values, event); } if (errors != null) { setSubmissionErrors(errors, form.setError); @@ -179,6 +184,6 @@ export interface UseFormOwnProps { defaultValues?: any; formRootPathname?: string; record?: Partial; - onSubmit?: (data: FieldValues) => any | Promise; + onSubmit?: SubmitHandler; warnWhenUnsavedChanges?: boolean; } diff --git a/packages/ra-ui-materialui/src/input/ArrayInput/SimpleFormIterator.spec.tsx b/packages/ra-ui-materialui/src/input/ArrayInput/SimpleFormIterator.spec.tsx index e08247c92ee..e0161fde27e 100644 --- a/packages/ra-ui-materialui/src/input/ArrayInput/SimpleFormIterator.spec.tsx +++ b/packages/ra-ui-materialui/src/input/ArrayInput/SimpleFormIterator.spec.tsx @@ -737,9 +737,12 @@ describe('', () => { fireEvent.click(addItemElement); fireEvent.click(screen.getByText('ra.action.save')); await waitFor(() => { - expect(save).toHaveBeenCalledWith({ - emails: [{ email: '' }], - }); + expect(save).toHaveBeenCalledWith( + { + emails: [{ email: '' }], + }, + expect.anything() + ); }); }); }); diff --git a/packages/ra-ui-materialui/src/input/CheckboxGroupInput.spec.tsx b/packages/ra-ui-materialui/src/input/CheckboxGroupInput.spec.tsx index 9796186c49e..5e413ed27e8 100644 --- a/packages/ra-ui-materialui/src/input/CheckboxGroupInput.spec.tsx +++ b/packages/ra-ui-materialui/src/input/CheckboxGroupInput.spec.tsx @@ -244,9 +244,12 @@ describe('', () => { fireEvent.click(getByLabelText('Save')); await waitFor(() => { - expect(handleSubmit).toHaveBeenCalledWith({ - notifications: ['31', '42', '12'], - }); + expect(handleSubmit).toHaveBeenCalledWith( + { + notifications: ['31', '42', '12'], + }, + expect.anything() + ); }); }); @@ -275,9 +278,12 @@ describe('', () => { fireEvent.click(getByLabelText('Save')); await waitFor(() => { - expect(handleSubmit).toHaveBeenCalledWith({ - notifications: [31, 42, 12], - }); + expect(handleSubmit).toHaveBeenCalledWith( + { + notifications: [31, 42, 12], + }, + expect.anything() + ); }); }); diff --git a/packages/ra-ui-materialui/src/input/DateInput.spec.tsx b/packages/ra-ui-materialui/src/input/DateInput.spec.tsx index d080fcba61c..6d9f631796e 100644 --- a/packages/ra-ui-materialui/src/input/DateInput.spec.tsx +++ b/packages/ra-ui-materialui/src/input/DateInput.spec.tsx @@ -50,9 +50,12 @@ describe('', () => { }); fireEvent.click(screen.getByLabelText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ - publishedAt: '2021-10-22', - }); + expect(onSubmit).toHaveBeenCalledWith( + { + publishedAt: '2021-10-22', + }, + expect.anything() + ); }); }); @@ -77,9 +80,12 @@ describe('', () => { }); fireEvent.click(screen.getByLabelText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ - publishedAt: '2021-10-22', - }); + expect(onSubmit).toHaveBeenCalledWith( + { + publishedAt: '2021-10-22', + }, + expect.anything() + ); }); }); @@ -104,9 +110,12 @@ describe('', () => { }); fireEvent.click(screen.getByLabelText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ - publishedAt: '2021-10-22', - }); + expect(onSubmit).toHaveBeenCalledWith( + { + publishedAt: '2021-10-22', + }, + expect.anything() + ); }); }); @@ -131,9 +140,12 @@ describe('', () => { }); fireEvent.click(screen.getByLabelText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ - publishedAt: new Date('2021-10-22'), - }); + expect(onSubmit).toHaveBeenCalledWith( + { + publishedAt: new Date('2021-10-22'), + }, + expect.anything() + ); }); }); @@ -158,9 +170,12 @@ describe('', () => { }); fireEvent.click(screen.getByLabelText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ - publishedAt: null, - }); + expect(onSubmit).toHaveBeenCalledWith( + { + publishedAt: null, + }, + expect.anything() + ); }); }); diff --git a/packages/ra-ui-materialui/src/input/DateTimeInput.spec.tsx b/packages/ra-ui-materialui/src/input/DateTimeInput.spec.tsx index 2518e0f38b4..756bf64ba17 100644 --- a/packages/ra-ui-materialui/src/input/DateTimeInput.spec.tsx +++ b/packages/ra-ui-materialui/src/input/DateTimeInput.spec.tsx @@ -105,9 +105,12 @@ describe('', () => { ).not.toBeNull(); fireEvent.click(screen.getByLabelText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ - publishedAt, - }); + expect(onSubmit).toHaveBeenCalledWith( + { + publishedAt, + }, + expect.anything() + ); }); }); @@ -138,9 +141,12 @@ describe('', () => { ).not.toBeNull(); fireEvent.click(screen.getByLabelText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ - publishedAt, - }); + expect(onSubmit).toHaveBeenCalledWith( + { + publishedAt, + }, + expect.anything() + ); }); }); diff --git a/packages/ra-ui-materialui/src/input/FileInput.spec.tsx b/packages/ra-ui-materialui/src/input/FileInput.spec.tsx index 85dc5fa3506..483afabb1dc 100644 --- a/packages/ra-ui-materialui/src/input/FileInput.spec.tsx +++ b/packages/ra-ui-materialui/src/input/FileInput.spec.tsx @@ -154,9 +154,12 @@ describe('', () => { fireEvent.click(screen.getByLabelText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ - image: null, - }); + expect(onSubmit).toHaveBeenCalledWith( + { + image: null, + }, + expect.anything() + ); }); }); @@ -192,14 +195,17 @@ describe('', () => { fireEvent.click(screen.getByLabelText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ - images: [ - { - src: 'test2.png', - title: 'cats2', - }, - ], - }); + expect(onSubmit).toHaveBeenCalledWith( + { + images: [ + { + src: 'test2.png', + title: 'cats2', + }, + ], + }, + expect.anything() + ); }); }); @@ -240,14 +246,17 @@ describe('', () => { fireEvent.click(screen.getByLabelText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ - images: [ - { - src: 'test.png', - title: 'cats', - }, - ], - }); + expect(onSubmit).toHaveBeenCalledWith( + { + images: [ + { + src: 'test.png', + title: 'cats', + }, + ], + }, + expect.anything() + ); }); }); @@ -292,12 +301,15 @@ describe('', () => { fireEvent.click(screen.getByLabelText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ - image: { - src: 'test.png', - title: 'cats', + expect(onSubmit).toHaveBeenCalledWith( + { + image: { + src: 'test.png', + title: 'cats', + }, }, - }); + expect.anything() + ); }); }); @@ -339,12 +351,15 @@ describe('', () => { }); fireEvent.click(screen.getByLabelText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ - image: { - src: 'test.png', - title: 'cats', + expect(onSubmit).toHaveBeenCalledWith( + { + image: { + src: 'test.png', + title: 'cats', + }, }, - }); + expect.anything() + ); }); }); }); @@ -381,9 +396,12 @@ describe('', () => { fireEvent.click(screen.getByLabelText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ - image: null, - }); + expect(onSubmit).toHaveBeenCalledWith( + { + image: null, + }, + expect.anything() + ); }); }); it('promise function', async () => { @@ -417,9 +435,12 @@ describe('', () => { fireEvent.click(screen.getByLabelText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ - image: null, - }); + expect(onSubmit).toHaveBeenCalledWith( + { + image: null, + }, + expect.anything() + ); }); }); }); diff --git a/packages/ra-ui-materialui/src/input/ImageInput.spec.tsx b/packages/ra-ui-materialui/src/input/ImageInput.spec.tsx index 67e063414fc..5af06ea9c6b 100644 --- a/packages/ra-ui-materialui/src/input/ImageInput.spec.tsx +++ b/packages/ra-ui-materialui/src/input/ImageInput.spec.tsx @@ -157,9 +157,12 @@ describe('', () => { fireEvent.click(screen.getByLabelText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ - image: null, - }); + expect(onSubmit).toHaveBeenCalledWith( + { + image: null, + }, + expect.anything() + ); }); }); @@ -195,14 +198,17 @@ describe('', () => { fireEvent.click(screen.getByLabelText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ - images: [ - { - src: 'test2.png', - title: 'cats2', - }, - ], - }); + expect(onSubmit).toHaveBeenCalledWith( + { + images: [ + { + src: 'test2.png', + title: 'cats2', + }, + ], + }, + expect.anything() + ); }); }); @@ -239,14 +245,17 @@ describe('', () => { fireEvent.click(screen.getByLabelText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ - images: [ - { - src: 'test.png', - title: 'cats', - }, - ], - }); + expect(onSubmit).toHaveBeenCalledWith( + { + images: [ + { + src: 'test.png', + title: 'cats', + }, + ], + }, + expect.anything() + ); }); }); diff --git a/packages/ra-ui-materialui/src/input/NumberInput.spec.tsx b/packages/ra-ui-materialui/src/input/NumberInput.spec.tsx index 891f76550c8..5c9554734c4 100644 --- a/packages/ra-ui-materialui/src/input/NumberInput.spec.tsx +++ b/packages/ra-ui-materialui/src/input/NumberInput.spec.tsx @@ -213,7 +213,10 @@ describe('', () => { ); fireEvent.click(screen.getByText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ views: 12 }); + expect(onSubmit).toHaveBeenCalledWith( + { views: 12 }, + expect.anything() + ); }); expect(typeof onSubmit.mock.calls[0][0].views).toEqual('number'); }); @@ -229,7 +232,10 @@ describe('', () => { ); fireEvent.click(screen.getByText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ views: null }); + expect(onSubmit).toHaveBeenCalledWith( + { views: null }, + expect.anything() + ); }); expect(onSubmit.mock.calls[0][0].views).toBeNull(); }); @@ -251,7 +257,10 @@ describe('', () => { fireEvent.change(input, { target: { value: '3' } }); fireEvent.click(screen.getByText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ views: 3 }); + expect(onSubmit).toHaveBeenCalledWith( + { views: 3 }, + expect.anything() + ); }); expect(typeof onSubmit.mock.calls[0][0].views).toEqual('number'); }); @@ -273,7 +282,10 @@ describe('', () => { fireEvent.change(input, { target: { value: '' } }); fireEvent.click(screen.getByText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ views: null }); + expect(onSubmit).toHaveBeenCalledWith( + { views: null }, + expect.anything() + ); }); expect(onSubmit.mock.calls[0][0].views).toBeNull(); }); @@ -324,7 +336,10 @@ describe('', () => { expect(value).toEqual('3'); fireEvent.click(screen.getByText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ views: 3 }); + expect(onSubmit).toHaveBeenCalledWith( + { views: 3 }, + expect.anything() + ); }); }); }); diff --git a/packages/ra-ui-materialui/src/input/TimeInput.spec.tsx b/packages/ra-ui-materialui/src/input/TimeInput.spec.tsx index 7bd440fd479..148264704fa 100644 --- a/packages/ra-ui-materialui/src/input/TimeInput.spec.tsx +++ b/packages/ra-ui-materialui/src/input/TimeInput.spec.tsx @@ -101,9 +101,12 @@ describe('', () => { ).not.toBeNull(); fireEvent.click(screen.getByLabelText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ - publishedAt, - }); + expect(onSubmit).toHaveBeenCalledWith( + { + publishedAt, + }, + expect.anything() + ); }); }); @@ -129,9 +132,12 @@ describe('', () => { ).not.toBeNull(); fireEvent.click(screen.getByLabelText('ra.action.save')); await waitFor(() => { - expect(onSubmit).toHaveBeenCalledWith({ - publishedAt, - }); + expect(onSubmit).toHaveBeenCalledWith( + { + publishedAt, + }, + expect.anything() + ); }); }); diff --git a/packages/ra-ui-materialui/src/input/TranslatableInputs.spec.tsx b/packages/ra-ui-materialui/src/input/TranslatableInputs.spec.tsx index 68af3747425..758023c28a3 100644 --- a/packages/ra-ui-materialui/src/input/TranslatableInputs.spec.tsx +++ b/packages/ra-ui-materialui/src/input/TranslatableInputs.spec.tsx @@ -172,23 +172,26 @@ describe('', () => { fireEvent.click(screen.getByText('ra.action.save')); await waitFor(() => { - expect(save).toHaveBeenCalledWith({ - id: 123, - name: { - en: 'english name updated', - fr: 'french name', - }, - description: { - en: 'english description', - fr: 'french description', - }, - nested: { - field: { - en: 'english nested field', - fr: 'french nested field updated', + expect(save).toHaveBeenCalledWith( + { + id: 123, + name: { + en: 'english name updated', + fr: 'french name', + }, + description: { + en: 'english description', + fr: 'french description', + }, + nested: { + field: { + en: 'english nested field', + fr: 'french nested field updated', + }, }, }, - }); + expect.anything() + ); }); });