From 4de39801c61f54808b1ef4b952357da6a913f8a4 Mon Sep 17 00:00:00 2001 From: Thomas Daniellou Date: Tue, 5 Sep 2023 15:35:23 +0200 Subject: [PATCH] fix tests --- .../ra-ui-materialui/src/input/AutocompleteInput.spec.tsx | 7 +++---- .../src/input/AutocompleteInput.stories.tsx | 7 ++++--- packages/ra-ui-materialui/src/input/AutocompleteInput.tsx | 7 ++----- 3 files changed, 9 insertions(+), 12 deletions(-) diff --git a/packages/ra-ui-materialui/src/input/AutocompleteInput.spec.tsx b/packages/ra-ui-materialui/src/input/AutocompleteInput.spec.tsx index d30053c8ede..3e744d090b6 100644 --- a/packages/ra-ui-materialui/src/input/AutocompleteInput.spec.tsx +++ b/packages/ra-ui-materialui/src/input/AutocompleteInput.spec.tsx @@ -992,7 +992,7 @@ describe('', () => { ); const input = screen.getByLabelText('resources.users.fields.role'); - fireEvent.change(input, { target: { value: 'a' } }); + userEvent.type(input, 'a'); await waitFor(() => { expect(screen.queryAllByRole('option').length).toEqual(2); }); @@ -1019,7 +1019,7 @@ describe('', () => { ); const input = screen.getByLabelText('resources.users.fields.role'); - fireEvent.change(input, { target: { value: 'ab' } }); + userEvent.type(input, 'ab'); await waitFor(() => expect(screen.queryAllByRole('option').length).toEqual(2) ); @@ -1355,8 +1355,7 @@ describe('', () => { 'Author' )) as HTMLInputElement; expect(input.value).toBe('Leo Tolstoy'); - fireEvent.mouseDown(input); - fireEvent.change(input, { target: { value: 'Leo Tolstoy test' } }); + userEvent.type(input, 'Leo Tolstoy test'); // Make sure that 'Leo Tolstoy' did not reappear let testFailed = false; try { diff --git a/packages/ra-ui-materialui/src/input/AutocompleteInput.stories.tsx b/packages/ra-ui-materialui/src/input/AutocompleteInput.stories.tsx index d9b19d55e67..244e09200c8 100644 --- a/packages/ra-ui-materialui/src/input/AutocompleteInput.stories.tsx +++ b/packages/ra-ui-materialui/src/input/AutocompleteInput.stories.tsx @@ -1121,10 +1121,11 @@ export const WithInputOnChange = () => { source="role" resource="users" choices={[ - { id: 1, name: 'bar' }, - { id: 2, name: 'foo' }, + { id: 1, name: 'ab' }, + { id: 2, name: 'abc' }, + { id: 3, name: '123' }, ]} - onInputChange={(_, value: string) => { + onInputChange={(_, value) => { setSearchText(value); }} /> diff --git a/packages/ra-ui-materialui/src/input/AutocompleteInput.tsx b/packages/ra-ui-materialui/src/input/AutocompleteInput.tsx index 4ca8e15b21b..91561c06a8a 100644 --- a/packages/ra-ui-materialui/src/input/AutocompleteInput.tsx +++ b/packages/ra-ui-materialui/src/input/AutocompleteInput.tsx @@ -528,13 +528,10 @@ If you provided a React element for the optionText prop, you must also provide t >['onInputChange'] >( (event, newInputValue, reason) => { - if ( - typeof event?.type === 'string' || - !doesQueryMatchSelection(newInputValue) - ) { + setFilterValue(newInputValue); + if (!doesQueryMatchSelection(newInputValue)) { debouncedSetFilter(newInputValue); } - setFilterValue(newInputValue); onInputChange?.(event, newInputValue, reason); }, [debouncedSetFilter, doesQueryMatchSelection, onInputChange]