From 086c044dc34dfc0f74fbe41f4ecb402b2cd34884 Mon Sep 17 00:00:00 2001 From: Daniel Baumann Date: Fri, 19 Apr 2024 03:13:33 +0200 Subject: Merging upstream version 125.0.1. Signed-off-by: Daniel Baumann --- .../client/inspector/animation/components/App.js | 2 +- .../animation/components/NoAnimationPanel.js | 2 +- .../animation/components/PlaybackRateSelector.js | 2 +- .../browser_animation_keyframes-progress-bar.js | 2 +- .../test/summary-graph_delay-sign_head.js | 5 +- .../test/summary-graph_end-delay-sign_head.js | 5 +- .../inspector/boxmodel/components/BoxModelInfo.js | 2 +- devtools/client/inspector/breadcrumbs.js | 3 +- .../client/inspector/changes/reducers/changes.js | 2 +- .../client/inspector/changes/selectors/changes.js | 31 +++--- .../inspector/compatibility/CompatibilityView.js | 4 +- .../compatibility/actions/compatibility.js | 2 +- .../compatibility/reducers/compatibility.js | 2 +- devtools/client/inspector/computed/computed.js | 2 +- .../client/inspector/computed/test/browser.toml | 3 +- .../test/browser_computed_keybindings_01.js | 2 +- .../flexbox/components/FlexItemSizingProperties.js | 6 +- .../client/inspector/flexbox/reducers/flexbox.js | 2 +- .../client/inspector/fonts/reducers/font-editor.js | 2 +- .../inspector/grids/components/GridOutline.js | 2 +- devtools/client/inspector/markup/markup.js | 30 +++--- devtools/client/inspector/markup/test/browser.toml | 2 +- .../markup/test/browser_markup_events_03.js | 6 +- .../markup/test/browser_markup_links_07.js | 26 +++++ .../test/browser_markup_links_aria_attributes.js | 110 ++++++++++++++++----- .../markup/test/browser_markup_tag_edit_07.js | 18 ++-- .../markup/test/doc_markup_events_03.html | 2 + .../test/doc_markup_links_aria_attributes.html | 22 +++++ .../test/resources/doc_markup_links_base.html | 12 +++ .../inspector/markup/views/element-editor.js | 2 +- devtools/client/inspector/node-picker.js | 6 +- .../browser_rules_colorpicker-contrast-ratio.js | 4 - .../rules/test/browser_rules_container-queries.js | 38 ++++--- .../browser_rules_edit-size-property-dragging.js | 5 +- .../browser_rules_large_base64_background_image.js | 18 +++- .../test/browser_rules_original-source-link.js | 2 +- .../test/browser_rules_original-source-link2.js | 2 +- .../rules/test/browser_rules_pseudo-element_01.js | 56 +++++++++++ .../inspector/rules/test/doc_pseudoelement.html | 13 ++- .../client/inspector/rules/views/rule-editor.js | 6 +- .../inspector/rules/views/text-property-editor.js | 10 +- .../inspector/shared/highlighters-overlay.js | 9 +- ...ser_inspector_highlighter-autohide-config_03.js | 2 +- ...wser_inspector_highlighter-eyedropper-events.js | 6 +- ...owser_inspector_highlighter-eyedropper-label.js | 4 +- .../browser_inspector_highlighter-geometry_01.js | 1 - .../browser_inspector_highlighter-measure_03.js | 6 +- .../browser_inspector_highlighter-measure_04.js | 6 +- .../test/browser_inspector_sidebarstate.js | 4 +- ...rowser_inspector_switch-to-inspector-on-pick.js | 2 +- devtools/client/inspector/toolsidebar.js | 4 +- 51 files changed, 351 insertions(+), 166 deletions(-) create mode 100644 devtools/client/inspector/markup/test/resources/doc_markup_links_base.html (limited to 'devtools/client/inspector') diff --git a/devtools/client/inspector/animation/components/App.js b/devtools/client/inspector/animation/components/App.js index 75a000286c..74ce8e7b40 100644 --- a/devtools/client/inspector/animation/components/App.js +++ b/devtools/client/inspector/animation/components/App.js @@ -60,7 +60,7 @@ class App extends Component { }; } - shouldComponentUpdate(nextProps, nextState) { + shouldComponentUpdate(nextProps) { return ( this.props.animations.length !== 0 || nextProps.animations.length !== 0 ); diff --git a/devtools/client/inspector/animation/components/NoAnimationPanel.js b/devtools/client/inspector/animation/components/NoAnimationPanel.js index ea034e413d..260325518b 100644 --- a/devtools/client/inspector/animation/components/NoAnimationPanel.js +++ b/devtools/client/inspector/animation/components/NoAnimationPanel.js @@ -26,7 +26,7 @@ class NoAnimationPanel extends Component { }; } - shouldComponentUpdate(nextProps, nextState) { + shouldComponentUpdate(nextProps) { return this.props.elementPickerEnabled != nextProps.elementPickerEnabled; } diff --git a/devtools/client/inspector/animation/components/PlaybackRateSelector.js b/devtools/client/inspector/animation/components/PlaybackRateSelector.js index 2d0de53a0c..9f2c56cdb6 100644 --- a/devtools/client/inspector/animation/components/PlaybackRateSelector.js +++ b/devtools/client/inspector/animation/components/PlaybackRateSelector.js @@ -28,7 +28,7 @@ class PlaybackRateSelector extends PureComponent { }; } - static getDerivedStateFromProps(props, state) { + static getDerivedStateFromProps(props) { const { animations, playbackRates } = props; const currentPlaybackRates = sortAndUnique( diff --git a/devtools/client/inspector/animation/test/browser_animation_keyframes-progress-bar.js b/devtools/client/inspector/animation/test/browser_animation_keyframes-progress-bar.js index a7051d9a01..bb69249907 100644 --- a/devtools/client/inspector/animation/test/browser_animation_keyframes-progress-bar.js +++ b/devtools/client/inspector/animation/test/browser_animation_keyframes-progress-bar.js @@ -91,7 +91,7 @@ add_task(async function () { } }); -function assertPosition(barEl, areaEl, expectedRate, animationInspector) { +function assertPosition(barEl, areaEl, expectedRate) { const controllerBounds = areaEl.getBoundingClientRect(); const barBounds = barEl.getBoundingClientRect(); const barX = barBounds.x + barBounds.width / 2 - controllerBounds.x; diff --git a/devtools/client/inspector/animation/test/summary-graph_delay-sign_head.js b/devtools/client/inspector/animation/test/summary-graph_delay-sign_head.js index fd601821b6..fffd653b1d 100644 --- a/devtools/client/inspector/animation/test/summary-graph_delay-sign_head.js +++ b/devtools/client/inspector/animation/test/summary-graph_delay-sign_head.js @@ -75,8 +75,9 @@ async function testSummaryGraphDelaySign() { function assertExpected(key) { const actual = parseFloat(delaySignEl.style[key]); const expected = parseFloat(expectedResult[key]); - ok( - Math.abs(actual - expected) < 0.01, + Assert.less( + Math.abs(actual - expected), + 0.01, `${key} should be ${expected} (got ${actual})` ); } diff --git a/devtools/client/inspector/animation/test/summary-graph_end-delay-sign_head.js b/devtools/client/inspector/animation/test/summary-graph_end-delay-sign_head.js index f87a554420..09838fcadf 100644 --- a/devtools/client/inspector/animation/test/summary-graph_end-delay-sign_head.js +++ b/devtools/client/inspector/animation/test/summary-graph_end-delay-sign_head.js @@ -69,8 +69,9 @@ async function testSummaryGraphEndDelaySign() { function assertExpected(key) { const actual = parseFloat(endDelaySignEl.style[key]); const expected = parseFloat(expectedResult[key]); - ok( - Math.abs(actual - expected) < 0.01, + Assert.less( + Math.abs(actual - expected), + 0.01, `${key} should be ${expected} (got ${actual})` ); } diff --git a/devtools/client/inspector/boxmodel/components/BoxModelInfo.js b/devtools/client/inspector/boxmodel/components/BoxModelInfo.js index e64faba05a..2444b7107d 100644 --- a/devtools/client/inspector/boxmodel/components/BoxModelInfo.js +++ b/devtools/client/inspector/boxmodel/components/BoxModelInfo.js @@ -32,7 +32,7 @@ class BoxModelInfo extends PureComponent { this.onToggleGeometryEditor = this.onToggleGeometryEditor.bind(this); } - onToggleGeometryEditor(e) { + onToggleGeometryEditor() { this.props.onToggleGeometryEditor(); } diff --git a/devtools/client/inspector/breadcrumbs.js b/devtools/client/inspector/breadcrumbs.js index 68bafb591c..47700f7d40 100644 --- a/devtools/client/inspector/breadcrumbs.js +++ b/devtools/client/inspector/breadcrumbs.js @@ -588,9 +588,8 @@ HTMLBreadcrumbs.prototype = { /** * On mouse out, make sure to unhighlight. - * @param {DOMEvent} event. */ - handleMouseOut(event) { + handleMouseOut() { this.inspector.highlighters.hideHighlighterType( this.inspector.highlighters.TYPES.BOXMODEL ); diff --git a/devtools/client/inspector/changes/reducers/changes.js b/devtools/client/inspector/changes/reducers/changes.js index 23e82a3ba7..82a5a92ed7 100644 --- a/devtools/client/inspector/changes/reducers/changes.js +++ b/devtools/client/inspector/changes/reducers/changes.js @@ -371,7 +371,7 @@ const reducers = { return state; }, - [RESET_CHANGES](state) { + [RESET_CHANGES]() { return INITIAL_STATE; }, }; diff --git a/devtools/client/inspector/changes/selectors/changes.js b/devtools/client/inspector/changes/selectors/changes.js index a6b99e4579..a176e11082 100644 --- a/devtools/client/inspector/changes/selectors/changes.js +++ b/devtools/client/inspector/changes/selectors/changes.js @@ -65,7 +65,7 @@ function getChangesTree(state, filter = {}) { } return Object.entries(state) - .filter(([sourceId, source]) => { + .filter(([sourceId]) => { // Use only matching sources if an array to filter by was provided. if (sourceIdsFilter.length) { return sourceIdsFilter.includes(sourceId); @@ -87,7 +87,7 @@ function getChangesTree(state, filter = {}) { ...source, // Build a new collection of rules keyed by rule id. rules: Object.entries(rules) - .filter(([ruleId, rule]) => { + .filter(([ruleId]) => { // Use only matching rules if an array to filter by was provided. if (rulesIdsFilter.length) { return rulesIdsFilter.includes(ruleId); @@ -237,22 +237,19 @@ function getChangesStylesheet(state, filter) { } // Iterate through all sources in the change tree and build a CSS stylesheet string. - return Object.entries(changeTree).reduce( - (stylesheetText, [sourceId, source]) => { - const { href, rules } = source; - // Write code comment with source origin - stylesheetText += `\n/* ${getSourceForDisplay(source)} | ${href} */\n`; - // Write CSS rules - stylesheetText += Object.entries(rules).reduce((str, [ruleId, rule]) => { - // Add a new like only after top-level rules (level == 0) - str += writeRule(ruleId, rule, 0) + "\n"; - return str; - }, ""); + return Object.values(changeTree).reduce((stylesheetText, source) => { + const { href, rules } = source; + // Write code comment with source origin + stylesheetText += `\n/* ${getSourceForDisplay(source)} | ${href} */\n`; + // Write CSS rules + stylesheetText += Object.entries(rules).reduce((str, [ruleId, rule]) => { + // Add a new like only after top-level rules (level == 0) + str += writeRule(ruleId, rule, 0) + "\n"; + return str; + }, ""); - return stylesheetText; - }, - "" - ); + return stylesheetText; + }, ""); } module.exports = { diff --git a/devtools/client/inspector/compatibility/CompatibilityView.js b/devtools/client/inspector/compatibility/CompatibilityView.js index 19c3263f00..548246fd54 100644 --- a/devtools/client/inspector/compatibility/CompatibilityView.js +++ b/devtools/client/inspector/compatibility/CompatibilityView.js @@ -32,7 +32,7 @@ const CompatibilityApp = createFactory( ); class CompatibilityView { - constructor(inspector, window) { + constructor(inspector) { this.inspector = inspector; this.inspector.store.injectReducer("compatibility", compatibilityReducer); @@ -133,7 +133,7 @@ class CompatibilityView { ); } - _parseMarkup(str) { + _parseMarkup() { // Using a BrowserLoader for the inspector is currently blocked on performance regressions, // see Bug 1471853. throw new Error( diff --git a/devtools/client/inspector/compatibility/actions/compatibility.js b/devtools/client/inspector/compatibility/actions/compatibility.js index fa9f410e0d..3ff512f1b0 100644 --- a/devtools/client/inspector/compatibility/actions/compatibility.js +++ b/devtools/client/inspector/compatibility/actions/compatibility.js @@ -74,7 +74,7 @@ function clearDestroyedNodes() { } function initUserSettings() { - return async ({ dispatch, getState }) => { + return async ({ dispatch }) => { dispatch({ type: COMPATIBILITY_INIT_USER_SETTINGS_START }); try { diff --git a/devtools/client/inspector/compatibility/reducers/compatibility.js b/devtools/client/inspector/compatibility/reducers/compatibility.js index 9256167601..ce54e856a9 100644 --- a/devtools/client/inspector/compatibility/reducers/compatibility.js +++ b/devtools/client/inspector/compatibility/reducers/compatibility.js @@ -139,7 +139,7 @@ const reducers = { _showError(COMPATIBILITY_UPDATE_TOP_LEVEL_TARGET_FAILURE, error); return state; }, - [COMPATIBILITY_UPDATE_TOP_LEVEL_TARGET_COMPLETE](state, { target }) { + [COMPATIBILITY_UPDATE_TOP_LEVEL_TARGET_COMPLETE](state) { return Object.assign({}, state, { isTopLevelTargetProcessing: false }); }, }; diff --git a/devtools/client/inspector/computed/computed.js b/devtools/client/inspector/computed/computed.js index 7d2c129c7b..9b051425e2 100644 --- a/devtools/client/inspector/computed/computed.js +++ b/devtools/client/inspector/computed/computed.js @@ -1383,7 +1383,7 @@ class PropertyView { /** * The action when a user clicks on the MDN help link for a property. */ - mdnLinkClick(event) { + mdnLinkClick() { if (!this.link) { return; } diff --git a/devtools/client/inspector/computed/test/browser.toml b/devtools/client/inspector/computed/test/browser.toml index d4ec4fc993..634c367351 100644 --- a/devtools/client/inspector/computed/test/browser.toml +++ b/devtools/client/inspector/computed/test/browser.toml @@ -34,7 +34,8 @@ fail-if = ["a11y_checks"] # Bug 1849028 clicked element may not be focusable and ["browser_computed_getNodeInfo.js"] skip-if = [ - "!debug && os == 'mac'", #Bug 1559033 + "apple_catalina && !debug", #Bug 1559033 + "apple_silicon && !debug", #Bug 1559033 "a11y_checks", # Bugs 1849028 and 1858041 to investigate intermittent a11y_checks results ] diff --git a/devtools/client/inspector/computed/test/browser_computed_keybindings_01.js b/devtools/client/inspector/computed/test/browser_computed_keybindings_01.js index 5a6681f139..351d640bf9 100644 --- a/devtools/client/inspector/computed/test/browser_computed_keybindings_01.js +++ b/devtools/client/inspector/computed/test/browser_computed_keybindings_01.js @@ -83,7 +83,7 @@ function checkHelpLinkKeybinding(view) { info('Check that MDN link is opened on "F1"'); const propView = getFirstVisiblePropertyView(view); return new Promise(resolve => { - propView.mdnLinkClick = function (event) { + propView.mdnLinkClick = function () { ok(true, "Pressing F1 opened the MDN link"); resolve(); }; diff --git a/devtools/client/inspector/flexbox/components/FlexItemSizingProperties.js b/devtools/client/inspector/flexbox/components/FlexItemSizingProperties.js index 00bea31e57..ad26d3beab 100644 --- a/devtools/client/inspector/flexbox/components/FlexItemSizingProperties.js +++ b/devtools/client/inspector/flexbox/components/FlexItemSizingProperties.js @@ -90,12 +90,10 @@ class FlexItemSizingProperties extends PureComponent { * The name for this CSS property * @param {String} value * The property value - * @param {Booleam} isDefaultValue - * Whether the value come from the browser default style * @return {Object} * The React component representing this CSS property */ - renderCssProperty(name, value, isDefaultValue) { + renderCssProperty(name, value) { return dom.span({ className: "css-property-link" }, `(${name}: ${value})`); } @@ -115,7 +113,7 @@ class FlexItemSizingProperties extends PureComponent { ); } - renderBaseSizeSection({ mainBaseSize, clampState }, properties, dimension) { + renderBaseSizeSection({ mainBaseSize }, properties, dimension) { const flexBasisValue = properties["flex-basis"]; const dimensionValue = properties[dimension]; diff --git a/devtools/client/inspector/flexbox/reducers/flexbox.js b/devtools/client/inspector/flexbox/reducers/flexbox.js index 856294a549..46c1d4525c 100644 --- a/devtools/client/inspector/flexbox/reducers/flexbox.js +++ b/devtools/client/inspector/flexbox/reducers/flexbox.js @@ -58,7 +58,7 @@ const INITIAL_FLEXBOX = { }; const reducers = { - [CLEAR_FLEXBOX](flexbox, _) { + [CLEAR_FLEXBOX](_) { return INITIAL_FLEXBOX; }, diff --git a/devtools/client/inspector/fonts/reducers/font-editor.js b/devtools/client/inspector/fonts/reducers/font-editor.js index b40fff4ba1..fbfee2d666 100644 --- a/devtools/client/inspector/fonts/reducers/font-editor.js +++ b/devtools/client/inspector/fonts/reducers/font-editor.js @@ -62,7 +62,7 @@ const reducers = { return newState; }, - [RESET_EDITOR](state) { + [RESET_EDITOR]() { return { ...INITIAL_STATE }; }, diff --git a/devtools/client/inspector/grids/components/GridOutline.js b/devtools/client/inspector/grids/components/GridOutline.js index 65771f3f45..2a7a195bd0 100644 --- a/devtools/client/inspector/grids/components/GridOutline.js +++ b/devtools/client/inspector/grids/components/GridOutline.js @@ -344,7 +344,7 @@ class GridOutline extends PureComponent { ); } - renderGridOutlineBorder(borderWidth, borderHeight, color) { + renderGridOutlineBorder(borderWidth, borderHeight) { return dom.rect({ key: "border", className: "grid-outline-border", diff --git a/devtools/client/inspector/markup/markup.js b/devtools/client/inspector/markup/markup.js index 5d10b003c9..7975d442f8 100644 --- a/devtools/client/inspector/markup/markup.js +++ b/devtools/client/inspector/markup/markup.js @@ -1218,19 +1218,15 @@ MarkupView.prototype = { } else if (type == "idref") { // Select the node in the same document. nodeFront.walkerFront - .document(nodeFront) - .then(doc => { - return nodeFront.walkerFront - .querySelector(doc, "#" + CSS.escape(link)) - .then(node => { - if (!node) { - this.emit("idref-attribute-link-failed"); - return; - } - this.inspector.selection.setNodeFront(node, { - reason: "markup-attribute-link", - }); - }); + .getIdrefNode(nodeFront, CSS.escape(link)) + .then(node => { + if (!node) { + this.emitForTests("idref-attribute-link-failed"); + return; + } + this.inspector.selection.setNodeFront(node, { + reason: "markup-attribute-link", + }); }) .catch(console.error); } @@ -1555,7 +1551,7 @@ MarkupView.prototype = { } }, - _onTargetAvailable({ targetFront }) {}, + _onTargetAvailable() {}, _onTargetDestroyed({ targetFront, isModeSwitching }) { // Bug 1776250: We only watch targets in order to update containers which @@ -2103,14 +2099,12 @@ MarkupView.prototype = { * Mark the given node selected, and update the inspector.selection * object's NodeFront to keep consistent state between UI and selection. * - * @param {NodeFront} aNode + * @param {NodeFront} node * The NodeFront to mark as selected. - * @param {String} reason - * The reason for marking the node as selected. * @return {Boolean} False if the node is already marked as selected, true * otherwise. */ - markNodeAsSelected(node, reason = "nodeselected") { + markNodeAsSelected(node) { const container = this.getContainer(node); return this._markContainerAsSelected(container); }, diff --git a/devtools/client/inspector/markup/test/browser.toml b/devtools/client/inspector/markup/test/browser.toml index 0b566f5e18..4f08fd10f2 100644 --- a/devtools/client/inspector/markup/test/browser.toml +++ b/devtools/client/inspector/markup/test/browser.toml @@ -1,5 +1,4 @@ [DEFAULT] -prefs = ["devtools.chrome.enabled=false"] # Bug 1520383 - Force devtools.chrome.enabled to false regardless of whether we're in an official build so we don't show event bubbles from chrome event listeners in the inspector on unprivileged test pages. tags = "devtools" subsuite = "devtools" support-files = [ @@ -76,6 +75,7 @@ support-files = [ "lib_react_with_addons_15.3.1_min.js", "lib_react_with_addons_15.4.1.js", "react_external_listeners.js", + "resources/*", "shadowdom_open_debugger.min.js", "!/devtools/client/debugger/test/mochitest/shared-head.js", "!/devtools/client/inspector/test/head.js", diff --git a/devtools/client/inspector/markup/test/browser_markup_events_03.js b/devtools/client/inspector/markup/test/browser_markup_events_03.js index bebffec066..b0de4561e0 100644 --- a/devtools/client/inspector/markup/test/browser_markup_events_03.js +++ b/devtools/client/inspector/markup/test/browser_markup_events_03.js @@ -17,7 +17,7 @@ const TEST_DATA = [ expected: [ { type: "click", - filename: TEST_URL + ":69:17", + filename: TEST_URL + ":70:17", attributes: ["Bubbling"], handler: "es6Method(foo, bar) {\n" + ' alert("obj.es6Method");\n' + "}", @@ -29,7 +29,7 @@ const TEST_DATA = [ expected: [ { type: "click", - filename: TEST_URL + ":89:25", + filename: TEST_URL + ":91:25", attributes: ["Bubbling"], handler: "function* generator() {\n" + ' alert("generator");\n' + "}", }, @@ -40,7 +40,7 @@ const TEST_DATA = [ expected: [ { type: "click", - filename: TEST_URL + ":46:58", + filename: TEST_URL + ":47:58", attributes: ["Bubbling"], handler: "function*() {\n" + ' alert("anonGenerator");\n' + "}", }, diff --git a/devtools/client/inspector/markup/test/browser_markup_links_07.js b/devtools/client/inspector/markup/test/browser_markup_links_07.js index 2a86f3b1d9..830d370b03 100644 --- a/devtools/client/inspector/markup/test/browser_markup_links_07.js +++ b/devtools/client/inspector/markup/test/browser_markup_links_07.js @@ -7,6 +7,7 @@ // do follows the link. const TEST_URL = URL_ROOT_SSL + "doc_markup_links.html"; +const TEST_URL_BASE = URL_ROOT_SSL + "resources/doc_markup_links_base.html"; add_task(async function () { const { inspector } = await openInspectorForURL(TEST_URL); @@ -70,6 +71,31 @@ add_task(async function () { await followLinkNoNewNode(linkEl, true, inspector); }); +add_task(async function testDocumentWithBaseAttribute() { + const { inspector } = await openInspectorForURL(TEST_URL_BASE); + + info("Select a node with a URI attribute"); + await selectNode("img", inspector); + + info("Find the link element from the markup-view"); + const { editor } = await getContainerForSelector("img", inspector); + const linkEl = editor.attrElements.get("src").querySelector(".link"); + + info("Follow the link with middle-click and wait for the new tab to open"); + await followLinkWaitForTab( + linkEl, + false, + URL_ROOT_SSL + "doc_markup_tooltip.png" + ); + + info("Follow the link with meta/ctrl-click and wait for the new tab to open"); + await followLinkWaitForTab( + linkEl, + true, + URL_ROOT_SSL + "doc_markup_tooltip.png" + ); +}); + function performMouseDown(linkEl, metactrl) { const evt = linkEl.ownerDocument.createEvent("MouseEvents"); diff --git a/devtools/client/inspector/markup/test/browser_markup_links_aria_attributes.js b/devtools/client/inspector/markup/test/browser_markup_links_aria_attributes.js index 1f50ae6b88..6d02f214ae 100644 --- a/devtools/client/inspector/markup/test/browser_markup_links_aria_attributes.js +++ b/devtools/client/inspector/markup/test/browser_markup_links_aria_attributes.js @@ -16,42 +16,84 @@ const TEST_DATA = [ { selector: "#aria-activedescendant", attributeName: "aria-activedescendant", - links: ["activedescendant01"], + links: [{ id: "activedescendant01" }], }, { selector: "#aria-controls", attributeName: "aria-controls", - links: ["controls01", "controls02"], + links: [{ id: "controls01" }, { id: "controls02" }], }, { selector: "#aria-describedby", attributeName: "aria-describedby", - links: ["describedby01", "describedby02"], + links: [{ id: "describedby01" }, { id: "describedby02" }], }, { selector: "#aria-details", attributeName: "aria-details", - links: ["details01", "details02"], + links: [{ id: "details01" }, { id: "details02" }], }, { selector: "#aria-errormessage", attributeName: "aria-errormessage", - links: ["errormessage01"], + links: [{ id: "errormessage01" }], }, { selector: "#aria-flowto", attributeName: "aria-flowto", - links: ["flowto01", "flowto02"], + links: [{ id: "flowto01" }, { id: "flowto02" }], }, { selector: "#aria-labelledby", attributeName: "aria-labelledby", - links: ["labelledby01", "labelledby02"], + links: [{ id: "labelledby01" }, { id: "labelledby02" }], }, { selector: "#aria-owns", attributeName: "aria-owns", - links: ["owns01", "owns02"], + links: [{ id: "owns01" }, { id: "owns02" }], + }, + { + getContainer: async inspector => { + info("Find and expand the test-component shadow DOM host."); + const hostFront = await getNodeFront("test-component", inspector); + const hostContainer = inspector.markup.getContainer(hostFront); + await expandContainer(inspector, hostContainer); + + info("Expand the shadow root"); + const shadowRootContainer = hostContainer.getChildContainers()[0]; + await expandContainer(inspector, shadowRootContainer); + + info("Expand the slot"); + const slotContainer = shadowRootContainer.getChildContainers()[0]; + + is( + slotContainer.elt + .querySelector(`[data-attr="id"]`) + .getAttribute("data-value"), + "aria-describedby-shadow-dom", + `This is the container for button#aria-describedby-shadow-dom` + ); + + // The test expect the node to be selected + const updated = inspector.once("inspector-updated"); + inspector.selection.setNodeFront(slotContainer.node, { reason: "test" }); + await updated; + + return slotContainer; + }, + attributeName: "aria-describedby", + links: [{ id: "describedby01", valid: false }, { id: "describedbyshadow" }], + }, + { + selector: "#empty-attributes", + attributeName: "aria-activedescendant", + links: [], + }, + { + selector: "#empty-attributes", + attributeName: "aria-details", + links: [], }, ]; @@ -59,11 +101,16 @@ add_task(async function () { const { inspector } = await openInspectorForURL(TEST_URL); for (const test of TEST_DATA) { - info("Selecting test node " + test.selector); - await selectNode(test.selector, inspector); + let editor; + if (typeof test.getContainer === "function") { + ({ editor } = await test.getContainer(inspector)); + } else { + info("Selecting test node " + test.selector); + await selectNode(test.selector, inspector); + info("Finding the popupNode to anchor the context-menu to"); + ({ editor } = await getContainerForSelector(test.selector, inspector)); + } - info("Finding the popupNode to anchor the context-menu to"); - const { editor } = await getContainerForSelector(test.selector, inspector); const attributeEl = editor.attrElements.get(test.attributeName); const linksEl = attributeEl.querySelectorAll(".link"); @@ -79,8 +126,6 @@ add_task(async function () { const linkEl = linksEl[i]; ok(linkEl, "Found the link"); - const expectedReferencedNodeId = test.links[i]; - info("Simulating a context click on the link"); const allMenuItems = openContextMenuAndGetAllItems(inspector, { target: linkEl, @@ -95,6 +140,7 @@ add_task(async function () { is(linkFollow.visible, true, "The follow-link item is visible"); is(linkCopy.visible, false, "The copy-link item is not visible"); + const { id: expectedReferencedNodeId } = test.links[i]; const linkFollowItemLabel = INSPECTOR_L10N.getFormatStr( "inspector.menu.selectElement.label", expectedReferencedNodeId @@ -114,16 +160,32 @@ add_task(async function () { "Button has expected title" ); - info("Check that clicking on button selects the associated node"); - const onSelection = inspector.selection.once("new-node-front"); - buttonEl.click(); - await onSelection; - - is( - inspector.selection.nodeFront.id, - expectedReferencedNodeId, - "The expected new node was selected" - ); + if (test.links[i].valid !== false) { + info("Check that clicking on button selects the associated node"); + const onSelection = inspector.selection.once("new-node-front"); + buttonEl.click(); + await onSelection; + + is( + inspector.selection.nodeFront.id, + expectedReferencedNodeId, + "The expected new node was selected" + ); + } else { + info( + "Check that clicking on button triggers idref-attribute-link-failed event" + ); + const onIdrefAttributeLinkFailed = inspector.markup.once( + "idref-attribute-link-failed" + ); + const onSelection = inspector.selection.once("new-node-front"); + const onTimeout = wait(500).then(() => "TIMEOUT"); + buttonEl.click(); + await onIdrefAttributeLinkFailed; + ok(true, "Got expected idref-attribute-link-failed event"); + const res = await Promise.race([onSelection, onTimeout]); + is(res, "TIMEOUT", "Clicking the button did not select a new node"); + } } } }); diff --git a/devtools/client/inspector/markup/test/browser_markup_tag_edit_07.js b/devtools/client/inspector/markup/test/browser_markup_tag_edit_07.js index 38f7361725..563863d614 100644 --- a/devtools/client/inspector/markup/test/browser_markup_tag_edit_07.js +++ b/devtools/client/inspector/markup/test/browser_markup_tag_edit_07.js @@ -59,7 +59,7 @@ var TEST_DATA = [ expectedAttributes: { style: DATA_URL_INLINE_STYLE, }, - validate: (container, inspector) => { + validate: container => { const editor = container.editor; const visibleAttrText = editor.attrElements .get("style") @@ -75,7 +75,7 @@ var TEST_DATA = [ expectedAttributes: { "data-long": LONG_ATTRIBUTE, }, - validate: (container, inspector) => { + validate: container => { const editor = container.editor; const visibleAttrText = editor.attrElements .get("data-long") @@ -91,7 +91,7 @@ var TEST_DATA = [ expectedAttributes: { src: DATA_URL_ATTRIBUTE, }, - validate: (container, inspector) => { + validate: container => { const editor = container.editor; const visibleAttrText = editor.attrElements .get("src") @@ -107,17 +107,17 @@ var TEST_DATA = [ expectedAttributes: { "data-long": LONG_ATTRIBUTE, }, - setUp(inspector) { + setUp() { Services.prefs.setBoolPref("devtools.markup.collapseAttributes", false); }, - validate: (container, inspector) => { + validate: container => { const editor = container.editor; const visibleAttrText = editor.attrElements .get("data-long") .querySelector(".attr-value").textContent; is(visibleAttrText, LONG_ATTRIBUTE); }, - tearDown(inspector) { + tearDown() { Services.prefs.clearUserPref("devtools.markup.collapseAttributes"); }, }, @@ -127,10 +127,10 @@ var TEST_DATA = [ expectedAttributes: { "data-long": LONG_ATTRIBUTE, }, - setUp(inspector) { + setUp() { Services.prefs.setIntPref("devtools.markup.collapseAttributeLength", 2); }, - validate: (container, inspector) => { + validate: container => { const firstChar = LONG_ATTRIBUTE[0]; const lastChar = LONG_ATTRIBUTE[LONG_ATTRIBUTE.length - 1]; const collapsed = firstChar + "\u2026" + lastChar; @@ -140,7 +140,7 @@ var TEST_DATA = [ .querySelector(".attr-value").textContent; is(visibleAttrText, collapsed); }, - tearDown(inspector) { + tearDown() { Services.prefs.clearUserPref("devtools.markup.collapseAttributeLength"); }, }, diff --git a/devtools/client/inspector/markup/test/doc_markup_events_03.html b/devtools/client/inspector/markup/test/doc_markup_events_03.html index a0c067e33e..deb3730d32 100644 --- a/devtools/client/inspector/markup/test/doc_markup_events_03.html +++ b/devtools/client/inspector/markup/test/doc_markup_events_03.html @@ -43,6 +43,7 @@ generatorNode.addEventListener("click", generator); const anonGenerator = document.getElementById("anon-generator"); + // eslint-disable-next-line require-yield anonGenerator.addEventListener("click", function* () { alert("anonGenerator"); }); @@ -86,6 +87,7 @@ } }; + // eslint-disable-next-line require-yield function* generator() { alert("generator"); } diff --git a/devtools/client/inspector/markup/test/doc_markup_links_aria_attributes.html b/devtools/client/inspector/markup/test/doc_markup_links_aria_attributes.html index 0e3bf0a57f..d4fc13042f 100644 --- a/devtools/client/inspector/markup/test/doc_markup_links_aria_attributes.html +++ b/devtools/client/inspector/markup/test/doc_markup_links_aria_attributes.html @@ -3,6 +3,24 @@ Markup-view Linkify ARIA attributes +
aria-owns test
#owns01
#owns02
+ + + +
diff --git a/devtools/client/inspector/markup/test/resources/doc_markup_links_base.html b/devtools/client/inspector/markup/test/resources/doc_markup_links_base.html new file mode 100644 index 0000000000..55b5350ab5 --- /dev/null +++ b/devtools/client/inspector/markup/test/resources/doc_markup_links_base.html @@ -0,0 +1,12 @@ + + + + + Markup-view links with base attribute + + + + + Test relative links with base attributes. + + diff --git a/devtools/client/inspector/markup/views/element-editor.js b/devtools/client/inspector/markup/views/element-editor.js index f538c2f6a9..c7e47c0a7c 100644 --- a/devtools/client/inspector/markup/views/element-editor.js +++ b/devtools/client/inspector/markup/views/element-editor.js @@ -878,7 +878,7 @@ ElementEditor.prototype = { // Create links in the attribute value, and truncate long attribute values if needed. for (const token of parsedLinksData) { - if (token.type === "string") { + if (token.type === "string" || token.value?.trim() === "") { attributeValueEl.appendChild( this.doc.createTextNode(this._truncateAttributeValue(token.value)) ); diff --git a/devtools/client/inspector/node-picker.js b/devtools/client/inspector/node-picker.js index 24b53b51e0..ca837b12f1 100644 --- a/devtools/client/inspector/node-picker.js +++ b/devtools/client/inspector/node-picker.js @@ -22,11 +22,9 @@ loader.lazyRequireGetter( * * @param {Commands} commands * The commands object with all interfaces defined from devtools/shared/commands/ - * @param {Selection} selection - * The global Selection object */ class NodePicker extends EventEmitter { - constructor(commands, selection) { + constructor(commands) { super(); this.commands = commands; this.targetCommand = commands.targetCommand; @@ -305,7 +303,7 @@ class NodePicker extends EventEmitter { * When the picker is canceled, stop the picker, and make sure the toolbox * gets the focus. */ - #onCanceled = data => { + #onCanceled = () => { return this.stop({ canceled: true }); }; } diff --git a/devtools/client/inspector/rules/test/browser_rules_colorpicker-contrast-ratio.js b/devtools/client/inspector/rules/test/browser_rules_colorpicker-contrast-ratio.js index 6bdb9dd9d3..42a0f86904 100644 --- a/devtools/client/inspector/rules/test/browser_rules_colorpicker-contrast-ratio.js +++ b/devtools/client/inspector/rules/test/browser_rules_colorpicker-contrast-ratio.js @@ -122,11 +122,7 @@ async function checkColorPickerConstrastData({ expectedContrastValueScore, expectContrastRange = false, expectedMinContrastValueResult, - expectedMinContrastValueTitle, - expectedMinContrastValueScore, expectedMaxContrastValueResult, - expectedMaxContrastValueTitle, - expectedMaxContrastValueScore, }) { info(`Checking color picker: "${label}"`); const cPicker = view.tooltips.getTooltip("colorPicker"); diff --git a/devtools/client/inspector/rules/test/browser_rules_container-queries.js b/devtools/client/inspector/rules/test/browser_rules_container-queries.js index 1a1857be05..0e866c2a7a 100644 --- a/devtools/client/inspector/rules/test/browser_rules_container-queries.js +++ b/devtools/client/inspector/rules/test/browser_rules_container-queries.js @@ -264,13 +264,12 @@ async function assertQueryContainerTooltip({ expectedHeaderText, expectedBodyText, }) { - const tooltipTriggerEl = getRuleViewAncestorRulesDataElementByIndex( - view, - ruleIndex - ).querySelector(".container-query-declaration"); + const parent = getRuleViewAncestorRulesDataElementByIndex(view, ruleIndex); + const highlighterTriggerEl = parent.querySelector(".open-inspector"); + const tooltipTriggerEl = parent.querySelector(".container-query-declaration"); // Ensure that the element can be targetted from EventUtils. - tooltipTriggerEl.scrollIntoView(); + parent.scrollIntoView(); const { waitForHighlighterTypeShown, waitForHighlighterTypeHidden } = getHighlighterTestHelpers(inspector); @@ -280,17 +279,35 @@ async function assertQueryContainerTooltip({ ); const tooltip = view.tooltips.getTooltip("interactiveTooltip"); + + info("synthesizing mousemove on open-inspector icon: " + tooltip.isVisible()); + EventUtils.synthesizeMouseAtCenter( + highlighterTriggerEl, + { type: "mousemove" }, + highlighterTriggerEl.ownerDocument.defaultView + ); + + await onNodeHighlight; + info("node was highlighted"); + + const onNodeUnhighlight = waitForHighlighterTypeHidden( + inspector.highlighters.TYPES.BOXMODEL + ); + const onTooltipReady = tooltip.once("shown"); - info("synthesizing mousemove: " + tooltip.isVisible()); + + info("synthesizing mousemove on tooltip el: " + tooltip.isVisible()); EventUtils.synthesizeMouseAtCenter( tooltipTriggerEl, { type: "mousemove" }, tooltipTriggerEl.ownerDocument.defaultView ); + await onTooltipReady; info("tooltip was shown"); - await onNodeHighlight; - info("node was highlighted"); + + await onNodeUnhighlight; + info("highlighter was hidden"); is( tooltip.panel.querySelector("header").textContent, @@ -305,9 +322,7 @@ async function assertQueryContainerTooltip({ info("Hide the tooltip"); const onHidden = tooltip.once("hidden"); - const onNodeUnhighlight = waitForHighlighterTypeHidden( - inspector.highlighters.TYPES.BOXMODEL - ); + // Move the mouse elsewhere to hide the tooltip EventUtils.synthesizeMouse( tooltipTriggerEl.ownerDocument.body, @@ -317,5 +332,4 @@ async function assertQueryContainerTooltip({ tooltipTriggerEl.ownerDocument.defaultView ); await onHidden; - await onNodeUnhighlight; } diff --git a/devtools/client/inspector/rules/test/browser_rules_edit-size-property-dragging.js b/devtools/client/inspector/rules/test/browser_rules_edit-size-property-dragging.js index c95506de50..a10e7a6625 100644 --- a/devtools/client/inspector/rules/test/browser_rules_edit-size-property-dragging.js +++ b/devtools/client/inspector/rules/test/browser_rules_edit-size-property-dragging.js @@ -335,12 +335,11 @@ async function runIncrementTest(editor, view, tests) { * @param {String} options.description * @param {Boolean} options.ctrl Small increment key * @param {Boolean} options.alt Small increment key for macosx - * @param {Boolean} option.deadzoneIncluded True if the provided distance + * @param {Boolean} options.deadzoneIncluded True if the provided distance * accounts for the deadzone. When false, the deadzone will automatically * be added to the distance. - * @param {CSSRuleView} view */ -async function testIncrement(editor, options, view) { +async function testIncrement(editor, options) { info("Running subtest: " + options.description); editor.valueSpan.scrollIntoView(); diff --git a/devtools/client/inspector/rules/test/browser_rules_large_base64_background_image.js b/devtools/client/inspector/rules/test/browser_rules_large_base64_background_image.js index 0373d29321..717cc9bfb5 100644 --- a/devtools/client/inspector/rules/test/browser_rules_large_base64_background_image.js +++ b/devtools/client/inspector/rules/test/browser_rules_large_base64_background_image.js @@ -43,10 +43,20 @@ add_task(async function () { const { inspector } = await openInspectorForURL(TEST_URL); const view = selectRuleView(inspector); - await selectNode("body", inspector); - - const propertyValues = view.styleDocument.querySelectorAll( - ".ruleview-propertyvalue" + let propertyValues; + await waitFor( + async () => { + await selectNode("body", inspector); + propertyValues = view.styleDocument.querySelectorAll( + ".ruleview-propertyvalue" + ); + return propertyValues.length == 2; + }, + "Timed out while waiting for body element properties", + // Use default interval. + 10, + // reduce maxTries to 50 since `selectNode` is already async. + 50 ); is(propertyValues.length, 2, "Ruleview has 2 propertyvalue elements"); diff --git a/devtools/client/inspector/rules/test/browser_rules_original-source-link.js b/devtools/client/inspector/rules/test/browser_rules_original-source-link.js index 9d440659a2..473d0037b0 100644 --- a/devtools/client/inspector/rules/test/browser_rules_original-source-link.js +++ b/devtools/client/inspector/rules/test/browser_rules_original-source-link.js @@ -64,7 +64,7 @@ async function testClickingLink(toolbox, view) { function waitForOriginalStyleSheetEditorSelection(toolbox) { const panel = toolbox.getCurrentPanel(); - return new Promise((resolve, reject) => { + return new Promise(resolve => { const maybeContinue = editor => { // The style editor selects the first sheet at first load before // selecting the desired sheet. diff --git a/devtools/client/inspector/rules/test/browser_rules_original-source-link2.js b/devtools/client/inspector/rules/test/browser_rules_original-source-link2.js index 87963f9ec5..6e8faecc33 100644 --- a/devtools/client/inspector/rules/test/browser_rules_original-source-link2.js +++ b/devtools/client/inspector/rules/test/browser_rules_original-source-link2.js @@ -61,7 +61,7 @@ async function testClickingLink(toolbox, view) { function waitForOriginalStyleSheetEditorSelection(toolbox) { const panel = toolbox.getCurrentPanel(); - return new Promise((resolve, reject) => { + return new Promise(resolve => { const maybeContinue = editor => { // The style editor selects the first sheet at first load before // selecting the desired sheet. diff --git a/devtools/client/inspector/rules/test/browser_rules_pseudo-element_01.js b/devtools/client/inspector/rules/test/browser_rules_pseudo-element_01.js index f170cf1591..fcd0302624 100644 --- a/devtools/client/inspector/rules/test/browser_rules_pseudo-element_01.js +++ b/devtools/client/inspector/rules/test/browser_rules_pseudo-element_01.js @@ -11,6 +11,7 @@ const PSEUDO_PREF = "devtools.inspector.show_pseudo_elements"; add_task(async function () { await pushPref(PSEUDO_PREF, true); await pushPref("dom.customHighlightAPI.enabled", true); + await pushPref("layout.css.modern-range-pseudos.enabled", true); await addTab(TEST_URI); const { inspector, view } = await openRuleView(); @@ -24,6 +25,7 @@ add_task(async function () { await testList(inspector, view); await testDialogBackdrop(inspector, view); await testCustomHighlight(inspector, view); + await testSlider(inspector, view); }); async function testTopLeft(inspector, view) { @@ -344,6 +346,36 @@ async function testCustomHighlight(inspector, view) { assertGutters(view); } +async function testSlider(inspector, view) { + await assertPseudoElementRulesNumbers( + "input[type=range].slider", + inspector, + view, + { + elementRulesNb: 3, + sliderFillRulesNb: 1, + sliderThumbRulesNb: 1, + sliderTrackRulesNb: 1, + } + ); + assertGutters(view); + + info( + "Check that ::slider-* pseudo elements are not displayed for non-range inputs" + ); + await assertPseudoElementRulesNumbers( + "input[type=text].slider", + inspector, + view, + { + elementRulesNb: 3, + sliderFillRulesNb: 0, + sliderThumbRulesNb: 0, + sliderTrackRulesNb: 0, + } + ); +} + function convertTextPropsToString(textProps) { return textProps .map( @@ -395,6 +427,15 @@ async function assertPseudoElementRulesNumbers( highlightRules: elementStyle.rules.filter(rule => rule.pseudoElement?.startsWith("::highlight(") ), + sliderFillRules: elementStyle.rules.filter( + rule => rule.pseudoElement === "::slider-fill" + ), + sliderThumbRules: elementStyle.rules.filter( + rule => rule.pseudoElement === "::slider-thumb" + ), + sliderTrackRules: elementStyle.rules.filter( + rule => rule.pseudoElement === "::slider-track" + ), }; is( @@ -437,6 +478,21 @@ async function assertPseudoElementRulesNumbers( ruleNbs.highlightRulesNb || 0, selector + " has the correct number of ::highlight rules" ); + is( + rules.sliderFillRules.length, + ruleNbs.sliderFillRulesNb || 0, + selector + " has the correct number of ::slider-fill rules" + ); + is( + rules.sliderThumbRules.length, + ruleNbs.sliderThumbRulesNb || 0, + selector + " has the correct number of ::slider-thumb rules" + ); + is( + rules.sliderTrackRules.length, + ruleNbs.sliderTrackRulesNb || 0, + selector + " has the correct number of ::slider-track rules" + ); // If we do have pseudo element rules displayed, ensure we don't mark their selectors // as matched or unmatched diff --git a/devtools/client/inspector/rules/test/doc_pseudoelement.html b/devtools/client/inspector/rules/test/doc_pseudoelement.html index a6251c613c..8e077e220b 100644 --- a/devtools/client/inspector/rules/test/doc_pseudoelement.html +++ b/devtools/client/inspector/rules/test/doc_pseudoelement.html @@ -133,7 +133,15 @@ dialog::backdrop { } } - +input::slider-fill { + background: tomato; +} +input::slider-thumb { + background: gold; +} +input::slider-track { + background: seagreen; +} @@ -161,6 +169,9 @@ dialog::backdrop { In dialog + + +
Firefox Developer Tools is a set of web developer tools built into Firefox. You can use them to examine, edit, and debug HTML, CSS, and JavaScript. diff --git a/devtools/client/inspector/rules/views/rule-editor.js b/devtools/client/inspector/rules/views/rule-editor.js index 93e24f0946..a5717976d0 100644 --- a/devtools/client/inspector/rules/views/rule-editor.js +++ b/devtools/client/inspector/rules/views/rule-editor.js @@ -410,7 +410,7 @@ RuleEditor.prototype = { this._ruleViewIsEditing = this.ruleView.isEditing; }); - code.addEventListener("click", event => { + code.addEventListener("click", () => { const selection = this.doc.defaultView.getSelection(); if (selection.isCollapsed && !this._ruleViewIsEditing) { this.newProperty(); @@ -905,10 +905,8 @@ RuleEditor.prototype = { * True if the change should be applied. * @param {Number} direction * The move focus direction number. - * @param {Number} key - * The event keyCode that trigger the editor to close */ - async _onSelectorDone(value, commit, direction, key) { + async _onSelectorDone(value, commit, direction) { if ( !commit || this.isEditing || diff --git a/devtools/client/inspector/rules/views/text-property-editor.js b/devtools/client/inspector/rules/views/text-property-editor.js index 8546417cfb..edcdb856a8 100644 --- a/devtools/client/inspector/rules/views/text-property-editor.js +++ b/devtools/client/inspector/rules/views/text-property-editor.js @@ -385,7 +385,7 @@ TextPropertyEditor.prototype = { } }); - this.valueSpan.addEventListener("mouseup", event => { + this.valueSpan.addEventListener("mouseup", () => { // if we have dragged, we will handle the pending click in _draggingOnMouseUp instead if (this._hasDragged) { return; @@ -1146,10 +1146,8 @@ TextPropertyEditor.prototype = { * True if the change should be applied. * @param {Number} direction * The move focus direction number. - * @param {Number} key - * The event keyCode that trigger the editor to close */ - _onNameDone(value, commit, direction, key) { + _onNameDone(value, commit, direction) { const isNameUnchanged = (!commit && !this.ruleEditor.isEditing) || this.committed.name === value; if (this.prop.value && isNameUnchanged) { @@ -1233,10 +1231,8 @@ TextPropertyEditor.prototype = { * True if the change should be applied. * @param {Number} direction * The move focus direction number. - * @param {Number} key - * The event keyCode that trigger the editor to close */ - _onValueDone(value = "", commit, direction, key) { + _onValueDone(value = "", commit, direction) { const parsedProperties = this._getValueAndExtraProperties(value); const val = parseSingleValue( this.cssProperties.isKnown, diff --git a/devtools/client/inspector/shared/highlighters-overlay.js b/devtools/client/inspector/shared/highlighters-overlay.js index 6082b8b842..7f44f8b555 100644 --- a/devtools/client/inspector/shared/highlighters-overlay.js +++ b/devtools/client/inspector/shared/highlighters-overlay.js @@ -793,13 +793,8 @@ class HighlightersOverlay { /** * Called after the shapes highlighter was hidden. - * - * @param {Object} data - * Data associated with the event. - * Contains: - * - {NodeFront} node: The NodeFront of the element that was highlighted. */ - onShapesHighlighterHidden(data) { + onShapesHighlighterHidden() { this.emit( "shapes-highlighter-hidden", this.shapesHighlighterShown, @@ -1178,7 +1173,7 @@ class HighlightersOverlay { async restoreParentGridHighlighter(node) { // Find the highlighter map entry for the subgrid whose parent grid is the given node. const entry = Array.from(this.gridHighlighters.entries()).find( - ([key, value]) => { + ([, value]) => { return value?.parentGridNode === node; } ); diff --git a/devtools/client/inspector/test/browser_inspector_highlighter-autohide-config_03.js b/devtools/client/inspector/test/browser_inspector_highlighter-autohide-config_03.js index 188b99a7cb..e90bd87ad0 100644 --- a/devtools/client/inspector/test/browser_inspector_highlighter-autohide-config_03.js +++ b/devtools/client/inspector/test/browser_inspector_highlighter-autohide-config_03.js @@ -60,7 +60,7 @@ add_task(async function () { somehow not overwritten and fires another "highlighter-hidden" event. */ let wasEmitted = false; - const waitForExtraEvent = new Promise((resolve, reject) => { + const waitForExtraEvent = new Promise(resolve => { const _handler = () => { wasEmitted = true; resolve(); diff --git a/devtools/client/inspector/test/browser_inspector_highlighter-eyedropper-events.js b/devtools/client/inspector/test/browser_inspector_highlighter-eyedropper-events.js index 0c05aa219f..5fa5567e3f 100644 --- a/devtools/client/inspector/test/browser_inspector_highlighter-eyedropper-events.js +++ b/devtools/client/inspector/test/browser_inspector_highlighter-eyedropper-events.js @@ -60,10 +60,10 @@ const MOVE_EVENTS_DATA = [ // Mouse initialization for right snapping { type: "mouse", - x: (width, height) => width - 5, + x: width => width - 5, y: 0, expected: { - x: (width, height) => width - 5, + x: width => width - 5, y: 0, }, }, @@ -73,7 +73,7 @@ const MOVE_EVENTS_DATA = [ key: "VK_RIGHT", shift: true, expected: { - x: (width, height) => width, + x: width => width, y: 0, }, desc: "Right snapping to x=max window width available", diff --git a/devtools/client/inspector/test/browser_inspector_highlighter-eyedropper-label.js b/devtools/client/inspector/test/browser_inspector_highlighter-eyedropper-label.js index d9413e5d39..37d3070c04 100644 --- a/devtools/client/inspector/test/browser_inspector_highlighter-eyedropper-label.js +++ b/devtools/client/inspector/test/browser_inspector_highlighter-eyedropper-label.js @@ -65,14 +65,14 @@ const TEST_DATA = [ }, { desc: "Move the mouse to the top left", - getCoordinates: (width, height) => { + getCoordinates: () => { return { x: 0, y: 0 }; }, expectedPositions: { top: false, right: true, left: false }, }, { desc: "Move the mouse to the top right", - getCoordinates: (width, height) => { + getCoordinates: width => { return { x: width, y: 0 }; }, expectedPositions: { top: false, right: false, left: true }, diff --git a/devtools/client/inspector/test/browser_inspector_highlighter-geometry_01.js b/devtools/client/inspector/test/browser_inspector_highlighter-geometry_01.js index c50dee30b0..bfdfd12cd8 100644 --- a/devtools/client/inspector/test/browser_inspector_highlighter-geometry_01.js +++ b/devtools/client/inspector/test/browser_inspector_highlighter-geometry_01.js @@ -58,7 +58,6 @@ async function hasArrowsAndLabelsAndHandlers({ getElementAttribute }) { async function isHiddenForNonPositionedNonSizedElement({ show, - hide, isElementHidden, }) { info("Asking to show the highlighter on an inline, non p ositioned element"); diff --git a/devtools/client/inspector/test/browser_inspector_highlighter-measure_03.js b/devtools/client/inspector/test/browser_inspector_highlighter-measure_03.js index 906284ba86..dbe70d83ae 100644 --- a/devtools/client/inspector/test/browser_inspector_highlighter-measure_03.js +++ b/devtools/client/inspector/test/browser_inspector_highlighter-measure_03.js @@ -16,10 +16,10 @@ const WIDTH = 160; const HEIGHT = 100; const HANDLER_MAP = { - top(areaWidth, areaHeight) { + top(areaWidth) { return { x: Math.round(areaWidth / 2), y: 0 }; }, - topright(areaWidth, areaHeight) { + topright(areaWidth) { return { x: areaWidth, y: 0 }; }, right(areaWidth, areaHeight) { @@ -37,7 +37,7 @@ const HANDLER_MAP = { left(areaWidth, areaHeight) { return { x: 0, y: Math.round(areaHeight / 2) }; }, - topleft(areaWidth, areaHeight) { + topleft() { return { x: 0, y: 0 }; }, }; diff --git a/devtools/client/inspector/test/browser_inspector_highlighter-measure_04.js b/devtools/client/inspector/test/browser_inspector_highlighter-measure_04.js index d9dcd5d89f..8493981dd3 100644 --- a/devtools/client/inspector/test/browser_inspector_highlighter-measure_04.js +++ b/devtools/client/inspector/test/browser_inspector_highlighter-measure_04.js @@ -18,10 +18,10 @@ const X_OFFSET = 15; const Y_OFFSET = 10; const HANDLER_MAP = { - top(areaWidth, areaHeight) { + top(areaWidth) { return { x: Math.round(areaWidth / 2), y: 0 }; }, - topright(areaWidth, areaHeight) { + topright(areaWidth) { return { x: areaWidth, y: 0 }; }, right(areaWidth, areaHeight) { @@ -39,7 +39,7 @@ const HANDLER_MAP = { left(areaWidth, areaHeight) { return { x: 0, y: Math.round(areaHeight / 2) }; }, - topleft(areaWidth, areaHeight) { + topleft() { return { x: 0, y: 0 }; }, }; diff --git a/devtools/client/inspector/test/browser_inspector_sidebarstate.js b/devtools/client/inspector/test/browser_inspector_sidebarstate.js index 396e78c91f..6ccc6df6f4 100644 --- a/devtools/client/inspector/test/browser_inspector_sidebarstate.js +++ b/devtools/client/inspector/test/browser_inspector_sidebarstate.js @@ -122,8 +122,8 @@ function checkTelemetryResults() { const expected = TELEMETRY_DATA[i]; // ignore timestamp - ok(timestamp > 0, "timestamp is greater than 0"); - ok(extra.time_open > 0, "time_open is greater than 0"); + Assert.greater(timestamp, 0, "timestamp is greater than 0"); + Assert.greater(Number(extra.time_open), 0, "time_open is greater than 0"); is(category, expected.category, "category is correct"); is(method, expected.method, "method is correct"); is(object, expected.object, "object is correct"); diff --git a/devtools/client/inspector/test/browser_inspector_switch-to-inspector-on-pick.js b/devtools/client/inspector/test/browser_inspector_switch-to-inspector-on-pick.js index 171f4f8e7f..2bcd2e9873 100644 --- a/devtools/client/inspector/test/browser_inspector_switch-to-inspector-on-pick.js +++ b/devtools/client/inspector/test/browser_inspector_switch-to-inspector-on-pick.js @@ -104,7 +104,7 @@ function checkResults() { is(method, expected.method, "method is correct"); is(object, expected.object, "object is correct"); is(value, null, "value is correct"); - ok(extra.width > 0, "width is greater than 0"); + Assert.greater(Number(extra.width), 0, "width is greater than 0"); checkExtra("host", extra, expected); checkExtra("start_state", extra, expected); diff --git a/devtools/client/inspector/toolsidebar.js b/devtools/client/inspector/toolsidebar.js index cff5eb96fa..422ae76b43 100644 --- a/devtools/client/inspector/toolsidebar.js +++ b/devtools/client/inspector/toolsidebar.js @@ -151,10 +151,8 @@ ToolSidebar.prototype = { * @param {String} tabId The ID of the tab that was used to register it, or * the tab id attribute value if the tab existed before the sidebar * got created. - * @param {String} tabPanelId Optional. If provided, this ID will be used - * instead of the tabId to retrieve and remove the corresponding */ - removeTab(tabId, tabPanelId) { + removeTab(tabId) { this._tabbar.removeTab(tabId); this.emit("tab-unregistered", tabId); -- cgit v1.2.3