diff --git a/extensions/dacpac/src/wizard/pages/deployPlanPage.ts b/extensions/dacpac/src/wizard/pages/deployPlanPage.ts index 90f1081042..c620f79384 100644 --- a/extensions/dacpac/src/wizard/pages/deployPlanPage.ts +++ b/extensions/dacpac/src/wizard/pages/deployPlanPage.ts @@ -99,7 +99,8 @@ export class DeployPlanPage extends DacFxConfigPage { data: this.getColumnData(result), columns: this.getTableColumns(result.dataLossAlerts.size > 0), width: 875, - height: 300 + height: 300, + ariaRole: 'alert' }); if (result.dataLossAlerts.size > 0) { diff --git a/src/sql/azdata.d.ts b/src/sql/azdata.d.ts index 1f920f412c..c7e7137297 100644 --- a/src/sql/azdata.d.ts +++ b/src/sql/azdata.d.ts @@ -2951,6 +2951,8 @@ declare module 'azdata' { title?: string; ariaRowCount?: number; ariaColumnCount?: number; + ariaRole?: string; + focused?: boolean; moveFocusOutWithTab?: boolean; //accessibility requirement for tables with no actionable cells } diff --git a/src/sql/base/browser/ui/table/table.ts b/src/sql/base/browser/ui/table/table.ts index d5d62021d2..8df1169b02 100644 --- a/src/sql/base/browser/ui/table/table.ts +++ b/src/sql/base/browser/ui/table/table.ts @@ -359,4 +359,8 @@ export class Table extends Widget implements IDisposa public set ariaColumnCount(value: number) { this._tableContainer.setAttribute('aria-colcount', value.toString()); } + + public set ariaRole(value: string) { + this._tableContainer.setAttribute('role', value); + } } diff --git a/src/sql/workbench/api/common/extHostModelView.ts b/src/sql/workbench/api/common/extHostModelView.ts index b636a5d771..722fd22910 100644 --- a/src/sql/workbench/api/common/extHostModelView.ts +++ b/src/sql/workbench/api/common/extHostModelView.ts @@ -1191,6 +1191,13 @@ class TableComponentWrapper extends ComponentWrapper implements azdata.TableComp this.setProperty('moveFocusOutWithTab', v); } + public get focused(): boolean { + return this.properties['focused']; + } + public set focused(v: boolean) { + this.setProperty('focused', v); + } + public get onRowSelected(): vscode.Event { let emitter = this._emitterMap.get(ComponentEventType.onSelectedRowChanged); return emitter && emitter.event; @@ -1200,6 +1207,8 @@ class TableComponentWrapper extends ComponentWrapper implements azdata.TableComp let emitter = this._emitterMap.get(ComponentEventType.onCellAction); return emitter && emitter.event; } + + } class DropDownWrapper extends ComponentWrapper implements azdata.DropDownComponent { diff --git a/src/sql/workbench/browser/modelComponents/loadingComponent.component.ts b/src/sql/workbench/browser/modelComponents/loadingComponent.component.ts index a268b94a04..55c45a6667 100644 --- a/src/sql/workbench/browser/modelComponents/loadingComponent.component.ts +++ b/src/sql/workbench/browser/modelComponents/loadingComponent.component.ts @@ -17,7 +17,7 @@ import * as nls from 'vs/nls'; @Component({ selector: 'modelview-loadingComponent', template: ` -
+ diff --git a/src/sql/workbench/browser/modelComponents/table.component.ts b/src/sql/workbench/browser/modelComponents/table.component.ts index d7f4e99b70..0ab006d6bc 100644 --- a/src/sql/workbench/browser/modelComponents/table.component.ts +++ b/src/sql/workbench/browser/modelComponents/table.component.ts @@ -245,6 +245,14 @@ export default class TableComponent extends ComponentBase implements IComponent, this._table.ariaColumnCount = this.ariaColumnCount; } + if (this.ariaRole) { + this._table.ariaRole = this.ariaRole; + } + + if (this.focused) { + this._table.focus(); + } + this.layoutTable(); this.validate(); } @@ -328,6 +336,10 @@ export default class TableComponent extends ComponentBase implements IComponent, return this.getPropertyOrDefault((props) => props.ariaColumnCount, -1); } + public get ariaRole(): string { + return this.getPropertyOrDefault((props) => props.ariaRole, undefined); + } + public set moveFocusOutWithTab(newValue: boolean) { this.setPropertyFromUI((props, value) => props.moveFocusOutWithTab = value, newValue); } @@ -335,4 +347,12 @@ export default class TableComponent extends ComponentBase implements IComponent, public get moveFocusOutWithTab(): boolean { return this.getPropertyOrDefault((props) => props.moveFocusOutWithTab, false); } + + public get focused(): boolean { + return this.getPropertyOrDefault((props) => props.focused, false); + } + + public set focused(newValue: boolean) { + this.setPropertyFromUI((properties, value) => { properties.focused = value; }, newValue); + } }