Diff
Modified: trunk/LayoutTests/ChangeLog (249088 => 249089)
--- trunk/LayoutTests/ChangeLog 2019-08-24 17:35:25 UTC (rev 249088)
+++ trunk/LayoutTests/ChangeLog 2019-08-24 18:21:04 UTC (rev 249089)
@@ -1,3 +1,13 @@
+2019-08-24 Devin Rousso <[email protected]>
+
+ Web Inspector: "Copy Rule" menu item does not propagate comments properly
+ https://bugs.webkit.org/show_bug.cgi?id=201095
+
+ Reviewed by Joseph Pecoraro.
+
+ * inspector/css/generateCSSRuleString.html:
+ * inspector/css/generateCSSRuleString-expected.txt:
+
2019-08-23 Devin Rousso <[email protected]>
Web Inspector: create additional command line api functions for other console methods
Modified: trunk/LayoutTests/inspector/css/generateCSSRuleString-expected.txt (249088 => 249089)
--- trunk/LayoutTests/inspector/css/generateCSSRuleString-expected.txt 2019-08-24 17:35:25 UTC (rev 249088)
+++ trunk/LayoutTests/inspector/css/generateCSSRuleString-expected.txt 2019-08-24 18:21:04 UTC (rev 249089)
@@ -4,38 +4,84 @@
== Running test suite: CSS.generateCSSRuleString
-- Running test case: CSS.generateCSSRuleString.InlineStyle
#test-node {
- a-b: 1;
- c-d: 2;
+ a: 1;
+ b: 2;
+ c: 3;
}
+-- Running test case: CSS.generateCSSRuleString.InlineStyle.WithCommentedProperty
+#test-node {
+ a: 1;
+ /* b: 2; */
+ c: 3;
+}
+
-- Running test case: CSS.generateCSSRuleString.MatchedRules
@media only screen and (min-width: 0px) {
@media only screen and (min-height: 0px) {
body > div#test-node {
- a-b: 1;
- c-d: 2;
+ a: 1;
+ b: 2;
+ c: 3;
}
}
}
@media only screen and (min-width: 0px) {
body > #test-node {
- a-b: 1;
- c-d: 2;
+ a: 1;
+ b: 2;
+ c: 3;
}
}
body > div {
- a-b: 1;
- c-d: 2;
+ a: 1;
+ b: 2;
+ c: 3;
}
body > * {
- a-b: 1;
- c-d: 2;
+ a: 1;
+ b: 2;
+ c: 3;
}
* {
- a-b: 1;
- c-d: 2;
+ a: 1;
+ b: 2;
+ c: 3;
}
address, article, aside, div, footer, header, hgroup, layer, main, nav, section {
display: block;
}
+-- Running test case: CSS.generateCSSRuleString.MatchedRules.WithCommentedProperties
+@media only screen and (min-width: 0px) {
+ @media only screen and (min-height: 0px) {
+ body > div#test-node {
+ a: 1;
+ /* b: 2; */
+ c: 3;
+ }
+ }
+}
+@media only screen and (min-width: 0px) {
+ body > #test-node {
+ a: 1;
+ /* b: 2; */
+ c: 3;
+ }
+}
+body > div {
+ a: 1;
+ /* b: 2; */
+ c: 3;
+}
+body > * {
+ a: 1;
+ /* b: 2; */
+ c: 3;
+}
+* {
+ a: 1;
+ /* b: 2; */
+ c: 3;
+}
+
Modified: trunk/LayoutTests/inspector/css/generateCSSRuleString.html (249088 => 249089)
--- trunk/LayoutTests/inspector/css/generateCSSRuleString.html 2019-08-24 17:35:25 UTC (rev 249088)
+++ trunk/LayoutTests/inspector/css/generateCSSRuleString.html 2019-08-24 18:21:04 UTC (rev 249089)
@@ -2,11 +2,11 @@
<html>
<head>
<style>
-*{a-b:1;c-d:2}
-body>*{a-b:1;c-d:2}
-@media all {body>div{a-b:1;c-d:2}}
-@media only screen and (min-width:0px) {body>#test-node{a-b:1;c-d:2}}
-@media only screen and (min-width:0px) {@media only screen and (min-height:0px) {body>div#test-node{a-b:1;c-d:2}}}
+*{a:1;b:2;c:3}
+body>*{a:1;b:2;c:3}
+@media all {body>div{a:1;b:2;c:3}}
+@media only screen and (min-width:0px) {body>#test-node{a:1;b:2;c:3}}
+@media only screen and (min-width:0px) {@media only screen and (min-height:0px) {body>div#test-node{a:1;b:2;c:3}}}
</style>
<script src=""
<script>
@@ -24,6 +24,15 @@
});
suite.addTestCase({
+ name: "CSS.generateCSSRuleString.InlineStyle.WithCommentedProperty",
+ description: "Check the formatting of the generated inline style string if a property is commented out.",
+ test() {
+ nodeStyles.inlineStyle.properties[1].commentOut(true);
+ InspectorTest.log(nodeStyles.inlineStyle.generateCSSRuleString());
+ },
+ });
+
+ suite.addTestCase({
name: "CSS.generateCSSRuleString.MatchedRules",
description: "Check the formatting of the generated string for all matched CSS rules.",
test() {
@@ -32,6 +41,20 @@
}
});
+ suite.addTestCase({
+ name: "CSS.generateCSSRuleString.MatchedRules.WithCommentedProperties",
+ description: "Check the formatting of the generated string for all matched CSS rules if a property is commented out in each.",
+ test() {
+ for (let rule of nodeStyles.matchedRules) {
+ if (!rule.style.editable)
+ continue;
+
+ rule.style.properties[1].commentOut(true);
+ InspectorTest.log(rule.style.generateCSSRuleString());
+ }
+ }
+ });
+
WI.domManager.requestDocument((documentNode) => {
WI.domManager.querySelector(documentNode.id, "#test-node", async (contentNodeId) => {
if (!contentNodeId) {
@@ -53,6 +76,6 @@
</head>
<body _onload_="runTest()">
<p>Testing that generated CSS rule strings have proper formatting.</p>
- <div id="test-node" style="a-b:1;c-d:2"></div>
+ <div id="test-node" style="a:1;b:2;c:3"></div>
</body>
</html>
Modified: trunk/Source/WebInspectorUI/ChangeLog (249088 => 249089)
--- trunk/Source/WebInspectorUI/ChangeLog 2019-08-24 17:35:25 UTC (rev 249088)
+++ trunk/Source/WebInspectorUI/ChangeLog 2019-08-24 18:21:04 UTC (rev 249089)
@@ -1,3 +1,15 @@
+2019-08-24 Devin Rousso <[email protected]>
+
+ Web Inspector: "Copy Rule" menu item does not propagate comments properly
+ https://bugs.webkit.org/show_bug.cgi?id=201095
+
+ Reviewed by Joseph Pecoraro.
+
+ * UserInterface/Models/CSSProperty.js:
+ (WI.CSSProperty.prototype.commentOut):
+ (WI.CSSProperty.prototype.get formattedText):
+ Wrap the `text` in `/* ${text} */` if the `WI.CSSProperty` isn't `enabled` (e.g. commented out).
+
2019-08-23 Devin Rousso <[email protected]>
Web Inspector: create additional command line api functions for other console methods
Modified: trunk/Source/WebInspectorUI/UserInterface/Models/CSSProperty.js (249088 => 249089)
--- trunk/Source/WebInspectorUI/UserInterface/Models/CSSProperty.js 2019-08-24 17:35:25 UTC (rev 249088)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/CSSProperty.js 2019-08-24 18:21:04 UTC (rev 249089)
@@ -149,6 +149,7 @@
commentOut(disabled)
{
+ console.assert(this.editable);
if (this._enabled === !disabled)
return;
@@ -181,7 +182,10 @@
if (!this._name)
return "";
- return `${this._name}: ${this._rawValue};`;
+ let text = `${this._name}: ${this._rawValue};`;
+ if (!this._enabled)
+ text = "/* " + text + " */";
+ return text;
}
get modified()
