diff options
Diffstat (limited to 'devtools/client/framework')
28 files changed, 274 insertions, 282 deletions
diff --git a/devtools/client/framework/actions/dom-mutation-breakpoints.js b/devtools/client/framework/actions/dom-mutation-breakpoints.js index 1e1273d711..9780771a24 100644 --- a/devtools/client/framework/actions/dom-mutation-breakpoints.js +++ b/devtools/client/framework/actions/dom-mutation-breakpoints.js @@ -47,7 +47,7 @@ function createDOMMutationBreakpoint(nodeFront, mutationType) { assert(typeof nodeFront === "object" && nodeFront); assert(typeof mutationType === "string"); - return async function ({ dispatch, getState }) { + return async function ({ dispatch }) { const walker = nodeFront.walkerFront; dispatch({ @@ -67,7 +67,7 @@ function deleteDOMMutationBreakpoint(nodeFront, mutationType) { assert(typeof nodeFront === "object" && nodeFront); assert(typeof mutationType === "string"); - return async function ({ dispatch, getState }) { + return async function ({ dispatch }) { const walker = nodeFront.walkerFront; await walker.setMutationBreakpoints(nodeFront, { [mutationType]: false, @@ -141,7 +141,7 @@ function toggleDOMMutationBreakpointState(id, enabled) { assert(typeof id === "string"); assert(typeof enabled === "boolean"); - return async function ({ dispatch, getState }) { + return async function ({ getState }) { const bp = getDOMMutationBreakpoint(getState(), id); if (!bp) { throw new Error(`No DOM mutation BP with ID ${id}`); diff --git a/devtools/client/framework/browser-toolbox/test/browser_browser_toolbox_netmonitor.js b/devtools/client/framework/browser-toolbox/test/browser_browser_toolbox_netmonitor.js index 56e38998ce..cfa5783f12 100644 --- a/devtools/client/framework/browser-toolbox/test/browser_browser_toolbox_netmonitor.js +++ b/devtools/client/framework/browser-toolbox/test/browser_browser_toolbox_netmonitor.js @@ -29,6 +29,7 @@ add_task(async function () { await ToolboxTask.importFunctions({ waitUntil, + waitForDOM, }); await ToolboxTask.spawn(null, async () => { @@ -94,7 +95,10 @@ add_task(async function () { await ToolboxTask.spawn(null, async () => { const monitor = gToolbox.getCurrentPanel(); - const { document, store } = monitor.panelWin; + const { document, store, windowRequire } = monitor.panelWin; + const Actions = windowRequire( + "devtools/client/netmonitor/src/actions/index" + ); await waitUntil( () => !document.querySelector(".request-list-empty-notice") @@ -110,10 +114,19 @@ add_task(async function () { document.querySelectorAll("tbody .requests-list-column.requests-list-url") ); is(requests.length, 1, "One request displayed"); + const requestUrl = + "https://example.org/document-builder.sjs?html=fromParent"; + is(requests[0].textContent, requestUrl, "Expected request is displayed"); + + const waitForHeaders = waitForDOM(document, ".headers-overview"); + store.dispatch(Actions.toggleNetworkDetails()); + await waitForHeaders; + + const tabpanel = document.querySelector("#headers-panel"); is( - requests[0].textContent, - "https://example.org/document-builder.sjs?html=fromParent", - "Expected request is displayed" + tabpanel.querySelector(".url-preview .url").innerText, + requestUrl, + "The url summary value is incorrect." ); }); @@ -129,23 +142,24 @@ add_task(async function () { const monitor = gToolbox.getCurrentPanel(); const { document, store } = monitor.panelWin; + // Note that we may have lots of other requests relates to browser activity, + // like file:// requests for many internal UI ressources. await waitUntil(() => store.getState().requests.requests.length >= 3); ok(true, "Expected content requests are displayed"); - const requests = Array.from( - document.querySelectorAll("tbody .requests-list-column.requests-list-url") - ); - is(requests.length, 3, "Three requests displayed"); - ok( - requests[1].textContent.includes( - `https://example.com/document-builder.sjs` - ), - "Request for the tab is displayed" - ); - is( - requests[2].textContent, - innerUrlImg, - "Request for image image in tab is displayed" - ); + async function waitForRequest(url, requestName) { + info(`Wait for ${requestName} request`); + await waitUntil(() => { + const requests = Array.from( + document.querySelectorAll( + "tbody .requests-list-column.requests-list-url" + ) + ); + return requests.some(r => r.textContent.includes(url)); + }); + info(`Got ${requestName} request`); + } + await waitForRequest("https://example.com/document-builder.sjs", "tab"); + await waitForRequest(innerUrlImg, "image in tab"); }); }); diff --git a/devtools/client/framework/browser-toolbox/test/browser_browser_toolbox_unavailable_children.js b/devtools/client/framework/browser-toolbox/test/browser_browser_toolbox_unavailable_children.js index 5029c62306..d06274591e 100644 --- a/devtools/client/framework/browser-toolbox/test/browser_browser_toolbox_unavailable_children.js +++ b/devtools/client/framework/browser-toolbox/test/browser_browser_toolbox_unavailable_children.js @@ -38,107 +38,99 @@ add_task(async function () { selectNode, }); - const tabProcessID = - tab.linkedBrowser.browsingContext.currentWindowGlobal.osPid; - - const decodedTabURI = decodeURI(tab.linkedBrowser.currentURI.spec); - - await ToolboxTask.spawn( - [tabProcessID, isFissionEnabled(), decodedTabURI], - async (processID, _isFissionEnabled, tabURI) => { - /* global gToolbox */ - const inspector = gToolbox.getPanel("inspector"); - - info("Select the test browser element."); - await selectNode('browser[remote="true"][test-tab]', inspector); - - info("Retrieve the node front for selected node."); - const browserNodeFront = inspector.selection.nodeFront; - ok(!!browserNodeFront, "Retrieved a node front for the browser"); - is(browserNodeFront.displayName, "browser"); - - // Small helper to expand containers and return the child container - // matching the provided display name. - async function expandContainer(container, expectedChildName) { - info(`Expand the node expected to contain a ${expectedChildName}`); - await inspector.markup.expandNode(container.node); - await waitUntil(() => !!container.getChildContainers().length); - - const children = container - .getChildContainers() - .filter(child => child.node.displayName === expectedChildName); - is(children.length, 1); - return children[0]; - } - - info("Check that the corresponding markup view container has children"); - const browserContainer = inspector.markup.getContainer(browserNodeFront); - ok(browserContainer.hasChildren); - ok( - !browserContainer.node.childrenUnavailable, - "childrenUnavailable un-set" - ); - ok( - !browserContainer.elt.querySelector(".unavailable-children"), - "The unavailable badge is not displayed" - ); - - // Store the asserts as a helper to reuse it later in the test. - async function assertMarkupView() { - info("Check that the children are #document > html > body > div"); - let container = await expandContainer(browserContainer, "#document"); - container = await expandContainer(container, "html"); - container = await expandContainer(container, "body"); - container = await expandContainer(container, "div"); - - info("Select the #pick-me div"); - await selectNode(container.node, inspector); - is(inspector.selection.nodeFront.id, "pick-me"); - } - await assertMarkupView(); - - const parentProcessScope = gToolbox.doc.querySelector( - 'input[name="chrome-debug-mode"][value="parent-process"]' - ); - - info("Switch to parent process only scope"); - const onInspectorUpdated = inspector.once("inspector-updated"); - parentProcessScope.click(); - await onInspectorUpdated; - - // Note: `getChildContainers` returns null when the container has no - // children, instead of an empty array. - await waitUntil(() => browserContainer.getChildContainers() === null); - - ok(!browserContainer.hasChildren, "browser container has no children"); - ok(browserContainer.node.childrenUnavailable, "childrenUnavailable set"); - ok( - !!browserContainer.elt.querySelector(".unavailable-children"), - "The unavailable badge is displayed" - ); - - const everythingScope = gToolbox.doc.querySelector( - 'input[name="chrome-debug-mode"][value="everything"]' - ); - - info("Switch to multi process scope"); - everythingScope.click(); - - info("Wait until browserContainer has children"); - await waitUntil(() => browserContainer.hasChildren); - ok(browserContainer.hasChildren, "browser container has children"); - ok( - !browserContainer.node.childrenUnavailable, - "childrenUnavailable un-set" - ); - ok( - !browserContainer.elt.querySelector(".unavailable-children"), - "The unavailable badge is no longer displayed" - ); - - await assertMarkupView(); + await ToolboxTask.spawn([], async () => { + /* global gToolbox */ + const inspector = gToolbox.getPanel("inspector"); + + info("Select the test browser element."); + await selectNode('browser[remote="true"][test-tab]', inspector); + + info("Retrieve the node front for selected node."); + const browserNodeFront = inspector.selection.nodeFront; + ok(!!browserNodeFront, "Retrieved a node front for the browser"); + is(browserNodeFront.displayName, "browser"); + + // Small helper to expand containers and return the child container + // matching the provided display name. + async function expandContainer(container, expectedChildName) { + info(`Expand the node expected to contain a ${expectedChildName}`); + await inspector.markup.expandNode(container.node); + await waitUntil(() => !!container.getChildContainers().length); + + const children = container + .getChildContainers() + .filter(child => child.node.displayName === expectedChildName); + is(children.length, 1); + return children[0]; } - ); + + info("Check that the corresponding markup view container has children"); + const browserContainer = inspector.markup.getContainer(browserNodeFront); + ok(browserContainer.hasChildren); + ok( + !browserContainer.node.childrenUnavailable, + "childrenUnavailable un-set" + ); + ok( + !browserContainer.elt.querySelector(".unavailable-children"), + "The unavailable badge is not displayed" + ); + + // Store the asserts as a helper to reuse it later in the test. + async function assertMarkupView() { + info("Check that the children are #document > html > body > div"); + let container = await expandContainer(browserContainer, "#document"); + container = await expandContainer(container, "html"); + container = await expandContainer(container, "body"); + container = await expandContainer(container, "div"); + + info("Select the #pick-me div"); + await selectNode(container.node, inspector); + is(inspector.selection.nodeFront.id, "pick-me"); + } + await assertMarkupView(); + + const parentProcessScope = gToolbox.doc.querySelector( + 'input[name="chrome-debug-mode"][value="parent-process"]' + ); + + info("Switch to parent process only scope"); + const onInspectorUpdated = inspector.once("inspector-updated"); + parentProcessScope.click(); + await onInspectorUpdated; + + // Note: `getChildContainers` returns null when the container has no + // children, instead of an empty array. + await waitUntil(() => browserContainer.getChildContainers() === null); + + ok(!browserContainer.hasChildren, "browser container has no children"); + ok(browserContainer.node.childrenUnavailable, "childrenUnavailable set"); + ok( + !!browserContainer.elt.querySelector(".unavailable-children"), + "The unavailable badge is displayed" + ); + + const everythingScope = gToolbox.doc.querySelector( + 'input[name="chrome-debug-mode"][value="everything"]' + ); + + info("Switch to multi process scope"); + everythingScope.click(); + + info("Wait until browserContainer has children"); + await waitUntil(() => browserContainer.hasChildren); + ok(browserContainer.hasChildren, "browser container has children"); + ok( + !browserContainer.node.childrenUnavailable, + "childrenUnavailable un-set" + ); + ok( + !browserContainer.elt.querySelector(".unavailable-children"), + "The unavailable badge is no longer displayed" + ); + + await assertMarkupView(); + }); await ToolboxTask.destroy(); }); diff --git a/devtools/client/framework/browser-toolbox/window.js b/devtools/client/framework/browser-toolbox/window.js index e84ef02829..e1b4c8031b 100644 --- a/devtools/client/framework/browser-toolbox/window.js +++ b/devtools/client/framework/browser-toolbox/window.js @@ -185,7 +185,7 @@ window.addEventListener( { once: true } ); -function onCloseCommand(event) { +function onCloseCommand() { window.close(); } diff --git a/devtools/client/framework/components/ToolboxTabs.js b/devtools/client/framework/components/ToolboxTabs.js index 04b7d653a4..ad392a8700 100644 --- a/devtools/client/framework/components/ToolboxTabs.js +++ b/devtools/client/framework/components/ToolboxTabs.js @@ -97,7 +97,7 @@ class ToolboxTabs extends Component { } } - componentDidUpdate(prevProps, prevState) { + componentDidUpdate(prevProps) { if (this.shouldUpdateToolboxTabs(prevProps, this.props)) { this.updateCachedToolTabsWidthMap(); this.updateOverflowedTabs(); @@ -226,7 +226,7 @@ class ToolboxTabs extends Component { } } - resizeHandler(evt) { + resizeHandler() { window.cancelIdleCallback(this._resizeTimerId); this._resizeTimerId = window.requestIdleCallback( () => { diff --git a/devtools/client/framework/components/ToolboxToolbar.js b/devtools/client/framework/components/ToolboxToolbar.js index 6f94d0282b..f9998db0ab 100644 --- a/devtools/client/framework/components/ToolboxToolbar.js +++ b/devtools/client/framework/components/ToolboxToolbar.js @@ -354,7 +354,7 @@ class ToolboxToolbar extends Component { } const items = []; - toolbox.frameMap.forEach((frame, index) => { + toolbox.frameMap.forEach(frame => { const label = toolbox.target.isWebExtension ? toolbox.target.getExtensionPathName(frame.url) : getUnicodeUrl(frame.url); diff --git a/devtools/client/framework/devtools.js b/devtools/client/framework/devtools.js index e56efb0c4b..05e340a454 100644 --- a/devtools/client/framework/devtools.js +++ b/devtools/client/framework/devtools.js @@ -195,29 +195,13 @@ DevTools.prototype = { * Removes all tools that match the given |toolId| * Needed so that add-ons can remove themselves when they are deactivated * - * @param {string|object} tool - * Definition or the id of the tool to unregister. Passing the - * tool id should be avoided as it is a temporary measure. + * @param {string} toolId + * The id of the tool to unregister. * @param {boolean} isQuitApplication * true to indicate that the call is due to app quit, so we should not * cause a cascade of costly events */ - unregisterTool(tool, isQuitApplication) { - let toolId = null; - if (typeof tool == "string") { - toolId = tool; - tool = this._tools.get(tool); - } else { - const { Deprecated } = ChromeUtils.importESModule( - "resource://gre/modules/Deprecated.sys.mjs" - ); - Deprecated.warning( - "Deprecation WARNING: gDevTools.unregisterTool(tool) is " + - "deprecated. You should unregister a tool using its toolId: " + - "gDevTools.unregisterTool(toolId)." - ); - toolId = tool.id; - } + unregisterTool(toolId, isQuitApplication) { this._tools.delete(toolId); if (!isQuitApplication) { diff --git a/devtools/client/framework/menu.js b/devtools/client/framework/menu.js index a4cd8af5f7..2aef8aaf01 100644 --- a/devtools/client/framework/menu.js +++ b/devtools/client/framework/menu.js @@ -49,10 +49,10 @@ Menu.prototype.clear = function () { /** * Add an item to a specified position in the menu * - * @param {int} pos - * @param {MenuItem} menuItem + * @param {int} _pos + * @param {MenuItem} _menuItem */ -Menu.prototype.insert = function (pos, menuItem) { +Menu.prototype.insert = function (_pos, _menuItem) { throw Error("Not implemented"); }; diff --git a/devtools/client/framework/source-map-url-service.js b/devtools/client/framework/source-map-url-service.js index 8e08e9e4cb..043211a723 100644 --- a/devtools/client/framework/source-map-url-service.js +++ b/devtools/client/framework/source-map-url-service.js @@ -296,7 +296,7 @@ class SourceMapURLService { return query; } - _dispatchQuery(query, newSubscribers = null) { + _dispatchQuery(query) { if (!this._prefValue) { throw new Error("This function should only be called if the pref is on."); } diff --git a/devtools/client/framework/test/browser_devtools_api_destroy.js b/devtools/client/framework/test/browser_devtools_api_destroy.js index 736455df65..56cf001f76 100644 --- a/devtools/client/framework/test/browser_devtools_api_destroy.js +++ b/devtools/client/framework/test/browser_devtools_api_destroy.js @@ -38,11 +38,11 @@ async function runTests(aTab) { const panel = toolbox.getPanel(toolDefinition.id); ok(panel, "Tool open"); - gDevTools.once("toolbox-destroy", (toolbox, iframe) => { + gDevTools.once("toolbox-destroy", () => { collectedEvents.push("toolbox-destroy"); }); - gDevTools.once(toolDefinition.id + "-destroy", (toolbox, iframe) => { + gDevTools.once(toolDefinition.id + "-destroy", () => { collectedEvents.push("gDevTools-" + toolDefinition.id + "-destroy"); }); diff --git a/devtools/client/framework/test/browser_keybindings_01.js b/devtools/client/framework/test/browser_keybindings_01.js index 968c3a3d3d..3f48a5dfa2 100644 --- a/devtools/client/framework/test/browser_keybindings_01.js +++ b/devtools/client/framework/test/browser_keybindings_01.js @@ -97,6 +97,33 @@ add_task(async function () { key.synthesizeKey(); await onPickerStop; ok(true, "picker-stopped event received, highlighter stopped"); + + info( + `Run the keyboard shortcut for ${test.id} with picker shortcut disabled` + ); + await pushPref("devtools.command-button-pick.enabled", false); + + // Switch to another panel to assure the hotkey still opens inspector + await toolbox.selectTool("webconsole"); + await waitUntil(() => toolbox.currentToolId === "webconsole"); + + // Check if picker event times out + const onHasPickerStarted = Promise.race([ + toolbox.nodePicker.once("picker-started").then(() => true), + wait(100).then(() => false), + ]); + + key.synthesizeKey(); + const hasPickerStarted = await onHasPickerStarted; + + ok(!hasPickerStarted, "picker was not started on shortcut"); + is( + toolbox.currentToolId, + "inspector", + "shortcut still switches tab to inspector" + ); + + await pushPref("devtools.command-button-pick.enabled", true); } await onSelectTool; diff --git a/devtools/client/framework/test/browser_target_parents.js b/devtools/client/framework/test/browser_target_parents.js index 795219abef..d66339739c 100644 --- a/devtools/client/framework/test/browser_target_parents.js +++ b/devtools/client/framework/test/browser_target_parents.js @@ -60,7 +60,7 @@ add_task(async function () { // With that, we were chasing a precise race, where a second call to ProcessDescriptor.getTarget() // happens between the instantiation of ContentProcessTarget and its call to attach() from getTarget // function. - await testGetTargetWithConcurrentCalls(processes, processTarget => { + await testGetTargetWithConcurrentCalls(processes, () => { // We only call ContentProcessTargetFront.attach and not TargetMixin.attachAndInitThread. // So nothing is done for content process targets. return true; diff --git a/devtools/client/framework/test/browser_target_server_compartment.js b/devtools/client/framework/test/browser_target_server_compartment.js index c0bd8e56f0..652f9e0bfb 100644 --- a/devtools/client/framework/test/browser_target_server_compartment.js +++ b/devtools/client/framework/test/browser_target_server_compartment.js @@ -26,7 +26,7 @@ async function testChromeTab() { ); const onThreadActorInstantiated = new Promise(resolve => { - const observe = function (subject, topic, data) { + const observe = function (subject, topic) { if (topic === "devtools-thread-ready") { Services.obs.removeObserver(observe, "devtools-thread-ready"); const threadActor = subject.wrappedJSObject; @@ -62,7 +62,7 @@ async function testChromeTab() { ); const onDedicatedLoaderDestroy = new Promise(resolve => { - const observe = function (subject, topic, data) { + const observe = function (subject, topic) { if (topic === "devtools:loader:destroy") { Services.obs.removeObserver(observe, "devtools:loader:destroy"); resolve(); @@ -81,7 +81,7 @@ async function testChromeTab() { // Test that Main process Target can debug chrome scripts async function testMainProcess() { const onThreadActorInstantiated = new Promise(resolve => { - const observe = function (subject, topic, data) { + const observe = function (subject, topic) { if (topic === "devtools-thread-ready") { Services.obs.removeObserver(observe, "devtools-thread-ready"); const threadActor = subject.wrappedJSObject; diff --git a/devtools/client/framework/test/browser_toolbox_highlight.js b/devtools/client/framework/test/browser_toolbox_highlight.js index d0712aeed5..401f5df9f6 100644 --- a/devtools/client/framework/test/browser_toolbox_highlight.js +++ b/devtools/client/framework/test/browser_toolbox_highlight.js @@ -62,7 +62,7 @@ function test() { finish(); }); }); - })().catch(error => { + })().catch(() => { ok(false, "There was an error running the test."); }); } diff --git a/devtools/client/framework/test/browser_toolbox_options_enable_serviceworkers_testing.html b/devtools/client/framework/test/browser_toolbox_options_enable_serviceworkers_testing.html index 4065aabc2b..06b6281588 100644 --- a/devtools/client/framework/test/browser_toolbox_options_enable_serviceworkers_testing.html +++ b/devtools/client/framework/test/browser_toolbox_options_enable_serviceworkers_testing.html @@ -15,9 +15,9 @@ // enabled, so dereferencing it would throw a ReferenceError (which // is then caught in the .catch() clause). return window.navigator.serviceWorker.register("serviceworker.js"); - }).then(registration => { + }).then(() => { return {success: true}; - }).catch(error => { + }).catch(() => { return {success: false}; }); } @@ -36,7 +36,7 @@ function iframeRegisterAndUnregister() { var frame = window.document.createElement("iframe"); - var promise = new Promise(function(resolve, reject) { + var promise = new Promise(function(resolve) { frame.addEventListener("load", function() { Promise.resolve().then(_ => { return frame.contentWindow.navigator.serviceWorker.register("serviceworker.js"); @@ -45,7 +45,7 @@ }).then(_ => { frame.remove(); resolve({success: true}); - }).catch(error => { + }).catch(() => { resolve({success: false}); }); }, {once: true}); diff --git a/devtools/client/framework/test/browser_toolbox_options_enable_serviceworkers_testing.js b/devtools/client/framework/test/browser_toolbox_options_enable_serviceworkers_testing.js index 152f64f835..315b1f1e55 100644 --- a/devtools/client/framework/test/browser_toolbox_options_enable_serviceworkers_testing.js +++ b/devtools/client/framework/test/browser_toolbox_options_enable_serviceworkers_testing.js @@ -67,7 +67,7 @@ function register() { return sendMessage("devtools:sw-test:register"); } -function unregister(swr) { +function unregister() { return sendMessage("devtools:sw-test:unregister"); } diff --git a/devtools/client/framework/test/browser_toolbox_options_multiple_tabs.js b/devtools/client/framework/test/browser_toolbox_options_multiple_tabs.js index 74c0983d4e..d8d4d3057d 100644 --- a/devtools/client/framework/test/browser_toolbox_options_multiple_tabs.js +++ b/devtools/client/framework/test/browser_toolbox_options_multiple_tabs.js @@ -66,7 +66,7 @@ async function testToggleTools() { await toggleTool(tab2, toolId); } -async function toggleTool({ doc, panelWin, checkbox, tab }, toolId) { +async function toggleTool({ panelWin, checkbox }, toolId) { const prevChecked = checkbox.checked; (prevChecked ? checkRegistered : checkUnregistered)(toolId); diff --git a/devtools/client/framework/test/browser_toolbox_select_event.js b/devtools/client/framework/test/browser_toolbox_select_event.js index ebdae9af13..bbfd36eae4 100644 --- a/devtools/client/framework/test/browser_toolbox_select_event.js +++ b/devtools/client/framework/test/browser_toolbox_select_event.js @@ -72,7 +72,7 @@ add_task(async function () { async function testSelectToolRace() { const toolbox = await openToolboxForTab(tab, "webconsole"); let selected = false; - const onSelect = (event, id) => { + const onSelect = () => { if (selected) { ok(false, "Got more than one 'select' event"); } else { diff --git a/devtools/client/framework/test/browser_toolbox_telemetry_activate_splitconsole.js b/devtools/client/framework/test/browser_toolbox_telemetry_activate_splitconsole.js index cd1a478f5c..31c52e432e 100644 --- a/devtools/client/framework/test/browser_toolbox_telemetry_activate_splitconsole.js +++ b/devtools/client/framework/test/browser_toolbox_telemetry_activate_splitconsole.js @@ -103,6 +103,6 @@ async function checkResults() { // extras is(extra.host, expected.extra.host, "host is correct"); - ok(extra.width > 0, "width is greater than 0"); + Assert.greater(Number(extra.width), 0, "width is greater than 0"); } } diff --git a/devtools/client/framework/test/browser_toolbox_telemetry_enter.js b/devtools/client/framework/test/browser_toolbox_telemetry_enter.js index 4cb4611a97..ac1253ec79 100644 --- a/devtools/client/framework/test/browser_toolbox_telemetry_enter.js +++ b/devtools/client/framework/test/browser_toolbox_telemetry_enter.js @@ -144,7 +144,7 @@ async function checkResults() { // extras is(extra.host, expected.extra.host, "host is correct"); - ok(extra.width > 0, "width is greater than 0"); + Assert.greater(Number(extra.width), 0, "width is greater than 0"); is(extra.start_state, expected.extra.start_state, "start_state is correct"); is(extra.panel_name, expected.extra.panel_name, "panel_name is correct"); is(extra.cold, expected.extra.cold, "cold is correct"); diff --git a/devtools/client/framework/test/browser_toolbox_telemetry_exit.js b/devtools/client/framework/test/browser_toolbox_telemetry_exit.js index 3056b9af8c..98f831d6d4 100644 --- a/devtools/client/framework/test/browser_toolbox_telemetry_exit.js +++ b/devtools/client/framework/test/browser_toolbox_telemetry_exit.js @@ -121,7 +121,7 @@ async function checkResults() { // extras is(extra.host, expected.extra.host, "host is correct"); - ok(extra.width > 0, "width is greater than 0"); + Assert.greater(Number(extra.width), 0, "width is greater than 0"); is(extra.panel_name, expected.extra.panel_name, "panel_name is correct"); is(extra.next_panel, expected.extra.next_panel, "next_panel is correct"); is(extra.reason, expected.extra.reason, "reason is correct"); diff --git a/devtools/client/framework/test/browser_toolbox_toolbar_minimum_width.js b/devtools/client/framework/test/browser_toolbox_toolbar_minimum_width.js index cdd6678e6f..d5780c083c 100644 --- a/devtools/client/framework/test/browser_toolbox_toolbar_minimum_width.js +++ b/devtools/client/framework/test/browser_toolbox_toolbar_minimum_width.js @@ -10,7 +10,7 @@ const SIDEBAR_WIDTH_PREF = "devtools.toolbox.sidebar.width"; const { Toolbox } = require("resource://devtools/client/framework/toolbox.js"); -add_task(async function (pickerEnable, commandsEnable) { +add_task(async function () { // 74px is Chevron(26px) + Meatball(24px) + Close(24px) // devtools-browser.css defined this minimum width by using min-width. Services.prefs.setIntPref(SIDEBAR_WIDTH_PREF, 74); diff --git a/devtools/client/framework/test/browser_toolbox_window_reload_target.js b/devtools/client/framework/test/browser_toolbox_window_reload_target.js index d9a4eb34c1..8415af88f2 100644 --- a/devtools/client/framework/test/browser_toolbox_window_reload_target.js +++ b/devtools/client/framework/test/browser_toolbox_window_reload_target.js @@ -46,7 +46,7 @@ add_task(async function () { "Listen to page reloads to check that they are indeed sent by the toolbox" ); let reloadDetected = 0; - const reloadCounter = msg => { + const reloadCounter = () => { reloadDetected++; info("Detected reload #" + reloadDetected); is( diff --git a/devtools/client/framework/test/helper_disable_cache.js b/devtools/client/framework/test/helper_disable_cache.js index a98a68cc9f..31db6d81b4 100644 --- a/devtools/client/framework/test/helper_disable_cache.js +++ b/devtools/client/framework/test/helper_disable_cache.js @@ -93,7 +93,7 @@ async function setDisableCacheCheckboxChecked(tabX, state) { if (cbx.checked !== state) { info("Setting disable cache checkbox to " + state + " for " + tabX.title); - const onReconfigured = tabX.toolbox.once("cache-reconfigured"); + const onReconfigured = tabX.toolbox.once("new-configuration-applied"); cbx.click(); // We have to wait for the reconfigure request to be finished before reloading diff --git a/devtools/client/framework/toolbox-hosts.js b/devtools/client/framework/toolbox-hosts.js index 59d113848f..889a8cec36 100644 --- a/devtools/client/framework/toolbox-hosts.js +++ b/devtools/client/framework/toolbox-hosts.js @@ -413,7 +413,7 @@ PageHost.prototype = { raise() {}, // Do nothing. - setTitle(title) {}, + setTitle() {}, // Do nothing. destroy() { diff --git a/devtools/client/framework/toolbox-options.js b/devtools/client/framework/toolbox-options.js index 57fa1202b7..98b263ad44 100644 --- a/devtools/client/framework/toolbox-options.js +++ b/devtools/client/framework/toolbox-options.js @@ -148,7 +148,7 @@ OptionsPanel.prototype = { } }, - _themeRegistered(themeId) { + _themeRegistered() { this.setupThemeList(); }, diff --git a/devtools/client/framework/toolbox-tabs-order-manager.js b/devtools/client/framework/toolbox-tabs-order-manager.js index 0eec0c935f..d8fe73597f 100644 --- a/devtools/client/framework/toolbox-tabs-order-manager.js +++ b/devtools/client/framework/toolbox-tabs-order-manager.js @@ -7,7 +7,7 @@ const { AddonManager } = ChromeUtils.importESModule( "resource://gre/modules/AddonManager.sys.mjs", // AddonManager is a singleton, never create two instances of it. - { loadInDevToolsLoader: false } + { global: "shared" } ); const { gDevTools, diff --git a/devtools/client/framework/toolbox.js b/devtools/client/framework/toolbox.js index 2294ff879d..a03360aa26 100644 --- a/devtools/client/framework/toolbox.js +++ b/devtools/client/framework/toolbox.js @@ -216,6 +216,25 @@ loader.lazyGetter(this, "ProfilerBackground", () => { ); }); +const BOOLEAN_CONFIGURATION_PREFS = { + "devtools.cache.disabled": { + name: "cacheDisabled", + }, + "devtools.custom-formatters.enabled": { + name: "customFormatters", + }, + "devtools.serviceWorkers.testing.enabled": { + name: "serviceWorkersTestingEnabled", + }, + "devtools.inspector.simple-highlighters-reduced-motion": { + name: "useSimpleHighlightersForReducedMotion", + }, + "devtools.debugger.features.overlay": { + name: "pauseOverlay", + thread: true, + }, +}; + /** * A "Toolbox" is the component that holds all the tools for one specific * target. Visually, it's a document that includes the tools tabs and all @@ -284,13 +303,6 @@ function Toolbox(commands, selectedTool, hostType, contentWindow, frameId) { this._splitConsoleOnKeypress = this._splitConsoleOnKeypress.bind(this); this.closeToolbox = this.closeToolbox.bind(this); this.destroy = this.destroy.bind(this); - this._applyCacheSettings = this._applyCacheSettings.bind(this); - this._applyCustomFormatterSetting = - this._applyCustomFormatterSetting.bind(this); - this._applyServiceWorkersTestingSettings = - this._applyServiceWorkersTestingSettings.bind(this); - this._applySimpleHighlightersSettings = - this._applySimpleHighlightersSettings.bind(this); this._saveSplitConsoleHeight = this._saveSplitConsoleHeight.bind(this); this._onFocus = this._onFocus.bind(this); this._onBlur = this._onBlur.bind(this); @@ -887,17 +899,9 @@ Toolbox.prototype = { // the iframe being ready (makes startup faster) await this.commands.targetCommand.startListening(); - // Lets get the current thread settings from the prefs and - // update the threadConfigurationActor which should manage - // updating the current threads. - const options = await getThreadOptions(); - await this.commands.threadConfigurationCommand.updateConfiguration( - options - ); - - // This needs to be done before watching for resources so console messages can be - // custom formatted right away. - await this._applyCustomFormatterSetting(); + // Transfer settings early, before watching resources as it may impact them. + // (this is the case for custom formatter pref and console messages) + await this._listenAndApplyConfigurationPref(); // The targetCommand is created right before this code. // It means that this call to watchTargets is the first, @@ -960,22 +964,6 @@ Toolbox.prototype = { const framesPromise = this._listFrames(); Services.prefs.addObserver( - "devtools.cache.disabled", - this._applyCacheSettings - ); - Services.prefs.addObserver( - "devtools.custom-formatters.enabled", - this._applyCustomFormatterSetting - ); - Services.prefs.addObserver( - "devtools.serviceWorkers.testing.enabled", - this._applyServiceWorkersTestingSettings - ); - Services.prefs.addObserver( - "devtools.inspector.simple-highlighters-reduced-motion", - this._applySimpleHighlightersSettings - ); - Services.prefs.addObserver( BROWSERTOOLBOX_SCOPE_PREF, this._refreshHostTitle ); @@ -992,11 +980,6 @@ Toolbox.prototype = { this._buildInitialPanelDefinitions(); this._setDebugTargetData(); - // Forward configuration flags to the DevTools server. - this._applyCacheSettings(); - this._applyServiceWorkersTestingSettings(); - this._applySimpleHighlightersSettings(); - this._addWindowListeners(); this._addChromeEventHandlerEvents(); @@ -2033,7 +2016,7 @@ Toolbox.prototype = { this.errorCountButton = this._createButtonState({ id: "command-button-errorcount", isInStartContainer: false, - isToolSupported: toolbox => true, + isToolSupported: () => true, description: L10N.getStr("toolbox.errorCountButton.description"), }); // Use updateErrorCountButton to set some properties so we don't have to repeat @@ -2206,68 +2189,70 @@ Toolbox.prototype = { : L10N.getFormatStr(label, shortcut); }, - /** - * Apply the current cache setting from devtools.cache.disabled to this - * toolbox's tab. - */ - async _applyCacheSettings() { - const pref = "devtools.cache.disabled"; - const cacheDisabled = Services.prefs.getBoolPref(pref); + async _listenAndApplyConfigurationPref() { + this._onBooleanConfigurationPrefChange = + this._onBooleanConfigurationPrefChange.bind(this); - await this.commands.targetConfigurationCommand.updateConfiguration({ - cacheDisabled, - }); + // We have two configurations: + // * target specific configurations, which are set on all target actors, themself easily accessible from any actor. + // Most configurations should be set this way. + // * thread specific configurations, which are set on directly on the thread actor. + // Only configuration used by the thread actor should be set this way. + const targetConfiguration = {}; - // This event is only emitted for tests in order to know when to reload - if (flags.testing) { - this.emit("cache-reconfigured"); - } - }, + // Get the current thread settings from the prefs as well as debugger internal storage for breakpoints. + const threadConfiguration = await getThreadOptions(); - /** - * Apply the custom formatter setting (from `devtools.custom-formatters.enabled`) to this - * toolbox's tab. - */ - async _applyCustomFormatterSetting() { - if (!this.commands) { - return; - } + for (const prefName in BOOLEAN_CONFIGURATION_PREFS) { + const { name, thread } = BOOLEAN_CONFIGURATION_PREFS[prefName]; + const value = Services.prefs.getBoolPref(prefName, false); - const customFormatters = Services.prefs.getBoolPref( - "devtools.custom-formatters.enabled", - false - ); + // Based on the pref name, this will be stored in either target or thread specific configuration + if (thread) { + threadConfiguration[name] = value; + } else { + targetConfiguration[name] = value; + } - await this.commands.targetConfigurationCommand.updateConfiguration({ - customFormatters, - }); + // Also listen for any future change + Services.prefs.addObserver( + prefName, + this._onBooleanConfigurationPrefChange + ); + } - this.emitForTests("custom-formatters-reconfigured"); + // Now communicate the configurations to the server + await this.commands.targetConfigurationCommand.updateConfiguration( + targetConfiguration + ); + await this.commands.threadConfigurationCommand.updateConfiguration( + threadConfiguration + ); }, /** - * Apply the current service workers testing setting from - * devtools.serviceWorkers.testing.enabled to this toolbox's tab. - */ - _applyServiceWorkersTestingSettings() { - const pref = "devtools.serviceWorkers.testing.enabled"; - const serviceWorkersTestingEnabled = Services.prefs.getBoolPref(pref); - this.commands.targetConfigurationCommand.updateConfiguration({ - serviceWorkersTestingEnabled, + * Called whenever a preference registered in BOOLEAN_CONFIGURATION_PREFS + * changes. + * This is used to communicate the new setting's value to the server. + * + * @param {String} subject + * @param {String} topic + * @param {String} prefName + * The preference name which changed + */ + async _onBooleanConfigurationPrefChange(subject, topic, prefName) { + const { name, thread } = BOOLEAN_CONFIGURATION_PREFS[prefName]; + const value = Services.prefs.getBoolPref(prefName, false); + + const configurationCommand = thread + ? this.commands.threadConfigurationCommand + : this.commands.targetConfigurationCommand; + await configurationCommand.updateConfiguration({ + [name]: value, }); - }, - /** - * Apply the current simple highlighters setting to this toolbox's tab. - */ - _applySimpleHighlightersSettings() { - const useSimpleHighlightersForReducedMotion = Services.prefs.getBoolPref( - "devtools.inspector.simple-highlighters-reduced-motion", - false - ); - this.commands.targetConfigurationCommand.updateConfiguration({ - useSimpleHighlightersForReducedMotion, - }); + // This event is only emitted for tests in order to know when the setting has been applied by the backend. + this.emitForTests("new-configuration-applied", prefName); }, /** @@ -3378,7 +3363,7 @@ Toolbox.prototype = { return prefFront.getBoolPref(DISABLE_AUTOHIDE_PREF); }, - async _listFrames(event) { + async _listFrames() { if ( !this.target.getTrait("frames") || this.target.targetForm.ignoreSubFrames @@ -4053,22 +4038,12 @@ Toolbox.prototype = { gDevTools.off("tool-registered", this._toolRegistered); gDevTools.off("tool-unregistered", this._toolUnregistered); - Services.prefs.removeObserver( - "devtools.cache.disabled", - this._applyCacheSettings - ); - Services.prefs.removeObserver( - "devtools.custom-formatters.enabled", - this._applyCustomFormatterSetting - ); - Services.prefs.removeObserver( - "devtools.serviceWorkers.testing.enabled", - this._applyServiceWorkersTestingSettings - ); - Services.prefs.removeObserver( - "devtools.inspector.simple-highlighters-reduced-motion", - this._applySimpleHighlightersSettings - ); + for (const prefName in BOOLEAN_CONFIGURATION_PREFS) { + Services.prefs.removeObserver( + prefName, + this._onBooleanConfigurationPrefChange + ); + } Services.prefs.removeObserver( BROWSERTOOLBOX_SCOPE_PREF, this._refreshHostTitle @@ -4478,8 +4453,8 @@ Toolbox.prototype = { * Opens source in plain "view-source:". * @see devtools/client/shared/source-utils.js */ - viewSource(sourceURL, sourceLine) { - return viewSource.viewSource(this, sourceURL, sourceLine); + viewSource(sourceURL, sourceLine, sourceColumn) { + return viewSource.viewSource(this, sourceURL, sourceLine, sourceColumn); }, // Support for WebExtensions API (`devtools.network.*`) |