- Revision
- 126737
- Author
- [email protected]
- Date
- 2012-08-27 02:36:11 -0700 (Mon, 27 Aug 2012)
Log Message
Web Inspector: Incorrect property override computation when !important is involved
https://bugs.webkit.org/show_bug.cgi?id=94923
Reviewed by Vsevolod Vlasov.
Source/WebCore:
The cascade of !important properties was totally wrong if a property was listed as !important first and as non-!important later on.
* inspector/front-end/StylesSidebarPane.js:
(WebInspector.StylesSidebarPane.prototype._refreshStyleRules):
(WebInspector.StylesSidebarPane.prototype._markUsedProperties):
LayoutTests:
* inspector/elements/elements-panel-styles-expected.txt:
* inspector/elements/resources/elements-panel-styles.css:
(.foo, .foo::before):
Modified Paths
Diff
Modified: trunk/LayoutTests/ChangeLog (126736 => 126737)
--- trunk/LayoutTests/ChangeLog 2012-08-27 09:26:15 UTC (rev 126736)
+++ trunk/LayoutTests/ChangeLog 2012-08-27 09:36:11 UTC (rev 126737)
@@ -1,3 +1,14 @@
+2012-08-24 Alexander Pavlov <[email protected]>
+
+ Web Inspector: Incorrect property override computation when !important is involved
+ https://bugs.webkit.org/show_bug.cgi?id=94923
+
+ Reviewed by Vsevolod Vlasov.
+
+ * inspector/elements/elements-panel-styles-expected.txt:
+ * inspector/elements/resources/elements-panel-styles.css:
+ (.foo, .foo::before):
+
2012-08-27 Yoshifumi Inoue <[email protected]>
[Tests] Using ref image instead ref HTML for fast/forms/time-multiple-fields/time-multiple-fields-appearance-{basic,pseudo-element}.html
Modified: trunk/LayoutTests/inspector/elements/elements-panel-styles-expected.txt (126736 => 126737)
--- trunk/LayoutTests/inspector/elements/elements-panel-styles-expected.txt 2012-08-27 09:26:15 UTC (rev 126736)
+++ trunk/LayoutTests/inspector/elements/elements-panel-styles-expected.txt 2012-08-27 09:36:11 UTC (rev 126737)
@@ -1,5 +1,6 @@
Tests that elements panel shows proper styles in the sidebar panel.
+Foo
[expanded]
-webkit-font-smoothing: subpixel-antialiased;
element.style - subpixel-antialiased
@@ -14,8 +15,9 @@
color: blue;
.foo, .foo::before - blue elements-panel-styles.css:22
/-- overloaded --/ .foo - black elements-panel-styles.css:14
-display: none;
- element.style - none
+display: block;
+ /-- overloaded --/ element.style - none
+ .foo, .foo::before - block !important elements-panel-styles.css:22
/-- overloaded --/ div - block user agent stylesheet
font-family: serif;
#container - serif elements-panel-styles.css:5
@@ -38,7 +40,7 @@
[expanded]
element.style { ()
-display: none;
+/-- overloaded --/ display: none;
-webkit-font-smoothing: subpixel-antialiased;
======== Matched CSS Rules ========
@@ -47,12 +49,13 @@
font-style: italic !important;
[expanded]
-.foo { (elements-panel-styles.css:40)
+.foo { (elements-panel-styles.css:41)
[expanded]
.foo, .foo::before { (elements-panel-styles.css:22)
content: "[before Foo]";
color: blue;
+display: block !important;
[expanded]
.foo { (elements-panel-styles.css:14)
@@ -92,26 +95,27 @@
======== Pseudo ::before element ========
[expanded]
-.foo::before { (elements-panel-styles.css:44)
+.foo::before { (elements-panel-styles.css:45)
[expanded]
-.foo::before { (elements-panel-styles.css:27)
+.foo::before { (elements-panel-styles.css:28)
color: red;
[expanded]
.foo, .foo::before { (elements-panel-styles.css:22)
content: "[before Foo]";
/-- overloaded --/ color: blue;
+display: block !important;
======== Pseudo ::after element ========
[expanded]
-.foo::after { (elements-panel-styles.css:35)
+.foo::after { (elements-panel-styles.css:36)
font-family: courier;
content: "[after Foo 2]";
[expanded]
-.foo::after { (elements-panel-styles.css:31)
+.foo::after { (elements-panel-styles.css:32)
/-- overloaded --/ content: "[after Foo]";
color: green;
Modified: trunk/LayoutTests/inspector/elements/resources/elements-panel-styles.css (126736 => 126737)
--- trunk/LayoutTests/inspector/elements/resources/elements-panel-styles.css 2012-08-27 09:26:15 UTC (rev 126736)
+++ trunk/LayoutTests/inspector/elements/resources/elements-panel-styles.css 2012-08-27 09:36:11 UTC (rev 126737)
@@ -22,6 +22,7 @@
.foo, .foo::before {
content: "[before Foo]";
color: blue;
+ display: block !important;
}
.foo::before {
Modified: trunk/Source/WebCore/ChangeLog (126736 => 126737)
--- trunk/Source/WebCore/ChangeLog 2012-08-27 09:26:15 UTC (rev 126736)
+++ trunk/Source/WebCore/ChangeLog 2012-08-27 09:36:11 UTC (rev 126737)
@@ -1,3 +1,16 @@
+2012-08-24 Alexander Pavlov <[email protected]>
+
+ Web Inspector: Incorrect property override computation when !important is involved
+ https://bugs.webkit.org/show_bug.cgi?id=94923
+
+ Reviewed by Vsevolod Vlasov.
+
+ The cascade of !important properties was totally wrong if a property was listed as !important first and as non-!important later on.
+
+ * inspector/front-end/StylesSidebarPane.js:
+ (WebInspector.StylesSidebarPane.prototype._refreshStyleRules):
+ (WebInspector.StylesSidebarPane.prototype._markUsedProperties):
+
2012-08-27 Mikhail Pozdnyakov <[email protected]>
Rename RegisterProtocolHandler API to NavigatorContentUtils
Modified: trunk/Source/WebCore/inspector/front-end/StylesSidebarPane.js (126736 => 126737)
--- trunk/Source/WebCore/inspector/front-end/StylesSidebarPane.js 2012-08-27 09:26:15 UTC (rev 126736)
+++ trunk/Source/WebCore/inspector/front-end/StylesSidebarPane.js 2012-08-27 09:36:11 UTC (rev 126737)
@@ -412,7 +412,7 @@
continue;
if (section.computedStyle)
section.styleRule.style = nodeComputedStyle;
- var styleRule = { section: section, style: section.styleRule.style, computedStyle: section.computedStyle, rule: section.rule, editable: !!(section.styleRule.style && section.styleRule.style.id) };
+ var styleRule = { section: section, style: section.styleRule.style, computedStyle: section.computedStyle, rule: section.rule, editable: !!(section.styleRule.style && section.styleRule.style.id), isAttribute: section.styleRule.isAttribute };
styleRules.push(styleRule);
}
return styleRules;
@@ -506,9 +506,8 @@
_markUsedProperties: function(styleRules, usedProperties)
{
- var priorityUsed = false;
-
- // Walk the style rules and make a list of all used and overloaded properties.
+ var foundImportantProperties = {};
+ var propertyToEffectiveRule = {};
for (var i = 0; i < styleRules.length; ++i) {
var styleRule = styleRules[i];
if (styleRule.computedStyle || styleRule.isStyleSeparator)
@@ -526,47 +525,22 @@
continue;
var canonicalName = WebInspector.StylesSidebarPane.canonicalPropertyName(property.name);
- if (!priorityUsed && property.priority.length)
- priorityUsed = true;
+ if (foundImportantProperties.hasOwnProperty(canonicalName))
+ continue;
- // If the property name is already used by another rule then this rule's
- // property is overloaded, so don't add it to the rule's usedProperties.
- if (!(canonicalName in usedProperties))
- styleRule.usedProperties[canonicalName] = true;
- }
-
- // Add all the properties found in this style to the used properties list.
- // Do this here so only future rules are affect by properties used in this rule.
- for (var canonicalName in styleRules[i].usedProperties)
- usedProperties[canonicalName] = true;
- }
-
- if (priorityUsed) {
- // Walk the properties again and account for !important.
- var foundPriorityProperties = {};
-
- // Walk in direct order to detect the active/most specific rule providing a priority
- // (in this case all subsequent !important values get canceled.)
- for (var i = 0; i < styleRules.length; ++i) {
- if (styleRules[i].computedStyle || styleRules[i].isStyleSeparator)
+ var isImportant = property.priority.length;
+ if (!isImportant && usedProperties.hasOwnProperty(canonicalName))
continue;
- var style = styleRules[i].style;
- var allProperties = style.allProperties;
- for (var j = 0; j < allProperties.length; ++j) {
- var property = allProperties[j];
- if (!property.isLive)
- continue;
- var canonicalName = WebInspector.StylesSidebarPane.canonicalPropertyName(property.name);
- if (property.priority.length) {
- if (!(canonicalName in foundPriorityProperties))
- styleRules[i].usedProperties[canonicalName] = true;
- else
- delete styleRules[i].usedProperties[canonicalName];
- foundPriorityProperties[canonicalName] = true;
- } else if (canonicalName in foundPriorityProperties)
- delete styleRules[i].usedProperties[canonicalName];
+ if (isImportant) {
+ foundImportantProperties[canonicalName] = true;
+ if (propertyToEffectiveRule.hasOwnProperty(canonicalName))
+ delete propertyToEffectiveRule[canonicalName].usedProperties[canonicalName];
}
+
+ styleRule.usedProperties[canonicalName] = true;
+ usedProperties[canonicalName] = true;
+ propertyToEffectiveRule[canonicalName] = styleRule;
}
}
},