Hide console drawer if no argument hints are shown
In https://crrev.com/c/3477109 the logic for the escape keybinding was
updated to hide the argument hints tooltip. However, this also overwrote
the default escape keybinding for the console panel. That's because we
returned `true` (which signals CodeMirror to stop propagation of
keybindings) regardless of the tooltip was open or not.
Now, we store the state of the tooltip and when we want to attempt to
close the tooltip, we check if it was actually opened. If it wasn't, we
return `false`, which means that the default escape keybinding behavior
is triggered. However, if we can find it, we close the tooltip as we did
before.
R=yangguo@chromium.org
Fixed: 1300115
Change-Id: I8ea5a490365b0f67e0f50056724d2fe495d2338b
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3484203
Auto-Submit: Tim Van der Lippe <tvanderlippe@chromium.org>
Reviewed-by: Yang Guo <yangguo@chromium.org>
Commit-Queue: Tim Van der Lippe <tvanderlippe@chromium.org>
diff --git a/front_end/panels/console/ConsolePrompt.ts b/front_end/panels/console/ConsolePrompt.ts
index dc5aa7a..0c933c8 100644
--- a/front_end/panels/console/ConsolePrompt.ts
+++ b/front_end/panels/console/ConsolePrompt.ts
@@ -41,6 +41,10 @@
private readonly eagerEvalSetting: Common.Settings.Setting<boolean>;
private previewRequestForTest: Promise<void>|null;
private highlightingNode: boolean;
+ // The CodeMirror state field that controls whether the argument hints are showing.
+ // If they are, the escape key will clear them. However, if they aren't, then the
+ // console drawer should be hidden as a whole.
+ #argumentHintsState: CodeMirror.StateField<CodeMirror.Tooltip|null>;
constructor() {
super();
@@ -70,13 +74,15 @@
this.element.tabIndex = 0;
this.previewRequestForTest = null;
this.highlightingNode = false;
+ const argumentHints = TextEditor.JavaScript.argumentHints();
+ this.#argumentHintsState = argumentHints[0];
const editorState = CodeMirror.EditorState.create({
doc: this.initialText,
extensions: [
CodeMirror.keymap.of(this.editorKeymap()),
CodeMirror.EditorView.updateListener.of(update => this.editorUpdate(update)),
- TextEditor.JavaScript.argumentHints(),
+ argumentHints,
TextEditor.JavaScript.completion(),
TextEditor.Config.showCompletionHint,
CodeMirror.javascript.javascript(),
@@ -212,8 +218,7 @@
{
key: 'Escape',
run: (): boolean => {
- TextEditor.JavaScript.closeArgumentsHintsTooltip(this.editor.editor);
- return true;
+ return TextEditor.JavaScript.closeArgumentsHintsTooltip(this.editor.editor, this.#argumentHintsState);
},
},
{
@@ -266,7 +271,7 @@
private async handleEnter(): Promise<void> {
if (await this.enterWillEvaluate()) {
this.appendCommand(this.text(), true);
- TextEditor.JavaScript.closeArgumentsHintsTooltip(this.editor.editor);
+ TextEditor.JavaScript.closeArgumentsHintsTooltip(this.editor.editor, this.#argumentHintsState);
this.editor.dispatch({
changes: {from: 0, to: this.editor.state.doc.length},
scrollIntoView: true,
diff --git a/front_end/ui/components/text_editor/cursor_tooltip.ts b/front_end/ui/components/text_editor/cursor_tooltip.ts
index 1274eda..1f403ea 100644
--- a/front_end/ui/components/text_editor/cursor_tooltip.ts
+++ b/front_end/ui/components/text_editor/cursor_tooltip.ts
@@ -4,11 +4,12 @@
import * as CodeMirror from '../../../third_party/codemirror.next/codemirror.next.js';
+export type ArgumentHintsTooltip = [CodeMirror.StateField<CodeMirror.Tooltip|null>, CodeMirror.ViewPlugin<{}>];
export const closeTooltip = CodeMirror.StateEffect.define<null>();
export function cursorTooltip(
source: (state: CodeMirror.EditorState, pos: number) => Promise<(() => CodeMirror.TooltipView)|null>,
- ): CodeMirror.Extension {
+ ): ArgumentHintsTooltip {
const openTooltip = CodeMirror.StateEffect.define<() => CodeMirror.TooltipView>();
const state = CodeMirror.StateField.define<null|CodeMirror.Tooltip>({
diff --git a/front_end/ui/components/text_editor/javascript.ts b/front_end/ui/components/text_editor/javascript.ts
index 9286ca1..dc8196d 100644
--- a/front_end/ui/components/text_editor/javascript.ts
+++ b/front_end/ui/components/text_editor/javascript.ts
@@ -8,7 +8,7 @@
import * as CodeMirror from '../../../third_party/codemirror.next/codemirror.next.js';
import * as UI from '../../legacy/legacy.js';
-import {closeTooltip, cursorTooltip} from './cursor_tooltip.js';
+import {type ArgumentHintsTooltip, closeTooltip, cursorTooltip} from './cursor_tooltip.js';
export function completion(): CodeMirror.Extension {
return CodeMirror.javascript.javascriptLanguage.data.of({
@@ -421,12 +421,19 @@
return false;
}
-export function argumentHints(): CodeMirror.Extension {
+export function argumentHints(): ArgumentHintsTooltip {
return cursorTooltip(getArgumentHints);
}
-export function closeArgumentsHintsTooltip(view: CodeMirror.EditorView): void {
+export function closeArgumentsHintsTooltip(
+ view: CodeMirror.EditorView, tooltip: CodeMirror.StateField<CodeMirror.Tooltip|null>): boolean {
+ // If the tooltip is currently showing, the state will reflect its properties.
+ // If it isn't showing, the state is explicitly set to `null`.
+ if (view.state.field(tooltip) === null) {
+ return false;
+ }
view.dispatch({effects: closeTooltip.of(null)});
+ return true;
}
async function getArgumentHints(
