diff --git a/packages/ra-ui-materialui/src/input/ArrayInput/ArrayInput.spec.tsx b/packages/ra-ui-materialui/src/input/ArrayInput/ArrayInput.spec.tsx
index 51b74aa3ad6..1da18ab454b 100644
--- a/packages/ra-ui-materialui/src/input/ArrayInput/ArrayInput.spec.tsx
+++ b/packages/ra-ui-materialui/src/input/ArrayInput/ArrayInput.spec.tsx
@@ -459,22 +459,61 @@ describe('', () => {
});
});
- it('should empty the input on form reset', async () => {
- render();
- fireEvent.click(await screen.findByRole('button', { name: 'Add' }));
- fireEvent.change(screen.getByLabelText('Name'), {
- target: { value: 'Leo Tolstoy' },
- });
- fireEvent.change(screen.getByLabelText('Role'), {
- target: { value: 'Writer' },
+ describe('should empty the input on form reset', () => {
+ it('should remove a filled line twice', async () => {
+ render();
+
+ expect(screen.queryAllByRole('listitem')).toHaveLength(0);
+
+ fireEvent.click(await screen.findByRole('button', { name: 'Add' }));
+ fireEvent.change(screen.getByLabelText('Name'), {
+ target: { value: 'Leo Tolstoy' },
+ });
+ fireEvent.change(screen.getByLabelText('Role'), {
+ target: { value: 'Writer' },
+ });
+
+ expect(screen.queryAllByRole('listitem')).toHaveLength(1);
+ fireEvent.click(screen.getByRole('button', { name: 'Reset' }));
+ await waitFor(() => {
+ expect(screen.queryAllByRole('listitem')).toHaveLength(0);
+ });
+
+ fireEvent.click(await screen.findByRole('button', { name: 'Add' }));
+ fireEvent.change(screen.getByLabelText('Name'), {
+ target: { value: 'Leo Tolstoy' },
+ });
+ fireEvent.change(screen.getByLabelText('Role'), {
+ target: { value: 'Writer' },
+ });
+
+ expect(screen.queryAllByRole('listitem')).toHaveLength(1);
+ fireEvent.click(screen.getByRole('button', { name: 'Reset' }));
+ await waitFor(() => {
+ expect(screen.queryAllByRole('listitem')).toHaveLength(0);
+ });
});
- fireEvent.click(screen.getByRole('button', { name: 'Reset' }));
- await waitFor(() => {
- expect(screen.queryByDisplayValue('Leo Tolstoy')).toBeNull();
- expect(screen.queryByDisplayValue('Writer')).toBeNull();
- expect(
- screen.queryByRole('button', { name: 'Clear the list' })
- ).toBeNull();
+
+ it('should remove an empty line twice', async () => {
+ render();
+
+ expect(screen.queryAllByRole('listitem')).toHaveLength(0);
+
+ fireEvent.click(await screen.findByRole('button', { name: 'Add' }));
+
+ expect(screen.queryAllByRole('listitem')).toHaveLength(1);
+ fireEvent.click(screen.getByRole('button', { name: 'Reset' }));
+ await waitFor(() => {
+ expect(screen.queryAllByRole('listitem')).toHaveLength(0);
+ });
+
+ fireEvent.click(await screen.findByRole('button', { name: 'Add' }));
+
+ expect(screen.queryAllByRole('listitem')).toHaveLength(1);
+ fireEvent.click(screen.getByRole('button', { name: 'Reset' }));
+ await waitFor(() => {
+ expect(screen.queryAllByRole('listitem')).toHaveLength(0);
+ });
});
});
});
diff --git a/packages/ra-ui-materialui/src/input/ArrayInput/ArrayInput.stories.tsx b/packages/ra-ui-materialui/src/input/ArrayInput/ArrayInput.stories.tsx
index 759d5efa7e4..8588c226888 100644
--- a/packages/ra-ui-materialui/src/input/ArrayInput/ArrayInput.stories.tsx
+++ b/packages/ra-ui-materialui/src/input/ArrayInput/ArrayInput.stories.tsx
@@ -12,7 +12,6 @@ import {
Resource,
testI18nProvider,
TestMemoryRouter,
- useCreatePath,
useSourceContext,
} from 'ra-core';
import { Button, InputAdornment, Stack } from '@mui/material';
@@ -970,10 +969,8 @@ const BookCreateReset = () => {
};
export const Reset = () => {
- const createPath = useCreatePath();
- const initialEntrie = createPath({ resource: 'books', type: 'create' });
return (
-
+
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 ec2e3ad4140..70c46da832a 100644
--- a/packages/ra-ui-materialui/src/input/ArrayInput/SimpleFormIterator.spec.tsx
+++ b/packages/ra-ui-materialui/src/input/ArrayInput/SimpleFormIterator.spec.tsx
@@ -18,7 +18,11 @@ import { SimpleForm } from '../../form';
import { ArrayInput } from './ArrayInput';
import { TextInput } from '../TextInput';
import { SimpleFormIterator } from './SimpleFormIterator';
-import { Basic, WithFormDataConsumer } from './SimpleFormIterator.stories';
+import {
+ Basic,
+ DefaultValue,
+ WithFormDataConsumer,
+} from './SimpleFormIterator.stories';
describe('', () => {
// bypass confirm leave form with unsaved changes
@@ -418,22 +422,7 @@ describe('', () => {
});
it('should not reapply default values set at form level after removing and then re-adding one row', async () => {
- render(
-
-
-
-
-
-
-
-
-
-
- );
+ render();
const removeFirstButton = getByLabelText(
// @ts-ignore
@@ -456,16 +445,24 @@ describe('', () => {
expect(inputElements.length).toBe(1);
});
- expect(
- screen
- .queryAllByLabelText('Email')
- .map(inputElement => (inputElement as HTMLInputElement).value)
- ).toEqual(['']);
- expect(
- screen
- .queryAllByLabelText('Name')
- .map(inputElement => (inputElement as HTMLInputElement).value)
- ).toEqual(['']);
+ await waitFor(() => {
+ expect(
+ screen
+ .queryAllByLabelText('Email')
+ .map(
+ inputElement => (inputElement as HTMLInputElement).value
+ )
+ ).toEqual(['']);
+ });
+ await waitFor(() => {
+ expect(
+ screen
+ .queryAllByLabelText('Name')
+ .map(
+ inputElement => (inputElement as HTMLInputElement).value
+ )
+ ).toEqual(['']);
+ });
expect(screen.queryAllByLabelText('ra.action.remove').length).toBe(1);
});
diff --git a/packages/ra-ui-materialui/src/input/ArrayInput/SimpleFormIterator.stories.tsx b/packages/ra-ui-materialui/src/input/ArrayInput/SimpleFormIterator.stories.tsx
index 36de4eb47d3..2780b29487a 100644
--- a/packages/ra-ui-materialui/src/input/ArrayInput/SimpleFormIterator.stories.tsx
+++ b/packages/ra-ui-materialui/src/input/ArrayInput/SimpleFormIterator.stories.tsx
@@ -237,6 +237,25 @@ export const UseSimpleFormIteratorItem = () => (
);
+export const DefaultValue = () => (
+
+
+
+
+
+
+
+
+
+
+
+
+);
+
export const WithFormDataConsumer = () => (
diff --git a/packages/ra-ui-materialui/src/input/ArrayInput/SimpleFormIterator.tsx b/packages/ra-ui-materialui/src/input/ArrayInput/SimpleFormIterator.tsx
index 5db9810ee30..d0c9d01973b 100644
--- a/packages/ra-ui-materialui/src/input/ArrayInput/SimpleFormIterator.tsx
+++ b/packages/ra-ui-materialui/src/input/ArrayInput/SimpleFormIterator.tsx
@@ -72,7 +72,7 @@ export const SimpleFormIterator = (inProps: SimpleFormIteratorProps) => {
const [confirmIsOpen, setConfirmIsOpen] = useState(false);
const { append, fields, move, remove, replace } = useArrayInput(props);
- const { resetField, trigger, getValues } = useFormContext();
+ const { trigger, getValues } = useFormContext();
const translate = useTranslate();
const record = useRecordContext(props);
const initialDefaultValue = useRef({});
@@ -134,10 +134,8 @@ export const SimpleFormIterator = (inProps: SimpleFormIteratorProps) => {
}
}
append(defaultValue);
- // Make sure the newly added inputs are not considered dirty by react-hook-form
- resetField(`${finalSource}.${fields.length}`, { defaultValue });
},
- [append, children, resetField, finalSource, fields.length]
+ [append, children]
);
const handleReorder = useCallback(