Unable to disable the browser auto complete feature for the Autocomplete component

In continuation of below closed thread, I’m still unable to disable browser auto complete feature. https://github.com/mui-org/material-ui/issues/18686

1. The only way I could get autoComplete disabled in Chrome(84.0)/ mac is by having Label value of Autocomplete component to some unrelated text Eg random-text. If i have some appropriate values for label such as Country, or City, then the browser’s auto complete is enabled. But need to have an appropriate label for the field in UI.

2. Also, I tried passing the inputProps like this <Autocomplete renderInput={ (params) => (<TextField label="Country" inputProps={{ autoComplete: 'new-password' }} /> )} />

This time I do see that autoComplete attribute’s value is passed to the page but when i click on that field in UI, I get the below error. useAutocomplete.js:919 Uncaught TypeError: Cannot read property 'focus' of null at handleClick (useAutocomplete.js:919) at HTMLUnknownElement.callCallback (react-dom.development.js:336) which leads to this line in autoComplete.js var handleClick = function handleClick() { **inputRef.current.focus();**

1. I noticed that I could disable browser autofill manually, by going Chrome-Dev Tools > Inspect Autocomplete component, then: either a) remove id attribute(thats auto generated) or b)update autoComplete attribute to a randomText. But couldn’t figure out how to get this working in code.

Environment: React: 16.12.x; Material-ui/lab: 4.0.0-alpha.49;

thanks for your help!

[dan-mba]

Google Chrome does not currently support autocomplete=off. Issue 587466

I am willing to update the doc to mention this limitation. The doc also might want to mention that using autocomplete=new-password will cause some browsers to recommend a new strong password which might create confusion for non-password fields.

[LethalPants]

Can I work on this?