fix(cdk-experimental/ui-patterns): add guardrails to selectOne for edge cases

Author: ok7sai

src/cdk-experimental/ui-patterns/behaviors/list-selection/list-selection.spec.ts

@@ -219,6 +219,34 @@ describe('List Selection', () => {
       selection.selectOne(); // [0]
       expect(selection.inputs.value()).toEqual([0]);
     });
+
+    it('should do nothing if the current active item is disabled', () => {
+      const selection = getSelection({multi: signal(true)});
+      const items = selection.inputs.items() as TestItem[];
+
+      selection.inputs.focusManager.focus(items[1]);
+      selection.select();
+      expect(selection.inputs.value()).toEqual([1]);
+
+      selection.inputs.focusManager.focus(items[0]);
+      items[0].disabled.set(true);
+      selection.selectOne();
+      expect(selection.inputs.value()).toEqual([1]);
+    });
+
+    it('should not select an item if the list is not multiselectable and not all items are deselected', () => {
+      const selection = getSelection({multi: signal(false)});
+      const items = selection.inputs.items() as TestItem[];
+
+      selection.inputs.focusManager.focus(items[1]);
+      selection.select();
+      expect(selection.inputs.value()).toEqual([1]);
+
+      items[1].disabled.set(true);
+      selection.inputs.focusManager.focus(items[2]);
+      selection.selectOne();
+      expect(selection.inputs.value()).toEqual([1]);
+    });
   });
 
   describe('#selectRange', () => {

src/cdk-experimental/ui-patterns/behaviors/list-selection/list-selection.ts

@@ -120,7 +120,16 @@ export class ListSelection<T extends ListSelectionItem<V>, V> {
 
   /** Sets the selection to only the current active item. */
   selectOne() {
+    if (this.inputs.focusManager.activeItem().disabled()) {
+      return;
+    }
+
     this.deselectAll();
+
+    if (this.inputs.value().length > 0 && !this.inputs.multi()) {
+      return;
+    }
+
     this.select();
   }
 

src/cdk-experimental/ui-patterns/listbox/listbox.spec.ts

@@ -549,7 +549,7 @@ describe('Listbox Pattern', () => {
         listbox.onKeydown(down());
         expect(listbox.inputs.value()).toEqual(['Apricot']);
         listbox.onKeydown(down());
-        expect(listbox.inputs.value()).toEqual([]);
+        expect(listbox.inputs.value()).toEqual(['Apricot']);
         listbox.onKeydown(down());
         expect(listbox.inputs.value()).toEqual(['Blackberry']);
       });

src/cdk-experimental/ui-patterns/tabs/tabs.ts

@@ -289,7 +289,7 @@ export class TabListPattern {
 
   /** Handles updating selection for the tablist. */
   private _select(opts?: SelectOptions) {
-    if (opts?.select && !this.focusManager.activeItem().disabled()) {
+    if (opts?.select) {
       this.selection.selectOne();
       this.expansionManager.open(this.focusManager.activeItem());
     }