Skip to content

Commit

Permalink
[material-ui][Autocomplete] Remove autocomplete warning regarding val…
Browse files Browse the repository at this point in the history
…ue not equal to option (#43314)

Signed-off-by: Zeeshan Tamboli <zeeshan.tamboli@gmail.com>
Co-authored-by: Aarón García Hervás <aaron.garcia.hervas@gmail.com>
Co-authored-by: Michał Dudak <michal.dudak@gmail.com>
  • Loading branch information
3 people authored Aug 16, 2024
1 parent 8451673 commit b949d17
Show file tree
Hide file tree
Showing 3 changed files with 2 additions and 47 deletions.
2 changes: 2 additions & 0 deletions docs/data/material/components/autocomplete/autocomplete.md
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,8 @@ const options = ['The Godfather', 'Pulp Fiction'];

However, you can use different structures by providing a `getOptionLabel` prop.

If your options are objects, you must provide the `isOptionEqualToValue` prop to ensure correct selection and highlighting. By default, it uses strict equality to compare options with the current value.

### Playground

Each of the following examples demonstrates one feature of the Autocomplete component.
Expand Down
25 changes: 0 additions & 25 deletions packages/mui-material/src/Autocomplete/Autocomplete.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -1719,31 +1719,6 @@ describe('<Autocomplete />', () => {
);
});

it('warn if value does not exist in options list', () => {
const value = 'not a good value';
const options = ['first option', 'second option'];

const errorMessage = 'None of the options match with `"not a good value"`';

let expectedOccurrences = 4;

if (reactMajor === 18) {
expectedOccurrences = 6;
} else if (reactMajor === 17) {
expectedOccurrences = 2;
}

expect(() => {
render(
<Autocomplete
value={value}
options={options}
renderInput={(params) => <TextField {...params} />}
/>,
);
}).toWarnDev(Array(expectedOccurrences).fill(errorMessage));
});

it('warn if groups options are not sorted', () => {
const data = [
{ group: 1, value: 'A' },
Expand Down
22 changes: 0 additions & 22 deletions packages/mui-material/src/useAutocomplete/useAutocomplete.js
Original file line number Diff line number Diff line change
Expand Up @@ -243,28 +243,6 @@ function useAutocomplete(props) {

const listboxAvailable = open && filteredOptions.length > 0 && !readOnly;

if (process.env.NODE_ENV !== 'production') {
if (value !== null && !freeSolo && options.length > 0) {
const missingValue = (multiple ? value : [value]).filter(
(value2) => !options.some((option) => isOptionEqualToValue(option, value2)),
);

if (missingValue.length > 0) {
console.warn(
[
`MUI: The value provided to ${componentName} is invalid.`,
`None of the options match with \`${
missingValue.length > 1
? JSON.stringify(missingValue)
: JSON.stringify(missingValue[0])
}\`.`,
'You can use the `isOptionEqualToValue` prop to customize the equality test.',
].join('\n'),
);
}
}
}

const focusTag = useEventCallback((tagToFocus) => {
if (tagToFocus === -1) {
inputRef.current.focus();
Expand Down

0 comments on commit b949d17

Please sign in to comment.