mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-01-18 17:22:45 -05:00
Fix input validation alert (#15749)
* Fix input validation alert * Add override
This commit is contained in:
@@ -3,7 +3,7 @@
|
||||
* Licensed under the Source EULA. See License.txt in the project root for license information.
|
||||
*--------------------------------------------------------------------------------------------*/
|
||||
|
||||
import { InputBox as vsInputBox, IInputOptions, IInputBoxStyles as vsIInputBoxStyles, IMessage } from 'vs/base/browser/ui/inputbox/inputBox';
|
||||
import { InputBox as vsInputBox, IInputOptions as vsIInputBoxOptions, IInputBoxStyles as vsIInputBoxStyles, IMessage, MessageType } from 'vs/base/browser/ui/inputbox/inputBox';
|
||||
import { IContextViewProvider } from 'vs/base/browser/ui/contextview/contextview';
|
||||
import { Color } from 'vs/base/common/color';
|
||||
import { Event, Emitter } from 'vs/base/common/event';
|
||||
@@ -18,6 +18,15 @@ export interface IInputBoxStyles extends vsIInputBoxStyles {
|
||||
disabledInputForeground?: Color;
|
||||
}
|
||||
|
||||
export interface IInputOptions extends vsIInputBoxOptions {
|
||||
/**
|
||||
* Whether calls to validate require the force parameter to be set to true
|
||||
* to run the base VS Input Box validation logic. See validate() override
|
||||
* for more info.
|
||||
*/
|
||||
requireForceValidations?: boolean
|
||||
}
|
||||
|
||||
export class InputBox extends vsInputBox {
|
||||
private enabledInputBackground?: Color;
|
||||
private enabledInputForeground?: Color;
|
||||
@@ -34,8 +43,8 @@ export class InputBox extends vsInputBox {
|
||||
private _isTextAreaInput = false;
|
||||
private _hideErrors = false;
|
||||
|
||||
constructor(container: HTMLElement, contextViewProvider: IContextViewProvider, options?: IInputOptions) {
|
||||
super(container, contextViewProvider, options);
|
||||
constructor(container: HTMLElement, contextViewProvider: IContextViewProvider, private _sqlOptions?: IInputOptions) {
|
||||
super(container, contextViewProvider, _sqlOptions);
|
||||
this.enabledInputBackground = this.inputBackground;
|
||||
this.enabledInputForeground = this.inputForeground;
|
||||
this.enabledInputBorder = this.inputBorder;
|
||||
@@ -48,7 +57,7 @@ export class InputBox extends vsInputBox {
|
||||
self._lastLoseFocusValue = self.value;
|
||||
});
|
||||
|
||||
if (options && options.type === 'textarea') {
|
||||
if (_sqlOptions && _sqlOptions.type === 'textarea') {
|
||||
this._isTextAreaInput = true;
|
||||
}
|
||||
}
|
||||
@@ -137,4 +146,19 @@ export class InputBox extends vsInputBox {
|
||||
this.inputForeground = enabled ? this.enabledInputForeground : this.disabledInputForeground;
|
||||
this.inputBorder = enabled ? this.enabledInputBorder : this.disabledInputBorder;
|
||||
}
|
||||
|
||||
public override validate(force?: boolean): MessageType | undefined {
|
||||
// We override the validate call here because in some situations we could end up with an "invalid" alert
|
||||
// being announced incorrectly. For example the InputBox component has its own async validation - and so
|
||||
// if a change was made to the text then the base VS InputBox would call validate immediately - before
|
||||
// the async validation was able to trigger and complete and so the state could still be invalid at that
|
||||
// point
|
||||
// So instead we allow users of the input box to control whether to let the base input box do its validation
|
||||
// as normal or whether to require manually calling validate with force === true in order to run the validation
|
||||
// logic.
|
||||
if (force || this._sqlOptions?.requireForceValidations !== true) {
|
||||
return super.validate();
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -11,10 +11,10 @@ import {
|
||||
import * as azdata from 'azdata';
|
||||
|
||||
import { ComponentBase } from 'sql/workbench/browser/modelComponents/componentBase';
|
||||
import { InputBox } from 'sql/base/browser/ui/inputBox/inputBox';
|
||||
import { IInputOptions, InputBox } from 'sql/base/browser/ui/inputBox/inputBox';
|
||||
import { attachInputBoxStyler } from 'sql/platform/theme/common/styler';
|
||||
|
||||
import { IInputOptions, MessageType } from 'vs/base/browser/ui/inputbox/inputBox';
|
||||
import { MessageType } from 'vs/base/browser/ui/inputbox/inputBox';
|
||||
import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
|
||||
import { IContextViewService } from 'vs/platform/contextview/browser/contextView';
|
||||
import * as nls from 'vs/nls';
|
||||
@@ -73,6 +73,7 @@ export default class InputBoxComponent extends ComponentBase<azdata.InputBoxProp
|
||||
useDefaultValidation: true
|
||||
};
|
||||
if (this._inputContainer) {
|
||||
inputOptions.requireForceValidations = true; // Non-text area input boxes handle our own validations when the text changes so don't run the base ones
|
||||
this._input = new InputBox(this._inputContainer.nativeElement, this.contextViewService, inputOptions);
|
||||
this.onkeydown(this._input.inputElement, (e: StandardKeyboardEvent) => {
|
||||
if (e.keyCode === KeyCode.Enter) {
|
||||
@@ -159,7 +160,7 @@ export default class InputBoxComponent extends ComponentBase<azdata.InputBoxProp
|
||||
public override async validate(): Promise<boolean> {
|
||||
await super.validate();
|
||||
// Let the input validate handle showing/hiding the error message
|
||||
const valid = this.inputElement.validate() === undefined;
|
||||
const valid = this.inputElement.validate(true) === undefined;
|
||||
|
||||
// set aria label based on validity of input
|
||||
if (valid) {
|
||||
|
||||
Reference in New Issue
Block a user