Connection inputs labels (#1129)

* adds aria-label to inputs for connection

* formatting
This commit is contained in:
Anthony Dresser
2018-04-12 11:29:16 -07:00
committed by GitHub
parent c33ddfabf9
commit efe8e81b6e
2 changed files with 13 additions and 5 deletions

View File

@@ -49,6 +49,10 @@ export interface IDropdownOptions extends IDropdownStyles {
* Error Message to show if input is not part of the supplied list, only used if strictSelection = false
*/
errorMessage?: string;
/**
* Value to use as aria-label for the input box
*/
ariaLabel?: string;
}
export interface IDropdownStyles {
@@ -124,7 +128,8 @@ export class Dropdown extends Disposable {
validation: v => this._inputValidator(v)
},
placeholder: this._options.placeholder,
actions: [this._toggleAction]
actions: [this._toggleAction],
ariaLabel: this._options.ariaLabel
});
this._register(DOM.addDisposableListener(this._input.inputElement, DOM.EventType.FOCUS, () => {

View File

@@ -128,6 +128,7 @@ export class ConnectionWidget {
validationOptions: {
validation: (value: string) => !value ? ({ type: MessageType.ERROR, content: serverNameOption.displayName + errorMessage }) : null
},
ariaLabel: serverNameOption.displayName
});
if (this._optionsMaps[ConnectionOptionSpecialType.authType]) {
@@ -141,12 +142,13 @@ export class ConnectionWidget {
this._userNameInputBox = new InputBox(userNameBuilder.getHTMLElement(), this._contextViewService, {
validationOptions: {
validation: (value: string) => self.validateUsername(value, userNameOption.isRequired) ? ({ type: MessageType.ERROR, content: userNameOption.displayName + errorMessage }) : null
}
},
ariaLabel: userNameOption.displayName
});
let passwordOption = this._optionsMaps[ConnectionOptionSpecialType.password];
let passwordBuilder = DialogHelper.appendRow(this._tableContainer, passwordOption.displayName, 'connection-label', 'connection-input');
this._passwordInputBox = new InputBox(passwordBuilder.getHTMLElement(), this._contextViewService);
this._passwordInputBox = new InputBox(passwordBuilder.getHTMLElement(), this._contextViewService, { ariaLabel: passwordOption.displayName });
this._passwordInputBox.inputElement.type = 'password';
this._password = '';
@@ -158,9 +160,10 @@ export class ConnectionWidget {
this._databaseNameInputBox = new Dropdown(databaseNameBuilder.getHTMLElement(), this._contextViewService, this._themeService, {
values: [this._defaultDatabaseName, this._loadingDatabaseName],
strictSelection : false,
strictSelection: false,
placeholder: this._defaultDatabaseName,
maxHeight: 125
maxHeight: 125,
ariaLabel: databaseOption.displayName
});
let serverGroupLabel = localize('serverGroup', 'Server group');