ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-02-16 18:46:40 -05:00
Code Issues Packages Projects Releases Wiki Activity

Dacpac extension announces invalid text inputs in screen reader mode (#7133)

Browse Source 
Text input boxes will have an updated aria-label with a given error message if the input is invalid.
This commit is contained in:
Elliot Boschwitz
2019-09-12 11:05:56 -07:00
committed by GitHub
parent 206c5146e1
commit aaf115a5c8
2 changed files with 15 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
extensions/dacpac/src/wizard/pages/extractConfigPage.ts
View File

@@ -108,12 +108,12 @@ export class ExtractConfigPage extends DacFxConfigPage {
private async createVersionTextBox(): Promise<azdata.FormComponent> { private async createVersionTextBox(): Promise<azdata.FormComponent> {
this.versionTextBox = this.view.modelBuilder.inputBox().withProperties({ this.versionTextBox = this.view.modelBuilder.inputBox().withProperties({
required: true required: true,
ariaLabel: localize('dacFxExtract.versionTextBoxAriaLabel', 'Version')
}).component(); }).component();
// default version // default version
this.versionTextBox.value = '1.0.0.0'; this.versionTextBox.value = '1.0.0.0';
this.versionTextBox.ariaLabel = localize('dacfx.versionAriaLabel', "Version");
this.model.version = this.versionTextBox.value; this.model.version = this.versionTextBox.value;
this.versionTextBox.onTextChanged(async () => { this.versionTextBox.onTextChanged(async () => {

14
src/sql/workbench/browser/modelComponents/inputbox.component.ts
View File

@@ -141,7 +141,19 @@ export default class InputBoxComponent extends ComponentBase implements ICompone
public validate(): Thenable<boolean> { public validate(): Thenable<boolean> {
return super.validate().then(valid => { return super.validate().then(valid => {
this.inputElement.validate(); valid = valid && this.inputElement.validate();
// set aria label based on validity of input
if (valid) {
this.inputElement.setAriaLabel(this.ariaLabel);
} else {
if (this.ariaLabel) {
this.inputElement.setAriaLabel(nls.localize('period', "{0}. {1}", this.ariaLabel, this.inputElement.inputElement.validationMessage));
} else {
this.inputElement.setAriaLabel(this.inputElement.inputElement.validationMessage);
}
}
return valid; return valid;
}); });
} }