Autocomplete clear button acting as type="submit" by default

[mattshipitfi]

Steps to reproduce 🕹

Hi, thanks for the great library, and sorry if this has been reported elsewhere.

Link to live example:
Here is a basic HTML repro that illustrates the problem:

<form>
    <button>mui autocomplete clear button</button>
    <input />
</form>

Steps :

1. Add a mui-joy autocomplete field within a form tag
2. Add a second text input
3. Type some text into the second input, hit the enter key

Current behavior 😯

I've found what I think is a little usability issue and something that is probably very easy to change. Basically the clear button in a MUI-joy auto-complete field doesn't have the type attribute which means it defaults to type="submit".

This can result in the form getting submitted when the clear button is clicked or when the user hits the enter key in another field, if the field resides in a form tag.

Expected behavior 🤔

I think a clear button should never have the capability of submitting the form on behalf of the user as the clear button is explicitly for clearing the autocomplete field only, so my hope is you could add the type="button" attribute to the clear button

Context 🔦

I have my form fields wrapped in a form tag because 1) it's semantically correct, 2) I want to use native form validation which is very useful for mobile and reducing the number of translations needed (and I need to trigger it manually at a certain point).

The clear button being present as a submit button by default, tells the browser that the enter key should be able to trigger a form submit before I'm ready for them to submit.

Your environment 🌎

No response

[brijeshb42]

Meanwhile, you can pass

<Autocomplete slotProps={{clearIndicator: {type: "button"}} ... />

as a workaround till the fix for it is merged.

[mattshipitfi]

You're awesome, thank you!!