Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-10-22 17:55:50 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Backed out 2 changesets (bug 1581008) for mochitest failures on test_styles-matched.html. CLOSED TREE

Browse Source 
Backed out changeset 1208c70dd3bd (bug 1581008)
Backed out changeset d69f8f5f9db4 (bug 1581008)
This commit is contained in:
Cosmin Sabou 2019-09-25 11:51:11 +03:00
parent 1a317c31b2
commit b9c401dc1b
8 changed files with 18 additions and 199 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
devtools/client/inspector/rules/test/browser.ini
View File

@ -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]

81
devtools/client/inspector/rules/test/browser_rules_inactive_css_visited.js
View File

@ -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 = `
<style type='text/css'>
a:visited, #visited-and-other-matched-selector {
background-color: transparent;
border-color: lime;
color: rgba(0, 255, 0, 0.8);
font-size: 100px;
margin-left: 50px;
}
</style>
<a href="${VISISTED_URI}" id="visited-only">link1</a>
<a href="${VISISTED_URI}" id="visited-and-other-matched-selector">link2</a>
`;
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);
});

2
devtools/client/locales/en-US/tooltips.ftl
View File

@ -33,8 +33,6 @@ inactive-css-property-because-of-display = <strong>{ $property }</strong> has no
inactive-css-not-display-block-on-floated = The <strong>display</strong> value has been changed by the engine to <strong>block</strong> because the element is <strong>floated<strong>.
inactive-css-property-is-impossible-to-override-in-visited = It’s impossible to override <strong>{ $property }</strong> due to <strong>:visited</strong> 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.

8
devtools/client/shared/widgets/tooltip/inactive-css-tooltip-helper.js
View File

@ -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");

6
devtools/server/actors/inspector/css-logic.js
View File

@ -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.
*

13
devtools/server/actors/styles.js
View File

@ -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")
);
}

93
devtools/server/actors/utils/inactive-property-helper.js
View File

@ -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];
}

13
devtools/shared/inspector/css-logic.js
View File

@ -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;