PR 604 single select value update fix

src/vscode-single-select/vscode-single-select.test.ts

@@ -1,7 +1,12 @@
 /* eslint-disable @typescript-eslint/no-non-null-asserted-optional-chain */
 /* eslint-disable @typescript-eslint/no-unused-expressions */
 import {sendKeys} from '@web/test-runner-commands';
-import {clickOnElement, moveMouseOnElement} from '../includes/test-helpers.js';
+import {
+  $,
+  $$,
+  clickOnElement,
+  moveMouseOnElement,
+} from '../includes/test-helpers.js';
 import type {VscodeOption} from '../vscode-option/vscode-option.js';
 import {VscodeSingleSelect} from './index.js';
 import {aTimeout, expect, fixture, html} from '@open-wc/testing';
@@ -195,6 +200,28 @@ describe('vscode-single-select', () => {
       expect(spy).to.be.called;
     });
 
+    it('changes form value', async () => {
+      const form = await fixture<HTMLFormElement>(html`
+        <form>
+          <vscode-single-select name="test">
+            <vscode-option>Lorem</vscode-option>
+            <vscode-option>Ipsum</vscode-option>
+            <vscode-option>Dolor</vscode-option>
+          </vscode-single-select>
+        </form>
+      `);
+
+      const sl = $('vscode-single-select');
+      await clickOnElement(form);
+
+      const options = $$<HTMLLIElement>(sl.shadowRoot!, 'li[role="option"]');
+      options[1].click();
+
+      const fd = new FormData(form);
+
+      expect(fd.get('test')).to.eq('Ipsum');
+    });
+
     it('no item selected', async () => {
       const el = (await fixture(html`
         <vscode-single-select>

src/vscode-single-select/vscode-single-select.ts

@@ -1,10 +1,10 @@
 import {html, LitElement, TemplateResult} from 'lit';
 import {property, query} from 'lit/decorators.js';
 import {ifDefined} from 'lit/directives/if-defined.js';
+import {AssociatedFormControl} from '../includes/AssociatedFormControl.js';
 import {customElement} from '../includes/VscElement.js';
 import {chevronDownIcon} from '../includes/vscode-select/template-elements.js';
 import {VscodeSelectBase} from '../includes/vscode-select/vscode-select-base.js';
-import {AssociatedFormControl} from '../includes/AssociatedFormControl.js';
 import styles from './vscode-single-select.styles.js';
 
 export type VscSingleSelectCreateOptionEvent = CustomEvent<{value: string}>;
@@ -314,7 +314,7 @@ export class VscodeSingleSelect
       this._opts.selectedIndex = Number((optEl as HTMLElement).dataset.index);
 
       this.open = false;
-      this._internals.setFormValue(this._value);
+      this._internals.setFormValue(this._opts.value as string);
       this._manageRequired();
       this._dispatchChangeEvent();
     }