From b9c401dc1b9cb0a9de0bfa0d015664dbfdcd6577 Mon Sep 17 00:00:00 2001 From: Cosmin Sabou Date: Wed, 25 Sep 2019 11:51:11 +0300 Subject: [PATCH] Backed out 2 changesets (bug 1581008) for mochitest failures on test_styles-matched.html. CLOSED TREE Backed out changeset 1208c70dd3bd (bug 1581008) Backed out changeset d69f8f5f9db4 (bug 1581008) --- .../client/inspector/rules/test/browser.ini | 1 - .../browser_rules_inactive_css_visited.js | 81 ---------------- devtools/client/locales/en-US/tooltips.ftl | 2 - .../tooltip/inactive-css-tooltip-helper.js | 8 +- devtools/server/actors/inspector/css-logic.js | 6 -- devtools/server/actors/styles.js | 13 ++- .../actors/utils/inactive-property-helper.js | 93 +------------------ devtools/shared/inspector/css-logic.js | 13 --- 8 files changed, 18 insertions(+), 199 deletions(-) delete mode 100644 devtools/client/inspector/rules/test/browser_rules_inactive_css_visited.js diff --git a/devtools/client/inspector/rules/test/browser.ini b/devtools/client/inspector/rules/test/browser.ini index 4d51bc978cd7..f8c0b67bffc6 100644 --- a/devtools/client/inspector/rules/test/browser.ini +++ b/devtools/client/inspector/rules/test/browser.ini @@ -210,7 +210,6 @@ skip-if = os == 'linux' # focusEditableField times out consistently on linux. [browser_rules_inactive_css_grid.js] [browser_rules_inactive_css_inline.js] [browser_rules_inactive_css_split-condition.js] -[browser_rules_inactive_css_visited.js] [browser_rules_inherited-properties_01.js] [browser_rules_inherited-properties_02.js] [browser_rules_inherited-properties_03.js] diff --git a/devtools/client/inspector/rules/test/browser_rules_inactive_css_visited.js b/devtools/client/inspector/rules/test/browser_rules_inactive_css_visited.js deleted file mode 100644 index 0301a4206116..000000000000 --- a/devtools/client/inspector/rules/test/browser_rules_inactive_css_visited.js +++ /dev/null @@ -1,81 +0,0 @@ -/* Any copyright is dedicated to the Public Domain. - http://creativecommons.org/publicdomain/zero/1.0/ */ - -"use strict"; - -// Test css properties that are inactive in :visited rule. - -const VISISTED_URI = URL_ROOT + "doc_variables_1.html"; - -const TEST_URI = ` - - link1 - link2 -`; - -const TEST_DATA = [ - { - selector: "#visited-only", - inactiveDeclarations: [ - { - declaration: { "font-size": "100px" }, - ruleIndex: 1, - }, - { - declaration: { "margin-left": "50px" }, - ruleIndex: 1, - }, - ], - activeDeclarations: [ - { - declarations: { - "background-color": "transparent", - "border-color": "lime", - color: "rgba(0, 255, 0, 0.8)", - }, - ruleIndex: 1, - }, - ], - }, - { - selector: "#visited-and-other-matched-selector", - activeDeclarations: [ - { - declarations: { - "background-color": "transparent", - "border-color": "lime", - color: "rgba(0, 255, 0, 0.8)", - "font-size": "100px", - "margin-left": "50px", - }, - ruleIndex: 1, - }, - ], - }, -]; - -add_task(async () => { - info("Open a particular url to make a visited link"); - const tab = await addTab(VISISTED_URI); - - info("Open tested page in the same tab"); - tab.linkedBrowser.loadURI( - "data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI), - { - triggeringPrincipal: Services.scriptSecurityManager.getSystemPrincipal(), - } - ); - - info("Open the inspector"); - const { inspector, view } = await openRuleView(); - - await runInactiveCSSTests(view, inspector, TEST_DATA); -}); diff --git a/devtools/client/locales/en-US/tooltips.ftl b/devtools/client/locales/en-US/tooltips.ftl index 65ab428ab380..0bc3624e1df6 100644 --- a/devtools/client/locales/en-US/tooltips.ftl +++ b/devtools/client/locales/en-US/tooltips.ftl @@ -33,8 +33,6 @@ inactive-css-property-because-of-display = { $property } has no inactive-css-not-display-block-on-floated = The display value has been changed by the engine to block because the element is floated. -inactive-css-property-is-impossible-to-override-in-visited = It’s impossible to override { $property } due to :visited restriction. - ## In the Rule View when a CSS property cannot be successfully applied we display ## an icon. When this icon is hovered this message is displayed to explain how ## the problem can be solved. diff --git a/devtools/client/shared/widgets/tooltip/inactive-css-tooltip-helper.js b/devtools/client/shared/widgets/tooltip/inactive-css-tooltip-helper.js index 050271bd394b..85ffb1234b6e 100644 --- a/devtools/client/shared/widgets/tooltip/inactive-css-tooltip-helper.js +++ b/devtools/client/shared/widgets/tooltip/inactive-css-tooltip-helper.js @@ -79,13 +79,13 @@ class InactiveCssTooltipHelper { */ getTemplate(data, tooltip) { const XHTML_NS = "http://www.w3.org/1999/xhtml"; - const { fixId, msgId, numFixProps, property, display, learnMoreURL } = data; + const { fixId, msgId, numFixProps, property, display } = data; const { doc } = tooltip; - const documentURL = - learnMoreURL || `https://developer.mozilla.org/docs/Web/CSS/${property}`; this._currentTooltip = tooltip; - this._currentUrl = `${documentURL}?utm_source=devtools&utm_medium=inspector-inactive-css`; + this._currentUrl = + `https://developer.mozilla.org/docs/Web/CSS/${property}` + + `?utm_source=devtools&utm_medium=inspector-inactive-css`; const templateNode = doc.createElementNS(XHTML_NS, "template"); diff --git a/devtools/server/actors/inspector/css-logic.js b/devtools/server/actors/inspector/css-logic.js index a608d9ec1570..9fe346888c1e 100644 --- a/devtools/server/actors/inspector/css-logic.js +++ b/devtools/server/actors/inspector/css-logic.js @@ -33,7 +33,6 @@ const { getBindingElementAndPseudo, getCSSStyleRules, l10n, - hasVisitedState, isAgentStylesheet, isAuthorStylesheet, isUserStylesheet, @@ -725,11 +724,6 @@ CssLogic.href = function(sheet) { return href; }; -/** - * Returns true if the given node has visited state. - */ -CssLogic.hasVisitedState = hasVisitedState; - /** * A safe way to access cached bits of information about a stylesheet. * diff --git a/devtools/server/actors/styles.js b/devtools/server/actors/styles.js index 20c3158e9dee..7da53ea8cd70 100644 --- a/devtools/server/actors/styles.js +++ b/devtools/server/actors/styles.js @@ -101,6 +101,8 @@ const BOLD_FONT_WEIGHT = 700; // Offset (in px) to avoid cutting off text edges of italic fonts. const FONT_PREVIEW_OFFSET = 4; +const NS_EVENT_STATE_VISITED = 1 << 24; + /** * The PageStyle actor lets the client look at the styles on a page, as * they are applied to a given node. @@ -723,7 +725,7 @@ var PageStyleActor = protocol.ActorClassWithSpec(pageStyleSpec, { const domRules = InspectorUtils.getCSSStyleRules( node, pseudo, - CssLogic.hasVisitedState(node) + _hasVisitedState(node) ); if (!domRules) { @@ -841,7 +843,7 @@ var PageStyleActor = protocol.ActorClassWithSpec(pageStyleSpec, { const { bindingElement, pseudo } = CssLogic.getBindingElementAndPseudo( element ); - const relevantLinkVisited = CssLogic.hasVisitedState(bindingElement); + const relevantLinkVisited = _hasVisitedState(bindingElement); entry.matchedSelectors = []; for (let i = 0; i < selectors.length; i++) { @@ -2247,3 +2249,10 @@ function getTextAtLineColumn(text, line, column) { } exports.getTextAtLineColumn = getTextAtLineColumn; + +function _hasVisitedState(node) { + return ( + !!(InspectorUtils.getContentState(node) & NS_EVENT_STATE_VISITED) || + InspectorUtils.hasPseudoClassLock(node, ":visited") + ); +} diff --git a/devtools/server/actors/utils/inactive-property-helper.js b/devtools/server/actors/utils/inactive-property-helper.js index 456b88080f67..16bdd4198ff1 100644 --- a/devtools/server/actors/utils/inactive-property-helper.js +++ b/devtools/server/actors/utils/inactive-property-helper.js @@ -5,33 +5,12 @@ "use strict"; const Services = require("Services"); -const InspectorUtils = require("InspectorUtils"); - -loader.lazyRequireGetter( - this, - "CssLogic", - "devtools/server/actors/inspector/css-logic", - true -); const INACTIVE_CSS_ENABLED = Services.prefs.getBoolPref( "devtools.inspector.inactive.css.enabled", false ); -const VISITED_MDN_LINK = "https://developer.mozilla.org/docs/Web/CSS/:visited"; -const VISITED_INVALID_PROPERTIES = allCssPropertiesExcept([ - "color", - "background-color", - "border-color", - "border-bottom-color", - "border-left-color", - "border-right-color", - "border-top-color", - "column-rule-color", - "outline-color", -]); - class InactivePropertyHelper { /** * A list of rules for when CSS properties have no effect. @@ -216,15 +195,6 @@ class InactivePropertyHelper { msgId: "inactive-css-not-display-block-on-floated", numFixProps: 2, }, - // The property is impossible to override due to :visited restriction. - { - invalidProperties: VISITED_INVALID_PROPERTIES, - when: () => this.isVisitedRule(), - fixId: "learn-more", - msgId: "inactive-css-property-is-impossible-to-override-in-visited", - numFixProps: 1, - learnMoreURL: VISITED_MDN_LINK, - }, ]; } @@ -269,9 +239,6 @@ class InactivePropertyHelper { * The number of properties we suggest in the fixId string. * @return {String} object.property * The inactive property name. - * @return {String} object.learnMoreURL - * An optional link if we need to open an other link than - * the default MDN property one. * @return {Boolean} object.used * true if the property is used. */ @@ -286,7 +253,6 @@ class InactivePropertyHelper { let fixId = ""; let msgId = ""; let numFixProps = 0; - let learnMoreURL = null; let used = true; this.VALIDATORS.some(validator => { @@ -294,7 +260,9 @@ class InactivePropertyHelper { let isRuleConcerned = false; if (validator.invalidProperties) { - isRuleConcerned = validator.invalidProperties.includes(property); + isRuleConcerned = + validator.invalidProperties === "*" || + validator.invalidProperties.includes(property); } if (!isRuleConcerned) { @@ -309,7 +277,6 @@ class InactivePropertyHelper { fixId = validator.fixId; msgId = validator.msgId; numFixProps = validator.numFixProps; - learnMoreURL = validator.learnMoreURL; used = false; return true; @@ -333,7 +300,6 @@ class InactivePropertyHelper { msgId, numFixProps, property, - learnMoreURL, used, }; } @@ -661,39 +627,6 @@ class InactivePropertyHelper { return !!this.getParentGridElement(this.node); } - isVisitedRule() { - if (!CssLogic.hasVisitedState(this.node)) { - return false; - } - - const selectors = CssLogic.getSelectors(this.cssRule); - if (!selectors.some(s => s.endsWith(":visited"))) { - return false; - } - - const { bindingElement, pseudo } = CssLogic.getBindingElementAndPseudo( - this.node - ); - - for (let i = 0; i < selectors.length; i++) { - if ( - !selectors[i].endsWith(":visited") && - InspectorUtils.selectorMatchesElement( - bindingElement, - this.cssRule, - i, - pseudo, - true - ) - ) { - // Match non :visited selector. - return false; - } - } - - return true; - } - getParentGridElement(node) { // The documentElement can't be a grid item, only a container, so bail out. if (node.flattenedTreeParentNode === node.ownerDocument) { @@ -743,23 +676,3 @@ class InactivePropertyHelper { } exports.inactivePropertyHelper = new InactivePropertyHelper(); - -/** - * Returns all CSS property names except given properties. - * - * @param {Array} - propertiesToIgnore - * Array of property ignored. - * @return {Array} - * Array of all CSS property name except propertiesToIgnore. - */ -function allCssPropertiesExcept(propertiesToIgnore) { - const properties = new Set( - InspectorUtils.getCSSPropertyNames({ includeAliases: true }) - ); - - for (const name of propertiesToIgnore) { - properties.delete(name); - } - - return [...properties]; -} diff --git a/devtools/shared/inspector/css-logic.js b/devtools/shared/inspector/css-logic.js index bb2c6e67e97e..a17d4594384b 100644 --- a/devtools/shared/inspector/css-logic.js +++ b/devtools/shared/inspector/css-logic.js @@ -553,16 +553,3 @@ function getCSSStyleRules(node) { return rules; } exports.getCSSStyleRules = getCSSStyleRules; - -/** - * Returns true if the given node has visited state. - */ -function hasVisitedState(node) { - const NS_EVENT_STATE_VISITED = 1 << 24; - - return ( - !!(InspectorUtils.getContentState(node) & NS_EVENT_STATE_VISITED) || - InspectorUtils.hasPseudoClassLock(node, ":visited") - ); -} -exports.hasVisitedState = hasVisitedState;