diff --git a/src/sql/workbench/contrib/executionPlan/browser/widgets/highlightExpensiveNodeWidget.ts b/src/sql/workbench/contrib/executionPlan/browser/widgets/highlightExpensiveNodeWidget.ts index e5f60336df..194d57e273 100644 --- a/src/sql/workbench/contrib/executionPlan/browser/widgets/highlightExpensiveNodeWidget.ts +++ b/src/sql/workbench/contrib/executionPlan/browser/widgets/highlightExpensiveNodeWidget.ts @@ -22,6 +22,8 @@ import { searchIconClassNames } from 'sql/workbench/contrib/executionPlan/browse import { IConfigurationService } from 'vs/platform/configuration/common/configuration'; import { IStorageService, StorageScope, StorageTarget } from 'vs/platform/storage/common/storage'; +const SELECT_EXPENSE_METRIC_TITLE = localize('executionPlanSelectExpenseMetricTitle', 'Select expense metric'); + const OFF_STRING = localize('executionPlanOff', 'Off'); const ACTUAL_ELAPSED_TIME_STRING = localize('executionPlanActualElapsedTime', 'Actual Elapsed Time'); const ACTUAL_ELAPSED_CPU_TIME_STRING = localize('executionPlanActualElapsedCpuTime', 'Actual Elapsed CPU Time'); @@ -83,6 +85,7 @@ export class HighlightExpensiveOperationWidget extends ExecutionPlanWidgetBase { const selectBoxOptions = this.getSelectBoxOptionsFromExecutionPlanDiagram(); this.expenseMetricSelectBox = new SelectBox(selectBoxOptions, COST_STRING, this.contextViewService, this._expenseMetricSelectBoxContainer); + this.expenseMetricSelectBox.setAriaLabel(SELECT_EXPENSE_METRIC_TITLE); this.expenseMetricSelectBox.render(this._expenseMetricSelectBoxContainer); this._register(attachSelectBoxStyler(this.expenseMetricSelectBox, this.themeService)); diff --git a/src/sql/workbench/contrib/executionPlan/browser/widgets/nodeSearchWidget.ts b/src/sql/workbench/contrib/executionPlan/browser/widgets/nodeSearchWidget.ts index 72fbc58917..b141316fd7 100644 --- a/src/sql/workbench/contrib/executionPlan/browser/widgets/nodeSearchWidget.ts +++ b/src/sql/workbench/contrib/executionPlan/browser/widgets/nodeSearchWidget.ts @@ -18,6 +18,10 @@ import { InputBox } from 'sql/base/browser/ui/inputBox/inputBox'; import { AzdataGraphView, SearchType } from 'sql/workbench/contrib/executionPlan/browser/azdataGraphView'; import { ExecutionPlanWidgetController } from 'sql/workbench/contrib/executionPlan/browser/executionPlanWidgetController'; +const SELECT_PROPERTY_TITLE = localize('executionPlanSelectPropertyTitle', 'Select property'); +const SELECT_SEARCH_TYPE_TITLE = localize('executionPlanSelectSearchTypeTitle', 'Select search type'); +const ENTER_SEARCH_VALUE_TITLE = localize('executionPlanEnterValueTitle', 'Enter search value'); + const CONTAINS_DISPLAY_STRING = localize("executionPlanSearchTypeContains", 'Contains'); const EQUALS_DISPLAY_STRING = localize("executionPlanSearchTypeEquals", 'Equals'); const GREATER_DISPLAY_STRING = '>'; @@ -55,6 +59,7 @@ export class NodeSearchWidget extends ExecutionPlanWidgetBase { this.container.appendChild(this._propertyNameSelectBoxContainer); const propDropdownOptions = this._executionPlanDiagram.getUniqueElementProperties(); this._propertyNameSelectBox = new SelectBox(propDropdownOptions, propDropdownOptions[0], this.contextViewService, this._propertyNameSelectBoxContainer); + this._propertyNameSelectBox.setAriaLabel(SELECT_PROPERTY_TITLE); this._register(attachSelectBoxStyler(this._propertyNameSelectBox, this.themeService)); this._propertyNameSelectBoxContainer.style.width = '150px'; this._propertyNameSelectBox.render(this._propertyNameSelectBoxContainer); @@ -74,6 +79,7 @@ export class NodeSearchWidget extends ExecutionPlanWidgetBase { LESSER_EQUAL_DISPLAY_STRING, LESSER_AND_GREATER_DISPLAY_STRING ], EQUALS_DISPLAY_STRING, this.contextViewService, this._searchTypeSelectBoxContainer); + this._searchTypeSelectBox.setAriaLabel(SELECT_SEARCH_TYPE_TITLE); this._searchTypeSelectBox.render(this._searchTypeSelectBoxContainer); this._register(attachSelectBoxStyler(this._searchTypeSelectBox, this.themeService)); this._searchTypeSelectBoxContainer.style.width = '100px'; @@ -105,6 +111,7 @@ export class NodeSearchWidget extends ExecutionPlanWidgetBase { // search text input box this._searchTextInputBox = new InputBox(this.container, this.contextViewService, {}); + this._searchTextInputBox.setAriaLabel(ENTER_SEARCH_VALUE_TITLE); this._register(attachInputBoxStyler(this._searchTextInputBox, this.themeService)); this._searchTextInputBox.element.style.marginLeft = '5px'; this._register(this._searchTextInputBox.onDidChange(e => {