fix(Combobox): fix issue where autocomplete automatic does not fire s…

…election event (#1493)

packages/react/src/components/Combobox/Combobox.test.tsx

@@ -767,6 +767,36 @@ test('should handle selection with "enter" keydown event', () => {
   fireEnterKeyPress();
 });
 
+test('should handle selection when autocomplete="automatic" and combobox input is blurred', () => {
+  const onSelectionChange = spy();
+  render(
+    <Combobox
+      label="label"
+      onSelectionChange={onSelectionChange}
+      value=""
+      autocomplete="automatic"
+    >
+      <ComboboxOption>Apple</ComboboxOption>
+      <ComboboxOption>Banana</ComboboxOption>
+      <ComboboxOption>Cantaloupe</ComboboxOption>
+    </Combobox>
+  );
+  const combobox = screen.getByRole('combobox');
+
+  // Note: Combobox forwards events to Listbox via dispatchEvent, but this doesn't
+  // work correctly within jsdom/enzyme so we fire the events directly on listbox
+  const fireArrowDownKeyPress = () =>
+    fireEvent.keyDown(screen.getByRole('listbox'), { key: 'ArrowDown' });
+
+  fireEvent.focus(combobox);
+  assertListboxIsOpen(true);
+  expect(onSelectionChange.notCalled).toBeTruthy();
+  fireArrowDownKeyPress();
+  fireEvent.blur(combobox);
+  expect(onSelectionChange.calledOnce).toBeTruthy();
+  expect(onSelectionChange.firstCall.firstArg.value).toEqual('Banana');
+});
+
 test('should always render all options when autocomplete="none"', () => {
   render(
     <Combobox label="label" autocomplete="none">

packages/react/src/components/Combobox/Combobox.tsx

@@ -240,6 +240,11 @@ const Combobox = forwardRef<HTMLDivElement, ComboboxProps>(
             /* istanbul ignore next: default value */ '';
           setValue(stringValue);
           setSelectedValue(stringValue);
+          onSelectionChange?.({
+            target: activeDescendant.element,
+            value: stringValue,
+            previousValue: value
+          });
         }
       },
       [autocomplete, activeDescendant, onBlur]