Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Pass all arguments from react-hook-form to onSubmit #8199

Merged
merged 1 commit into from
Sep 27, 2022
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
55 changes: 44 additions & 11 deletions packages/ra-core/src/form/Form.spec.tsx
Original file line number Diff line number Diff line change
@@ -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()
);
});
});
});
9 changes: 7 additions & 2 deletions packages/ra-core/src/form/Form.tsx
Original file line number Diff line number Diff line change
@@ -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<RaRecord>;
resource?: string;
onSubmit?: (data: FieldValues) => any | Promise<any>;
onSubmit?: SubmitHandler<FieldValues>;
warnWhenUnsavedChanges?: boolean;
}
15 changes: 10 additions & 5 deletions packages/ra-core/src/form/useAugmentedForm.ts
Original file line number Diff line number Diff line change
@@ -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<RaRecord>;
onSubmit?: (data: FieldValues) => any | Promise<any>;
onSubmit?: SubmitHandler<FieldValues>;
warnWhenUnsavedChanges?: boolean;
}
Original file line number Diff line number Diff line change
@@ -737,9 +737,12 @@ describe('<SimpleFormIterator />', () => {
fireEvent.click(addItemElement);
fireEvent.click(screen.getByText('ra.action.save'));
await waitFor(() => {
expect(save).toHaveBeenCalledWith({
emails: [{ email: '' }],
});
expect(save).toHaveBeenCalledWith(
{
emails: [{ email: '' }],
},
expect.anything()
);
});
});
});
18 changes: 12 additions & 6 deletions packages/ra-ui-materialui/src/input/CheckboxGroupInput.spec.tsx
Original file line number Diff line number Diff line change
@@ -244,9 +244,12 @@ describe('<CheckboxGroupInput />', () => {
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('<CheckboxGroupInput />', () => {
fireEvent.click(getByLabelText('Save'));

await waitFor(() => {
expect(handleSubmit).toHaveBeenCalledWith({
notifications: [31, 42, 12],
});
expect(handleSubmit).toHaveBeenCalledWith(
{
notifications: [31, 42, 12],
},
expect.anything()
);
});
});

45 changes: 30 additions & 15 deletions packages/ra-ui-materialui/src/input/DateInput.spec.tsx
Original file line number Diff line number Diff line change
@@ -50,9 +50,12 @@ describe('<DateInput />', () => {
});
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('<DateInput />', () => {
});
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('<DateInput />', () => {
});
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('<DateInput />', () => {
});
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('<DateInput />', () => {
});
fireEvent.click(screen.getByLabelText('ra.action.save'));
await waitFor(() => {
expect(onSubmit).toHaveBeenCalledWith({
publishedAt: null,
});
expect(onSubmit).toHaveBeenCalledWith(
{
publishedAt: null,
},
expect.anything()
);
});
});

18 changes: 12 additions & 6 deletions packages/ra-ui-materialui/src/input/DateTimeInput.spec.tsx
Original file line number Diff line number Diff line change
@@ -105,9 +105,12 @@ describe('<DateTimeInput />', () => {
).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('<DateTimeInput />', () => {
).not.toBeNull();
fireEvent.click(screen.getByLabelText('ra.action.save'));
await waitFor(() => {
expect(onSubmit).toHaveBeenCalledWith({
publishedAt,
});
expect(onSubmit).toHaveBeenCalledWith(
{
publishedAt,
},
expect.anything()
);
});
});

91 changes: 56 additions & 35 deletions packages/ra-ui-materialui/src/input/FileInput.spec.tsx
Original file line number Diff line number Diff line change
@@ -154,9 +154,12 @@ describe('<FileInput />', () => {
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('<FileInput />', () => {
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('<FileInput />', () => {
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('<FileInput />', () => {
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('<FileInput />', () => {
});
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('<FileInput />', () => {
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('<FileInput />', () => {
fireEvent.click(screen.getByLabelText('ra.action.save'));

await waitFor(() => {
expect(onSubmit).toHaveBeenCalledWith({
image: null,
});
expect(onSubmit).toHaveBeenCalledWith(
{
image: null,
},
expect.anything()
);
});
});
});
47 changes: 28 additions & 19 deletions packages/ra-ui-materialui/src/input/ImageInput.spec.tsx
Original file line number Diff line number Diff line change
@@ -157,9 +157,12 @@ describe('<ImageInput />', () => {
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('<ImageInput />', () => {
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('<ImageInput />', () => {
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()
);
});
});

25 changes: 20 additions & 5 deletions packages/ra-ui-materialui/src/input/NumberInput.spec.tsx
Original file line number Diff line number Diff line change
@@ -213,7 +213,10 @@ describe('<NumberInput />', () => {
);
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('<NumberInput />', () => {
);
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('<NumberInput />', () => {
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('<NumberInput />', () => {
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('<NumberInput />', () => {
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()
);
});
});
});
18 changes: 12 additions & 6 deletions packages/ra-ui-materialui/src/input/TimeInput.spec.tsx
Original file line number Diff line number Diff line change
@@ -101,9 +101,12 @@ describe('<TimeInput />', () => {
).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('<TimeInput />', () => {
).not.toBeNull();
fireEvent.click(screen.getByLabelText('ra.action.save'));
await waitFor(() => {
expect(onSubmit).toHaveBeenCalledWith({
publishedAt,
});
expect(onSubmit).toHaveBeenCalledWith(
{
publishedAt,
},
expect.anything()
);
});
});

33 changes: 18 additions & 15 deletions packages/ra-ui-materialui/src/input/TranslatableInputs.spec.tsx
Original file line number Diff line number Diff line change
@@ -172,23 +172,26 @@ describe('<TranslatableInputs />', () => {
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()
);
});
});