fix(combobox): prevent disabled combobox from swapping custom/input values on click (#1699)

Author: jzempel

packages/dropdowns.next/src/elements/combobox/Combobox.spec.tsx

@@ -407,16 +407,45 @@ describe('Combobox', () => {
     expect(input).toHaveFocus();
   });
 
-  it('handles `renderValue` as expected', () => {
-    const { getByTestId } = render(
-      <TestCombobox renderValue={({ selection }) => `test-${(selection as ISelectedOption).value}`}>
-        <Option isSelected value="value" />
-      </TestCombobox>
-    );
-    const input = getByTestId('input');
+  describe('`renderValue`', () => {
+    it('handles custom value as expected', async () => {
+      const { getByTestId } = render(
+        <TestCombobox
+          renderValue={({ selection }) => `test-${(selection as ISelectedOption).value}`}
+        >
+          <Option isSelected value="value" />
+        </TestCombobox>
+      );
+      const combobox = getByTestId('combobox');
+      const trigger = combobox.firstChild as HTMLElement;
+      const input = getByTestId('input');
+
+      await user.click(trigger);
 
-    expect(input).toHaveValue('value');
-    expect(input.previousSibling).toHaveTextContent('test-value');
+      expect(input).not.toHaveAttribute('hidden');
+      expect(input).toHaveValue('value');
+      expect(input.previousSibling).toHaveTextContent('test-value');
+    });
+
+    it('handles disabled with custom value as expected', async () => {
+      const { getByTestId } = render(
+        <TestCombobox
+          isDisabled
+          renderValue={({ selection }) => `test-${(selection as ISelectedOption).value}`}
+        >
+          <Option isSelected value="value" />
+        </TestCombobox>
+      );
+      const combobox = getByTestId('combobox');
+      const trigger = combobox.firstChild as HTMLElement;
+      const input = getByTestId('input');
+
+      await user.click(trigger);
+
+      expect(input).toHaveAttribute('hidden');
+      expect(input).toHaveValue('value');
+      expect(input.previousSibling).toHaveTextContent('test-value');
+    });
   });
 
   describe('validation', () => {

packages/dropdowns.next/src/elements/combobox/Combobox.tsx

@@ -188,12 +188,14 @@ export const Combobox = forwardRef<HTMLDivElement, IComboboxProps>(
       validation,
       ...(getTriggerProps({
         onFocus: () => {
-          if (isEditable) {
-            setIsInputHidden(false);
-          }
+          if (!isDisabled) {
+            if (isEditable) {
+              setIsInputHidden(false);
+            }
 
-          if (isMultiselectable) {
-            setIsTagGroupExpanded(true);
+            if (isMultiselectable) {
+              setIsTagGroupExpanded(true);
+            }
           }
         },
         onBlur: event => {