Make @page pseudo-class format correctly

Fixes #661
beautifier · Apr 1, 2015 · d5da0ad · d5da0ad
1 parent d8fe5ac
commit d5da0ad
Show file tree

Hide file tree

Showing 5 changed files with 45 additions and 16 deletions.
diff --git a/js/lib/beautify-css.js b/js/lib/beautify-css.js
@@ -278,20 +278,24 @@
                 output.push(ch);
 
                 // strip trailing space, if present, for hash property checks
-                var variableOrRule = peekString(": ,;{}()[]/='\"").replace(/\s$/, '');
+                var variableOrRule = peekString(": ,;{}()[]/='\"");
+
+                if (variableOrRule.match(/[ :]$/)) {
+                    // we have a variable or pseudo-class, add it and insert one space before continuing
+                    next();
+                    variableOrRule = eatString(": ").replace(/\s$/, '');
+                    output.push(variableOrRule);
+                    print.singleSpace();
+                }
+
+                variableOrRule = variableOrRule.replace(/\s$/, '')
 
                 // might be a nesting at-rule
                 if (variableOrRule in css_beautify.NESTED_AT_RULE) {
                     nestedLevel += 1;
                     if (variableOrRule in css_beautify.CONDITIONAL_GROUP_RULE) {
                         enteringConditionalGroup = true;
                     }
-                } else if (': '.indexOf(variableOrRule[variableOrRule.length - 1]) >= 0) {
-                    //we have a variable, add it and insert one space before continuing
-                    next();
-                    variableOrRule = eatString(": ").replace(/\s$/, '');
-                    output.push(variableOrRule);
-                    print.singleSpace();
                 }
             } else if (ch === '{') {
                 if (peek(true) === '}') {

diff --git a/js/test/beautify-css-tests.js b/js/test/beautify-css-tests.js
@@ -122,6 +122,13 @@ function run_css_tests(test_obj, Urlencoded, js_beautify, html_beautify, css_bea
         t('.tabs  (t, t2)  \n{\n  key: val(p1  ,p2);  \n  }', '.tabs (t, t2) {\n\tkey: val(p1, p2);\n}');
         t('.box-shadow(@shadow: 0 1px 3px rgba(0, 0, 0, .25)) {\n\t-webkit-box-shadow: @shadow;\n\t-moz-box-shadow: @shadow;\n\tbox-shadow: @shadow;\n}');
 
+        // Psuedo-classes vs Variables
+        t('@page :first {}');
+
+        // Assume the colon goes with the @name. If we're in LESS, this is required regardless of the at-string.
+        t('@page:first {}', '@page: first {}');
+        t('@page: first {}');
+
         // 
 
         // test basic css beautifier

diff --git a/python/cssbeautifier/__init__.py b/python/cssbeautifier/__init__.py
@@ -304,23 +304,24 @@ def beautify(self):
 
                 # strip trailing space, if present, for hash property check
                 variableOrRule = self.peekString(": ,;{}()[]/='\"")
-                if variableOrRule[-1].isspace():
-                    variableOrRule = variableOrRule[:-1]
 
-                # might be a nesting at-rule
-                if variableOrRule in self.NESTED_AT_RULE:
-                    printer.nestedLevel += 1
-                    if variableOrRule in self.CONDITIONAL_GROUP_RULE:
-                        enteringConditionalGroup = True
-                elif variableOrRule[-1] in ": ":
-                    # we have a variable, add it and a space after
+                if variableOrRule[-1] in ": ":
+                    # wwe have a variable or pseudo-class, add it and insert one space before continuing
                     self.next()
                     variableOrRule = self.eatString(": ")
                     if variableOrRule[-1].isspace():
                         variableOrRule = variableOrRule[:-1]
                     printer.push(variableOrRule)
                     printer.singleSpace();
 
+                if variableOrRule[-1].isspace():
+                    variableOrRule = variableOrRule[:-1]
+
+                # might be a nesting at-rule
+                if variableOrRule in self.NESTED_AT_RULE:
+                    printer.nestedLevel += 1
+                    if variableOrRule in self.CONDITIONAL_GROUP_RULE:
+                        enteringConditionalGroup = True
 
             elif self.ch == '{':
                 if self.peek(True) == '}':

diff --git a/python/cssbeautifier/tests/test.py b/python/cssbeautifier/tests/test.py
@@ -87,6 +87,13 @@ def testGenerated(self):
         t('.tabs  (t, t2)  \n{\n  key: val(p1  ,p2);  \n  }', '.tabs (t, t2) {\n\tkey: val(p1, p2);\n}')
         t('.box-shadow(@shadow: 0 1px 3px rgba(0, 0, 0, .25)) {\n\t-webkit-box-shadow: @shadow;\n\t-moz-box-shadow: @shadow;\n\tbox-shadow: @shadow;\n}')
 
+        # Psuedo-classes vs Variables
+        t('@page :first {}')
+
+        # Assume the colon goes with the @name. If we're in LESS, this is required regardless of the at-string.
+        t('@page:first {}', '@page: first {}')
+        t('@page: first {}')
+
         # 
 
 

diff --git a/test/data/css.js b/test/data/css.js
@@ -89,6 +89,16 @@ exports.test_data = {
             { input: '.box-shadow(@shadow: 0 1px 3px rgba(0, 0, 0, .25)) {\n\t-webkit-box-shadow: @shadow;\n\t-moz-box-shadow: @shadow;\n\tbox-shadow: @shadow;\n}' }
         ],
     }, {
+        name: "Psuedo-classes vs Variables",
+        description: "",
+        tests: [
+            { unchanged: '@page :first {}' },
+            { comment: "Assume the colon goes with the @name. If we're in LESS, this is required regardless of the at-string.",
+              input: '@page:first {}',
+              output: '@page: first {}' },
+            { unchanged: '@page: first {}' }
+        ],
+    }, {
 
     }]
 }