From 352cbd5a789f31d7db5cbd549aea82869f234431 Mon Sep 17 00:00:00 2001 From: Nicolas Chevobbe Date: Mon, 24 Jan 2022 12:54:05 +0000 Subject: [PATCH] Bug 1749551 - [devtools] In event-collector, only hide jump to debugger button when no source actor were created. r=ochameau. We don't need to have specific check for dom0 event listeners as the debugger button should be show as long as we managed to create a source actor. We can remove usage of `script.source.element` alltogether as we don't need it for not showing the line number in the location (the line is 0 in such case, and we already discriminate for such value). A test case is added to ensure that the debugger can be opened from the event tooltip on a dom0 event. Differential Revision: https://phabricator.services.mozilla.com/D136461 --- .../markup/test/browser_markup_view-source.js | 96 ++++++++++++++++--- .../actors/inspector/event-collector.js | 14 +-- 2 files changed, 85 insertions(+), 25 deletions(-) diff --git a/devtools/client/inspector/markup/test/browser_markup_view-source.js b/devtools/client/inspector/markup/test/browser_markup_view-source.js index 426713599150..e184d7b84b4f 100644 --- a/devtools/client/inspector/markup/test/browser_markup_view-source.js +++ b/devtools/client/inspector/markup/test/browser_markup_view-source.js @@ -3,9 +3,22 @@ "use strict"; +/* import-globals-from ../../../debugger/test/mochitest/helpers.js */ +Services.scriptloader.loadSubScript( + "chrome://mochitests/content/browser/devtools/client/debugger/test/mochitest/helpers.js", + this +); + +/* import-globals-from ../../../debugger/test/mochitest/helpers/context.js */ +Services.scriptloader.loadSubScript( + "chrome://mochitests/content/browser/devtools/client/debugger/test/mochitest/helpers/context.js", + this +); + const DOCUMENT_SRC = ` - + + `; @@ -22,36 +35,94 @@ button.addEventListener("click", foo, false); const TEST_URI = "data:text/html;charset=utf-8," + DOCUMENT_SRC; add_task(async function() { - // Test that event handler links go to the right debugger source when it - // came from an eval(). - const { inspector, tab, toolbox } = await openInspectorForURL(TEST_URI); + const { inspector, toolbox } = await openInspectorForURL(TEST_URI); - const nodeFront = await getNodeFront("#foo", inspector); + info( + "Test that event handler links go to the right debugger source when it came from an eval()" + ); + const evaledSource = await clickOnJumpToDebuggerIconForNode( + inspector, + toolbox, + "#btn-eval" + ); + is(evaledSource.url, null, "no expected url for eval source"); + + info("Add a breakpoint in opened source"); + const debuggerContext = createDebuggerContext(toolbox); + await addBreakpoint( + debuggerContext, + debuggerContext.selectors.getSelectedSource(), + 1 + ); + await safeSynthesizeMouseEventAtCenterInContentPage("#btn-eval"); + + await waitForPaused(debuggerContext); + ok(true, "The debugger paused on the evaled source breakpoint"); + await resume(debuggerContext); + + info( + "Test that event handler links go to the right debugger source when it's a dom0 event listener." + ); + await toolbox.selectTool("inspector"); + const dom0Source = await clickOnJumpToDebuggerIconForNode( + inspector, + toolbox, + "#btn-dom0" + ); + is(dom0Source.url, null, "no expected url for dom0 event listener source"); + await addBreakpoint( + debuggerContext, + debuggerContext.selectors.getSelectedSource(), + 1 + ); + await safeSynthesizeMouseEventAtCenterInContentPage("#btn-dom0"); + await waitForPaused(debuggerContext); + ok(true, "The debugger paused on the dom0 source breakpoint"); + await resume(debuggerContext); +}); + +async function clickOnJumpToDebuggerIconForNode( + inspector, + toolbox, + nodeSelector +) { + const nodeFront = await getNodeFront(nodeSelector, inspector); const container = getContainerForNodeFront(nodeFront, inspector); const evHolder = container.elt.querySelector( ".inspector-badge.interactive[data-event]" ); - evHolder.scrollIntoView(); + info(`Display event tooltip for node "${nodeSelector}"`); EventUtils.synthesizeMouseAtCenter( evHolder, {}, inspector.markup.doc.defaultView ); - const tooltip = inspector.markup.eventDetailsTooltip; await tooltip.once("shown"); + info(`Tooltip displayed, click on the "jump to debugger" icon`); const debuggerIcon = tooltip.panel.querySelector( ".event-tooltip-debugger-icon" ); + + if (!debuggerIcon) { + ok( + false, + `There is no jump to debugger icon in event tooltip for node "${nodeSelector}"` + ); + return null; + } + + const onDebuggerSelected = toolbox.once(`jsdebugger-selected`); EventUtils.synthesizeMouse(debuggerIcon, 2, 2, {}, debuggerIcon.ownerGlobal); - await gDevTools.showToolboxForTab(tab, { toolId: "jsdebugger" }); - const dbg = toolbox.getPanel("jsdebugger"); + const dbg = await onDebuggerSelected; + ok(true, "The debugger was opened"); let source; + info("Wait for source to be opened"); await BrowserTestUtils.waitForCondition( () => { source = dbg._selectors.getSelectedSource(dbg._getState()); @@ -61,6 +132,5 @@ add_task(async function() { 100, 20 ); - - is(source.url, null, "expected no url for eval source"); -}); + return source; +} diff --git a/devtools/server/actors/inspector/event-collector.js b/devtools/server/actors/inspector/event-collector.js index 683e6c01c5a8..23b47d715ea6 100644 --- a/devtools/server/actors/inspector/event-collector.js +++ b/devtools/server/actors/inspector/event-collector.js @@ -931,7 +931,6 @@ class EventCollector { const override = listener.override || {}; const tags = listener.tags || ""; const type = listener.type || ""; - let isScriptBoundToNonScriptElement = false; const enabled = !!listener.enabled; let functionSource = handler.toString(); let line = 0; @@ -968,13 +967,6 @@ class EventCollector { if (script) { const scriptSource = script.source.text; - // Scripts are provided via script tags. If it wasn't provided by a - // script tag it must be a DOM0 event. - if (script.source.element) { - isScriptBoundToNonScriptElement = - script.source.element.class !== "HTMLScriptElement"; - } - line = script.startLine; column = script.startColumn; url = script.url; @@ -1032,9 +1024,7 @@ class EventCollector { } else { origin = url + - (isScriptBoundToNonScriptElement || line === 0 - ? "" - : ":" + line + (column === null ? "" : ":" + column)); + (line ? ":" + line + (column === null ? "" : ":" + column) : ""); } eventObj = { @@ -1056,7 +1046,7 @@ class EventCollector { // Hide the debugger icon for DOM0 and native listeners. DOM0 listeners are // generated dynamically from e.g. an onclick="" attribute so the script // doesn't actually exist. - if (native || isScriptBoundToNonScriptElement) { + if (!sourceActor) { eventObj.hide.debugger = true; } } finally {