From 3ba52a6b8d6285eba88e4a1a09e6ae4d062744b0 Mon Sep 17 00:00:00 2001
From: Jonathan Meyer <26874831+atmgrifter00@users.noreply.github.com>
Date: Mon, 26 Feb 2024 10:28:13 -0600
Subject: [PATCH] Allow changing placeholder option.

---
 packages/nimble-components/src/select/index.ts      | 10 ++++++++--
 .../src/select/tests/select.spec.ts                 | 13 +++++++++++++
 2 files changed, 21 insertions(+), 2 deletions(-)

diff --git a/packages/nimble-components/src/select/index.ts b/packages/nimble-components/src/select/index.ts
index 13407272b2..560f6be176 100644
--- a/packages/nimble-components/src/select/index.ts
+++ b/packages/nimble-components/src/select/index.ts
@@ -343,10 +343,16 @@ export class Select
      * @override
      */
     public override handleChange(source: unknown, propertyName: string): void {
-        super.handleChange(source, propertyName);
+        // don't call super.handleChange so hidden options can be selected programmatically
         if (propertyName === 'value') {
             this.updateValue();
         }
+        if (propertyName === 'selected') {
+            if (isListboxOption(source as Element)) {
+                this.selectedIndex = this.options.indexOf(source as ListboxOption);
+            }
+            this.setSelectedOptions();
+        }
     }
 
     /**
@@ -719,7 +725,7 @@ export class Select
      */
     protected override setDefaultSelectedOption(): void {
         const options: ListboxOption[] = this.options
-            ?? Array.from(this.children).filter(o => isListboxOption(o as HTMLElement));
+            ?? Array.from(this.children).filter(o => isListboxOption(o));
 
         const optionIsSelected = (option: ListboxOption): boolean => {
             return option.hasAttribute('selected') || option.selected;
diff --git a/packages/nimble-components/src/select/tests/select.spec.ts b/packages/nimble-components/src/select/tests/select.spec.ts
index 09d0163902..1c819fa063 100644
--- a/packages/nimble-components/src/select/tests/select.spec.ts
+++ b/packages/nimble-components/src/select/tests/select.spec.ts
@@ -710,5 +710,18 @@ describe('Select', () => {
 
             expect(element.displayValue).toBe('Two');
         });
+
+        it('placeholder can be changed to another option programmatically', async () => {
+            await waitForUpdatesAsync();
+            element.options[0]!.hidden = false;
+            element.options[1]!.hidden = true;
+            element.options[1]!.disabled = true;
+            element.options[1]!.selected = true;
+
+            expect(element.displayValue).toBe('Two');
+            expect(element.value).toBe('two');
+            await clickAndWaitForOpen(element);
+            expect(pageObject.isOptionVisible(1)).toBeFalse();
+        });
     });
 });