From 60f556428fce71b65751c4809c4ad341cb16bfdb Mon Sep 17 00:00:00 2001
From: Charles Gagnon <chgagnon@microsoft.com>
Date: Thu, 17 Dec 2020 09:51:10 -0800
Subject: [PATCH] Fix select box event ordering (#13831)

* Fix select box event ordering

* more fixes

* Fix page

* Revert typing change

* Undo param

* Fix compile error

* Completely remove typings
---
 .../schema-compare/src/dialogs/schemaCompareDialog.ts     | 8 ++++----
 src/sql/base/browser/ui/selectBox/selectBox.ts            | 2 +-
 .../browser/modelComponents/dropdown.component.ts         | 6 ++++--
 3 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/extensions/schema-compare/src/dialogs/schemaCompareDialog.ts b/extensions/schema-compare/src/dialogs/schemaCompareDialog.ts
index c868f7f4d2..dddb483d2f 100644
--- a/extensions/schema-compare/src/dialogs/schemaCompareDialog.ts
+++ b/extensions/schema-compare/src/dialogs/schemaCompareDialog.ts
@@ -464,7 +464,7 @@ export class SchemaCompareDialog {
 			}
 		).component();
 		this.sourceServerDropdown.onValueChanged(async (value) => {
-			if (this.sourceServerDropdown.values.findIndex(x => this.matchesValue(x, value)) === -1) {
+			if (this.sourceServerDropdown.values.findIndex(x => this.matchesValue(x, value as string)) === -1) {
 				await this.sourceDatabaseDropdown.updateProperties({
 					values: [],
 					value: '  '
@@ -493,7 +493,7 @@ export class SchemaCompareDialog {
 			}
 		).component();
 		this.targetServerDropdown.onValueChanged(async (value) => {
-			if (this.targetServerDropdown.values.findIndex(x => this.matchesValue(x, value)) === -1) {
+			if (this.targetServerDropdown.values.findIndex(x => this.matchesValue(x, value as string)) === -1) {
 				await this.targetDatabaseDropdown.updateProperties({
 					values: [],
 					value: '  '
@@ -599,7 +599,7 @@ export class SchemaCompareDialog {
 			}
 		).component();
 		this.sourceDatabaseDropdown.onValueChanged(async (value) => {
-			this.sourceDbEditable = value;
+			this.sourceDbEditable = value as string;
 			this.dialog.okButton.enabled = await this.shouldEnableOkayButton();
 		});
 
@@ -618,7 +618,7 @@ export class SchemaCompareDialog {
 			}
 		).component();
 		this.targetDatabaseDropdown.onValueChanged(async (value) => {
-			this.targetDbEditable = value;
+			this.targetDbEditable = value as string;
 			this.dialog.okButton.enabled = await this.shouldEnableOkayButton();
 		});
 
diff --git a/src/sql/base/browser/ui/selectBox/selectBox.ts b/src/sql/base/browser/ui/selectBox/selectBox.ts
index 7e1350124d..36203b7265 100644
--- a/src/sql/base/browser/ui/selectBox/selectBox.ts
+++ b/src/sql/base/browser/ui/selectBox/selectBox.ts
@@ -81,8 +81,8 @@ export class SelectBox extends vsSelectBox {
 
 		this._selectedOption = selectedOption;
 		this._register(super.onDidSelect(newSelect => {
-			this._onDidSelect.fire(newSelect);
 			this.onSelect(newSelect);
+			this._onDidSelect.fire(newSelect);
 		}));
 
 		this.enabledSelectBackground = this.selectBackground;
diff --git a/src/sql/workbench/browser/modelComponents/dropdown.component.ts b/src/sql/workbench/browser/modelComponents/dropdown.component.ts
index 0656bd3c87..6218699517 100644
--- a/src/sql/workbench/browser/modelComponents/dropdown.component.ts
+++ b/src/sql/workbench/browser/modelComponents/dropdown.component.ts
@@ -80,7 +80,7 @@ export default class DropDownComponent extends ComponentBase<azdata.DropDownProp
 			this._register(attachEditableDropdownStyler(this._editableDropdown, this.themeService));
 			this._register(this._editableDropdown.onValueChange(async e => {
 				if (this.editable) {
-					this.setSelectedValue(this._editableDropdown.value);
+					this.setSelectedValue(e);
 					await this.validate();
 					this.fireEvent({
 						eventType: ComponentEventType.onDidChange,
@@ -97,8 +97,10 @@ export default class DropDownComponent extends ComponentBase<azdata.DropDownProp
 			this._register(attachSelectBoxStyler(this._selectBox, this.themeService));
 			this._register(this._selectBox.onDidSelect(async e => {
 				if (!this.editable) {
-					this.setSelectedValue(this._selectBox.value);
+					this.setSelectedValue(e.selected);
 					await this.validate();
+					// This is currently sending the ISelectData as the args, but to change this now would be a breaking
+					// change for extensions using it. So while not ideal this should be left as is for the time being.
 					this.fireEvent({
 						eventType: ComponentEventType.onDidChange,
 						args: e