Web Inspector: CSS Pretty Printing fails to put space between rgb(...) and numbers...
authorjoepeck@webkit.org <joepeck@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 9 Oct 2014 00:08:45 +0000 (00:08 +0000)
committerjoepeck@webkit.org <joepeck@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 9 Oct 2014 00:08:45 +0000 (00:08 +0000)
https://bugs.webkit.org/show_bug.cgi?id=137414

Reviewed by Timothy Hatcher.

Add whitespace between rgb(...) and a number, possible in gradient
syntax like "linear-gradient(rgb(...)0%,rgb(...)100%)".

* Tools/PrettyPrinting/CodeMirrorFormatters.js:
* Tools/PrettyPrinting/css-tests/gradient-expected.css: Added.
(.dot-nav:nth-child(1n) li a.active):
* Tools/PrettyPrinting/css-tests/gradient.css: Added.
(.dot-nav:nth-child(1n) li a.active):
* Tools/PrettyPrinting/index.html:
* UserInterface/Views/CodeMirrorFormatters.js:

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@174483 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/Tools/PrettyPrinting/CodeMirrorFormatters.js
Source/WebInspectorUI/Tools/PrettyPrinting/css-tests/gradient-expected.css [new file with mode: 0644]
Source/WebInspectorUI/Tools/PrettyPrinting/css-tests/gradient.css [new file with mode: 0644]
Source/WebInspectorUI/Tools/PrettyPrinting/index.html
Source/WebInspectorUI/UserInterface/Views/CodeMirrorFormatters.js

index 560d9d8f481440a4b50e9d191c4ac2029e60f79a..b583f74642290069f40de2f658ea1f7fb1ba31d0 100644 (file)
@@ -1,3 +1,21 @@
+2014-10-08  Joseph Pecoraro  <pecoraro@apple.com>
+
+        Web Inspector: CSS Pretty Printing fails to put space between rgb(...) and numbers in minified gradients
+        https://bugs.webkit.org/show_bug.cgi?id=137414
+
+        Reviewed by Timothy Hatcher.
+
+        Add whitespace between rgb(...) and a number, possible in gradient
+        syntax like "linear-gradient(rgb(...)0%,rgb(...)100%)".
+
+        * Tools/PrettyPrinting/CodeMirrorFormatters.js:
+        * Tools/PrettyPrinting/css-tests/gradient-expected.css: Added.
+        (.dot-nav:nth-child(1n) li a.active):
+        * Tools/PrettyPrinting/css-tests/gradient.css: Added.
+        (.dot-nav:nth-child(1n) li a.active):
+        * Tools/PrettyPrinting/index.html:
+        * UserInterface/Views/CodeMirrorFormatters.js:
+
 2014-10-08  Joseph Pecoraro  <pecoraro@apple.com>
 
         Web Inspector: CSS Pretty Printing fails to wrap long lines of selectors with pseudo classes/elements
 2014-10-08  Joseph Pecoraro  <pecoraro@apple.com>
 
         Web Inspector: CSS Pretty Printing fails to wrap long lines of selectors with pseudo classes/elements
index f985001268170871b1acea5bccc82bf974152b86..1c28b936b9a27daaae6639693a46bdc8fa5406a9 100644 (file)
@@ -322,8 +322,11 @@ CodeMirror.extendMode("css", {
                 return true;
             if (lastContent === ":") // Space in "prop: value" but not in a selectors "a:link" or "div::after" or media queries "(max-device-width:480px)".
                 return state.state === "prop";
                 return true;
             if (lastContent === ":") // Space in "prop: value" but not in a selectors "a:link" or "div::after" or media queries "(max-device-width:480px)".
                 return state.state === "prop";
-            if (lastContent === ")" && (content !== ")" && content !== ",")) // Space in "not(foo)and" but not at the end of "not(not(foo))"
-                return state.state === "media" || state.state === "media_parens";
+            if (lastContent === ")" && (content !== ")" && content !== ",")) {
+                if (token === "number") // linear-gradient(rgb(...)0%,rgb(...)100%)
+                    return true;
+                return state.state === "media" || state.state === "media_parens"; // Space in "not(foo)and" but not at the end of "not(not(foo))" 
+            }
             return ">+~-*/".indexOf(lastContent) >= 0; // calc() expression or child/sibling selectors
         }
 
             return ">+~-*/".indexOf(lastContent) >= 0; // calc() expression or child/sibling selectors
         }
 
diff --git a/Source/WebInspectorUI/Tools/PrettyPrinting/css-tests/gradient-expected.css b/Source/WebInspectorUI/Tools/PrettyPrinting/css-tests/gradient-expected.css
new file mode 100644 (file)
index 0000000..7335817
--- /dev/null
@@ -0,0 +1,9 @@
+.dot-nav:nth-child(1n) li a.active {
+    top: 0;
+    background: #08c;
+    background: -webkit-gradient(linear, lefttop, leftbottom, color-stop(0%, rgb(126, 198, 234)), color-stop(24%, rgb(70, 179, 234)), color-stop(100%, rgb(3, 135, 201)));
+    background: -webkit-linear-gradient(top, rgb(126, 198, 234) 0%, rgb(70, 179, 234) 45%, rgb(3, 135, 201) 100%);
+    background: -moz-linear-gradient(top, rgb(126, 198, 234) 0%, rgb(70, 179, 234) 45%, rgb(3, 135, 201) 100%);
+    background: linear-gradient(top, rgb(126, 198, 234) 0%, rgb(70, 179, 234) 45%, rgb(3, 135, 201) 100%);
+}
+
diff --git a/Source/WebInspectorUI/Tools/PrettyPrinting/css-tests/gradient.css b/Source/WebInspectorUI/Tools/PrettyPrinting/css-tests/gradient.css
new file mode 100644 (file)
index 0000000..f3562ad
--- /dev/null
@@ -0,0 +1,7 @@
+.dot-nav:nth-child(1n) li a.active {
+    top:0;background:#08c;
+       background:-webkit-gradient(linear,lefttop,leftbottom,color-stop(0%,rgb(126,198,234)),color-stop(24%,rgb(70,179,234)),color-stop(100%,rgb(3,135,201)));
+       background:-webkit-linear-gradient(top,rgb(126,198,234)0%,rgb(70,179,234)45%,rgb(3,135,201)100%);
+       background:   -moz-linear-gradient(top,rgb(126,198,234)0%,rgb(70,179,234)45%,rgb(3,135,201)100%);
+       background:        linear-gradient(top,rgb(126,198,234)0%,rgb(70,179,234)45%,rgb(3,135,201)100%);
+}
index 9285b76b15dac5ec49af2e1c80b79ba017b5a2e0..a09ba7b7d57e8ea7e85bfcbeb41a1e6deda95e3d 100644 (file)
         _runTests(callback, [
             "css-tests/basic.css",
             "css-tests/calc.css",
         _runTests(callback, [
             "css-tests/basic.css",
             "css-tests/calc.css",
+            "css-tests/gradient.css",
             "css-tests/media-query.css",
             "css-tests/selectors.css",
             "css-tests/wrapping.css",
             "css-tests/media-query.css",
             "css-tests/selectors.css",
             "css-tests/wrapping.css",
index f985001268170871b1acea5bccc82bf974152b86..1c28b936b9a27daaae6639693a46bdc8fa5406a9 100644 (file)
@@ -322,8 +322,11 @@ CodeMirror.extendMode("css", {
                 return true;
             if (lastContent === ":") // Space in "prop: value" but not in a selectors "a:link" or "div::after" or media queries "(max-device-width:480px)".
                 return state.state === "prop";
                 return true;
             if (lastContent === ":") // Space in "prop: value" but not in a selectors "a:link" or "div::after" or media queries "(max-device-width:480px)".
                 return state.state === "prop";
-            if (lastContent === ")" && (content !== ")" && content !== ",")) // Space in "not(foo)and" but not at the end of "not(not(foo))"
-                return state.state === "media" || state.state === "media_parens";
+            if (lastContent === ")" && (content !== ")" && content !== ",")) {
+                if (token === "number") // linear-gradient(rgb(...)0%,rgb(...)100%)
+                    return true;
+                return state.state === "media" || state.state === "media_parens"; // Space in "not(foo)and" but not at the end of "not(not(foo))" 
+            }
             return ">+~-*/".indexOf(lastContent) >= 0; // calc() expression or child/sibling selectors
         }
 
             return ">+~-*/".indexOf(lastContent) >= 0; // calc() expression or child/sibling selectors
         }