mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-02-01 09:35:41 -05:00
Bug/accessibility - Focus related issues (#6859)
* fix for https://github.com/microsoft/azuredatastudio/issues/6798 * fix for https://github.com/microsoft/azuredatastudio/issues/6851
This commit is contained in:
@@ -130,14 +130,22 @@ export class DialogPane extends Disposable implements IThemable {
|
||||
});
|
||||
}
|
||||
|
||||
public show(): void {
|
||||
public show(focus: boolean = false): void {
|
||||
this._body.classList.remove('dialogModal-hidden');
|
||||
if (focus) {
|
||||
this.focus();
|
||||
}
|
||||
}
|
||||
|
||||
public hide(): void {
|
||||
this._body.classList.add('dialogModal-hidden');
|
||||
}
|
||||
|
||||
private focus(): void {
|
||||
let focusedElement = <HTMLElement>this._body.querySelector('a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled])');
|
||||
focusedElement ? focusedElement.focus() : this._body.focus();
|
||||
}
|
||||
|
||||
/**
|
||||
* Called by the theme registry on theme change to style the component
|
||||
*/
|
||||
|
||||
@@ -82,7 +82,7 @@ export class WizardModal extends Modal {
|
||||
}
|
||||
|
||||
this._previousButton = this.addDialogButton(this._wizard.backButton, () => this.showPage(this._wizard.currentPage - 1));
|
||||
this._nextButton = this.addDialogButton(this._wizard.nextButton, () => this.showPage(this._wizard.currentPage + 1), true, true);
|
||||
this._nextButton = this.addDialogButton(this._wizard.nextButton, () => this.showPage(this._wizard.currentPage + 1, true, true), true, true);
|
||||
this._generateScriptButton = this.addDialogButton(this._wizard.generateScriptButton, () => undefined);
|
||||
this._doneButton = this.addDialogButton(this._wizard.doneButton, () => this.done(), false, true);
|
||||
this._wizard.doneButton.registerClickEvent(this._onDone.event);
|
||||
@@ -164,7 +164,7 @@ export class WizardModal extends Modal {
|
||||
page.onUpdate(() => this.setButtonsForPage(this._wizard.currentPage));
|
||||
}
|
||||
|
||||
private async showPage(index: number, validate: boolean = true): Promise<void> {
|
||||
private async showPage(index: number, validate: boolean = true, focus: boolean = false): Promise<void> {
|
||||
let pageToShow = this._wizard.pages[index];
|
||||
if (!pageToShow) {
|
||||
this.done(validate);
|
||||
@@ -175,7 +175,7 @@ export class WizardModal extends Modal {
|
||||
}
|
||||
this._dialogPanes.forEach((dialogPane, page) => {
|
||||
if (page === pageToShow) {
|
||||
dialogPane.show();
|
||||
dialogPane.show(focus);
|
||||
} else {
|
||||
dialogPane.hide();
|
||||
}
|
||||
@@ -227,14 +227,14 @@ export class WizardModal extends Modal {
|
||||
'wizard-navigation',
|
||||
{
|
||||
wizard: this._wizard,
|
||||
navigationHandler: (index: number) => this.showPage(index, index > this._wizard.currentPage)
|
||||
navigationHandler: (index: number) => this.showPage(index, index > this._wizard.currentPage, true)
|
||||
},
|
||||
undefined,
|
||||
() => undefined);
|
||||
}
|
||||
|
||||
public open(): void {
|
||||
this.showPage(0, false);
|
||||
this.showPage(0, false, true);
|
||||
this.show();
|
||||
}
|
||||
|
||||
@@ -292,7 +292,7 @@ export class WizardModal extends Modal {
|
||||
this.done();
|
||||
} else {
|
||||
if (this._nextButton.enabled) {
|
||||
this.showPage(this._wizard.currentPage + 1);
|
||||
this.showPage(this._wizard.currentPage + 1, true, true);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user