Skip to content

Commit

Permalink
fix: cannot clear initial combobox value in fully controlled component (
Browse files Browse the repository at this point in the history
#17324)

* fix: initial state issue

* fix: added test case

* fix: test case

* fix: test case

* fix: ci checks fail

* fix: merge conflict issue

---------

Co-authored-by: Taylor Jones <tay1orjones@users.noreply.github.com>
  • Loading branch information
preetibansalui and tay1orjones authored Sep 16, 2024
1 parent 06844e9 commit d8e0045
Show file tree
Hide file tree
Showing 2 changed files with 17 additions and 0 deletions.
6 changes: 6 additions & 0 deletions packages/react/src/components/ComboBox/ComboBox-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -90,6 +90,12 @@ describe('ComboBox', () => {
});
});

it('should call `onChange` on a fully controlled component', async () => {
render(<ComboBox {...mockProps} selectedItem={mockProps.items[0]} />);
await userEvent.click(screen.getAllByRole('button')[0]);
expect(mockProps.onChange).toHaveBeenCalled();
});

it('should select the correct item from the filtered list after text input on click', async () => {
const user = userEvent.setup();

Expand Down
11 changes: 11 additions & 0 deletions packages/react/src/components/ComboBox/ComboBox.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,7 @@ const {
InputKeyDownArrowUp,
InputKeyDownArrowDown,
MenuMouseLeave,
FunctionSelectItem,
} = useCombobox.stateChangeTypes;

const defaultItemToString = <ItemType,>(item: ItemType | null) => {
Expand Down Expand Up @@ -521,6 +522,16 @@ const ComboBox = forwardRef(
}
return changes;
}

case FunctionSelectItem:
if (onChange) {
onChange({
selectedItem: changes.selectedItem,
inputValue: changes.inputValue,
});
}
return changes;

case InputKeyDownEnter:
if (allowCustomValue) {
setInputValue(inputValue);
Expand Down

0 comments on commit d8e0045

Please sign in to comment.