Fix escape to close settings
In an earlier CL, I added !UI.isEditing() as a condition to UI.Dialog's
closing on esc behavior in order to allow the escape key to be handled
by the shortcut editor rather than the capturing listener on the dialog.
Since UI.isEditing() returns true when any input element is focused, it
prevents closing on tab when a checkbox is focused, which makes the
escape key basically unusable on the preferences or experiments tabs.
This CL removes the isEditing() check and instead just adds a mechanism
for the shortcut editor to disable closing on escape.
Bug: 1131395
Change-Id: I26154aebf35b2386ecf6c7e85b8857d01c4efecc
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2438036
Reviewed-by: Brian Cui <[email protected]>
Commit-Queue: Jack Lynch <[email protected]>
diff --git a/front_end/settings/KeybindsSettingsTab.js b/front_end/settings/KeybindsSettingsTab.js
index 0464bc5..7f79195 100644
--- a/front_end/settings/KeybindsSettingsTab.js
+++ b/front_end/settings/KeybindsSettingsTab.js
@@ -210,6 +210,15 @@
return items;
}
+ /**
+ * @param {!Event} event
+ */
+ onEscapeKeyPressed(event) {
+ if (this._editingRow && document.deepActiveElement().nodeName === 'INPUT') {
+ this._editingRow.onEscapeKeyPressed(event);
+ }
+ }
+
update() {
if (this._editingItem) {
this.stopEditing(this._editingItem);
@@ -406,6 +415,20 @@
}
}
+ /**
+ * @param {!Event} event
+ */
+ onEscapeKeyPressed(event) {
+ const activeElement = document.deepActiveElement();
+ for (const [shortcut, shortcutInput] of this._shortcutInputs.entries()) {
+ if (activeElement === shortcutInput) {
+ this._onShortcutInputKeyDown(
+ /** @type {!UI.KeyboardShortcut.KeyboardShortcut} */ (shortcut),
+ /** @type {!HTMLInputElement} */ (shortcutInput), event);
+ }
+ }
+ }
+
_validateInputs() {
this._confirmButton.disabled = false;
this._errorMessageElement.classList.add('hidden');
diff --git a/front_end/settings/SettingsScreen.js b/front_end/settings/SettingsScreen.js
index 1d8b1d0..4740772 100644
--- a/front_end/settings/SettingsScreen.js
+++ b/front_end/settings/SettingsScreen.js
@@ -74,6 +74,10 @@
const shortcutsView = new UI.View.SimpleView(ls`Shortcuts`);
UI.ShortcutsScreen.ShortcutsScreen.instance().createShortcutsTabView().show(shortcutsView.element);
this._tabbedLocation.appendView(shortcutsView);
+ } else {
+ UI.ViewManager.ViewManager.instance().view('keybinds').widget().then(widget => {
+ this._keybindsTab = widget;
+ });
}
tabbedPane.show(this.contentElement);
tabbedPane.selectTab('preferences');
@@ -110,6 +114,7 @@
dialog.setPointerEventsBehavior(UI.GlassPane.PointerEventsBehavior.PierceGlassPane);
dialog.setOutsideTabIndexBehavior(UI.Dialog.OutsideTabIndexBehavior.PreserveMainViewTabIndex);
settingsScreen.show(dialog.contentElement);
+ dialog.setEscapeKeyCallback(settingsScreen._onEscapeKeyPressed.bind(settingsScreen));
dialog.show();
return settingsScreen;
@@ -178,6 +183,15 @@
Host.userMetrics.settingsPanelShown(tabId);
}
+
+ /**
+ * @param {!Event} event
+ */
+ _onEscapeKeyPressed(event) {
+ if (this._tabbedLocation.tabbedPane().selectedTabId === 'keybinds' && this._keybindsTab) {
+ this._keybindsTab.onEscapeKeyPressed(event);
+ }
+ }
}
/**
