Material-ui Autocomplete warning The value provided to Autocomplete is invalid

Question

Basically the reason why you get the warning is a default implementation of getOptionSelected in version 4.x.x:

 getOptionSelected = (option, value) => option === value

In your case, selecting a value the following comparison happens:

// option === value:
{id:1, name:"test"} === {id:1, name:"test"} // false

Obviously, it can be true in some circumstances. In this particular case, it’s false because of objects pointing to the different instances.

Solution! You have to overwrite getOptionSelected implementation:

<Autocomplete
 getOptionSelected={(option, value) => option.id === value.id}
 ...otherProps
/>

[Update]
Note, in version 5.x.x the prop was renamed:

-  getOptionSelected={(option, value) => option.id === value.id}
+  isOptionEqualToValue={(option, value) => option.id === value.id}