AutocompleteInput cause material error when I want customize input style

[mohandes-jiri]

I have a custom AutocompleteInput like this:

<AutocompleteInput
	{...props}
	variant="filled"
	options={{
		InputProps: {
			classes: {
				marginDense: classes.inputRoot,
				input: classes.input,
				underline: classes.inputUnderline,
				error: classes.inputError,
				ocused: classes.inputFocused,
			},
		},
	}}
/>

These classes delivered to the material Input component, not TextField and work fine.

But in console raising error like this:

When I investigating for reason in react admin project code I found this line

react-admin/packages/ra-ui-materialui/src/input/AutocompleteInput.tsx

Line 484 in c6c43bc

...InputProps,

That return classes field in inputProps then in this line you pass this props to TextField component

react-admin/packages/ra-ui-materialui/src/input/AutocompleteInput.tsx

Line 545 in c6c43bc

{...inputProps}

[djhi]

Thanks for reporting this. Please provide a sample application showing the issue by forking the following CodeSandbox (https://codesandbox.io/s/github/marmelab/react-admin/tree/master/examples/simple).

[mohandes-jiri]

@djhi
Hi,
I provide a sample at this link

https://codesandbox.io/s/frosty-tdd-plo2r?file=/src/comments/CommentCreate.tsx

Please check the console in creating the comment form.
Each render of this page causes the errors I mentioned above.

[mohandes-jiri]

@djhi
Hi again!
Is my sample code OK?

[fzaninotto]

Indeed, we're passing the InputProps to two different components. Thanks for the reproduction, I'm marking this as a bug.

[mohandes-jiri]

@fzaninotto
You're right.
I think by sanitizing the InputProps to eject classes filed this issue should be solved easily.

[mohandes-jiri]

@fzaninotto
I test 3.17.1 and still has errors.
I opened PR.
Thank you.

[mohandes-jiri]

@djhi @fzaninotto
Hi, again guys,
I understand this definitely doesn't have priority for you, but the huge development error message heavily suffers us in the team.