Bug 1753196 - [devtools] RuleView: inherited properties marked as overridden incorrectly r=nchevobbe

When both the current and the earlier props for a given property name are inherited, the current prop should not be marked as overridden if the earlier prop was marked as !important.
!important should only come into play if the property where it was set is not inherited.
Regardless of this, properties are considered in descending order of specificity, so the earlier rule should take precedence.

Differential Revision: https://phabricator.services.mozilla.com/D138895
This commit is contained in:
Julian Descottes 2022-02-16 15:15:33 +00:00
Родитель 83a5e4634f
Коммит 07eb8a003f
2 изменённых файлов: 8 добавлений и 3 удалений

Просмотреть файл

@ -344,8 +344,7 @@ class ElementStyle {
earlier &&
computedProp.priority === "important" &&
earlier.priority !== "important" &&
(earlier.textProp.rule.inherited ||
!computedProp.textProp.rule.inherited)
!computedProp.textProp.rule.inherited
) {
// New property is higher priority. Mark the earlier property
// overridden (which will reverse its dirty state).

Просмотреть файл

@ -20,10 +20,12 @@ const TEST_URI = `
body {
margin-right: 1px !important;
font-size: 79px;
line-height: 100px !important;
}
span {
font-size: 12px;
line-height: 10px;
}
</style>
<body>
@ -51,10 +53,14 @@ function testMarkOverridden(inspector, view) {
{ name: "margin-right", value: "23px", overridden: false },
{ name: "margin-left", value: "1px", overridden: false },
],
[{ name: "font-size", value: "12px", overridden: false }],
[
{ name: "font-size", value: "12px", overridden: false },
{ name: "line-height", value: "10px", overridden: false },
],
[
{ name: "margin-right", value: "1px", overridden: true },
{ name: "font-size", value: "79px", overridden: true },
{ name: "line-height", value: "100px", overridden: true },
],
];