Bug 1405343 - Migrate browser_webconsole_input_field_focus_on_panel_select.js to the new frontend; r=bgrins.
The test needed some changes in new-console.js in order to pass.
This patch adds a listener on webconsole-selected to focus the
console input. What's funny is that the listener wasn't set, but
it was removed in new-webconsole.js destroy function (probably a
leftover from the webconsole.js -> new-webconsole.js copy).
We also add the openInspector helper function in head.js.
MozReview-Commit-ID: 1q6ON6XMkKB
--- a/devtools/client/webconsole/new-console-output/test/mochitest/browser.ini
+++ b/devtools/client/webconsole/new-console-output/test/mochitest/browser.ini
@@ -281,17 +281,16 @@ skip-if = true # Bug 1404382
[browser_webconsole_highlighter_console_helper.js]
[browser_webconsole_history_arrow_keys.js]
[browser_webconsole_hpkp_invalid-headers.js]
[browser_webconsole_hsts_invalid-headers.js]
[browser_webconsole_iframe_wrong_hud.js]
[browser_webconsole_ineffective_iframe_sandbox_warning.js]
[browser_webconsole_init.js]
[browser_webconsole_input_field_focus_on_panel_select.js]
-skip-if = true # Bug 1405343
[browser_webconsole_input_focus.js]
[browser_webconsole_insecure_passwords_about_blank_web_console_warning.js]
[browser_webconsole_insecure_passwords_web_console_warning.js]
[browser_webconsole_inspect_cross_domain_object.js]
[browser_webconsole_js_input_expansion.js]
[browser_webconsole_keyboard_accessibility.js]
[browser_webconsole_location_debugger_link.js]
[browser_webconsole_location_scratchpad_link.js]
--- a/devtools/client/webconsole/new-console-output/test/mochitest/browser_webconsole_input_field_focus_on_panel_select.js
+++ b/devtools/client/webconsole/new-console-output/test/mochitest/browser_webconsole_input_field_focus_on_panel_select.js
@@ -1,37 +1,34 @@
/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
/* Any copyright is dedicated to the Public Domain.
* http://creativecommons.org/publicdomain/zero/1.0/ */
-// XXX Remove this when the file is migrated to the new frontend.
-/* eslint-disable no-undef */
-
// Test that the JS input field is focused when the user switches back to the
// web console from other tools, see bug 891581.
"use strict";
-const TEST_URI = "data:text/html;charset=utf8,<p>hello";
+const TEST_URI = "data:text/html;charset=utf8,<p>Test console input focus";
add_task(async function() {
- await loadTab(TEST_URI);
- let hud = await openConsole();
- hud.jsterm.clearOutput();
+ let hud = await openNewTabAndConsole(TEST_URI);
+
+ let inputNode = hud.jsterm.inputNode;
+ const filterInput = hud.ui.outputNode.querySelector(".text-filter");
- is(hud.jsterm.inputNode.hasAttribute("focused"), true,
- "inputNode should be focused");
+ info("Focus after console is opened");
+ ok(hasFocus(inputNode), "input node is focused after console is opened");
- hud.ui.filterBox.focus();
+ filterInput.focus();
+ ok(hasFocus(filterInput), "filter input should be focused");
- is(hud.ui.filterBox.hasAttribute("focused"), true,
- "filterBox should be focused");
+ is(hasFocus(inputNode), false, "input node is not focused anymore");
- is(hud.jsterm.inputNode.hasAttribute("focused"), false,
- "inputNode shouldn't be focused");
+ info("Go to the inspector panel");
+ await openInspector();
- await openInspector();
- hud = await openConsole();
+ info("Go back to the console");
+ await openConsole();
- is(hud.jsterm.inputNode.hasAttribute("focused"), true,
- "inputNode should be focused");
+ ok(hasFocus(inputNode), "input node is focused when coming from a different panel");
});
--- a/devtools/client/webconsole/new-console-output/test/mochitest/head.js
+++ b/devtools/client/webconsole/new-console-output/test/mochitest/head.js
@@ -430,16 +430,27 @@ async function openDebugger(options = {}
// Do not clear VariableView lazily so it doesn't disturb test ending.
panel._view.Variables.lazyEmpty = false;
await panel.panelWin.DebuggerController.waitForSourcesLoaded();
return {target, toolbox, panel};
}
+async function openInspector(options = {}) {
+ if (!options.tab) {
+ options.tab = gBrowser.selectedTab;
+ }
+
+ const target = TargetFactory.forTab(options.tab);
+ const toolbox = await gDevTools.showToolbox(target, "inspector");
+
+ return toolbox.getCurrentPanel();
+}
+
/**
* Open the Web Console for the given tab, or the current one if none given.
*
* @param nsIDOMElement tab
* Optional tab element for which you want open the Web Console.
* Defaults to current selected tab.
* @return Promise
* A promise that is resolved with the console hud once the web console is open.
--- a/devtools/client/webconsole/new-webconsole.js
+++ b/devtools/client/webconsole/new-webconsole.js
@@ -44,16 +44,17 @@ const PREF_SIDEBAR_ENABLED = "devtools.w
function NewWebConsoleFrame(webConsoleOwner) {
this.owner = webConsoleOwner;
this.hudId = this.owner.hudId;
this.isBrowserConsole = this.owner._browserConsole;
this.NEW_CONSOLE_OUTPUT_ENABLED = true;
this.window = this.owner.iframeWindow;
this._onToolboxPrefChanged = this._onToolboxPrefChanged.bind(this);
+ this._onPanelSelected = this._onPanelSelected.bind(this);
EventEmitter.decorate(this);
}
NewWebConsoleFrame.prototype = {
/**
* Getter for the debugger WebConsoleClient.
* @type object
*/
@@ -223,16 +224,20 @@ NewWebConsoleFrame.prototype = {
let Wrapper = this.owner.NewConsoleOutputWrapper || this.window.NewConsoleOutput;
this.newConsoleOutput = new Wrapper(
this.outputNode, this.jsterm, toolbox, this.owner, this.document);
// Toggle the timestamp on preference change
Services.prefs.addObserver(PREF_MESSAGE_TIMESTAMP, this._onToolboxPrefChanged);
this._onToolboxPrefChanged();
this._initShortcuts();
+
+ if (toolbox) {
+ toolbox.on("webconsole-selected", this._onPanelSelected);
+ }
},
_initShortcuts: function() {
let shortcuts = new KeyShortcuts({
window: this.window
});
shortcuts.on(l10n.getStr("webconsole.find.key"),
@@ -305,16 +310,25 @@ NewWebConsoleFrame.prototype = {
* Called when the message timestamp pref changes.
*/
_onToolboxPrefChanged: function() {
let newValue = Services.prefs.getBoolPref(PREF_MESSAGE_TIMESTAMP);
this.newConsoleOutput.dispatchTimestampsToggle(newValue);
},
/**
+ * Sets the focus to JavaScript input field when the web console tab is
+ * selected or when there is a split console present.
+ * @private
+ */
+ _onPanelSelected: function() {
+ this.jsterm.focus();
+ },
+
+ /**
* Handler for the tabNavigated notification.
*
* @param string event
* Event name.
* @param object packet
* Notification packet received from the server.
*/
handleTabNavigated: async function(packet) {