New options: Spaces before and after selector delimiters

config/csscomb.json

@@ -15,9 +15,11 @@
     "space-after-colon": " ",
     "space-after-combinator": " ",
     "space-after-opening-brace": "\n",
+    "space-after-selector-delimiter": "\n",
     "space-before-colon": "",
     "space-before-combinator": " ",
     "space-before-opening-brace": "\n",
+    "space-before-selector-delimiter": "",
     "strip-spaces": true,
     "unitless-zero": true,
     "vendor-prefix-align": true,

doc/options.md

@@ -427,6 +427,44 @@ a{
 color: panda;}
 ```
 
+## space-after-selector-delimiter
+
+Set space after selector delimiter.
+
+Acceptable values:
+
+* `{Number}` — number of whitespaces;
+* `{String}` — string with whitespaces, tabs or line breaks.
+
+Example: `{ 'space-after-selector-delimiter': 1 }`
+
+```scss
+// Before:
+a,b{
+    color: panda;
+    }
+
+// After:
+a, b {
+    color: panda;
+    }
+```
+
+Example: `{ 'space-before-selector-delimiter': '\n' }`
+
+```scss
+// Before:
+a, b{
+    color: panda;
+    }
+
+// After:
+a,
+b{
+    color: panda;
+    }
+```
+
 ## space-before-colon
 
 Set space before `:` in declarations.
@@ -536,6 +574,44 @@ a
     }
 ```
 
+## space-before-selector-delimiter
+
+Set space before selector delimiter.
+
+Acceptable values:
+
+* `{Number}` — number of whitespaces;
+* `{String}` — string with whitespaces, tabs or line breaks.
+
+Example: `{ 'space-before-selector-delimiter': 0 }`
+
+```scss
+// Before:
+a , b{
+    color: panda;
+    }
+
+// After:
+a, b {
+    color: panda;
+    }
+```
+
+Example: `{ 'space-before-selector-delimiter': '\n' }`
+
+```scss
+// Before:
+a, b{
+    color: panda;
+    }
+
+// After:
+a
+,b{
+    color: panda;
+    }
+```
+
 ## strip-spaces
 
 Whether to trim trailing spaces.

lib/csscomb.js

@@ -21,6 +21,8 @@ var OPTIONS = [
     'space-after-colon',
     'space-before-opening-brace',
     'space-after-opening-brace',
+    'space-before-selector-delimiter',
+    'space-after-selector-delimiter',
     'sort-order',
     'block-indent',
     'tab-size',

lib/options/space-after-selector-delimiter.js

@@ -0,0 +1,54 @@
+module.exports = {
+    name: 'space-after-selector-delimiter',
+
+    accepts: {
+        number: true,
+        string: /^[ \t\n]*$/
+    },
+
+    /**
+     * Processes tree node.
+     *
+     * @param {String} nodeType
+     * @param {node} node
+     */
+    process: function(nodeType, node) {
+        if (nodeType !== 'selector') return;
+
+        var value = this.getValue('space-after-selector-delimiter');
+
+        for (var i = node.length; i--;) {
+            if (node[i][0] === 'delim') {
+                if (node[i + 1][1][0] === 's') {
+                    node[i + 1][1][1] = value;
+                } else {
+                    node[i + 1].splice(1, 0, ['s', value]);
+                }
+            }
+        }
+    },
+
+    /**
+     * Detects the value of an option at the tree node.
+     *
+     * @param {String} nodeType
+     * @param {node} node
+     */
+    detect: function(nodeType, node) {
+        if (nodeType !== 'selector') return;
+
+        var variants = [];
+
+        for (var i = node.length; i--;) {
+            if (node[i][0] !== 'delim') continue;
+
+            if (node[i + 1][1][0] === 's') {
+                variants.push(node[i + 1][1][1]);
+            } else {
+                variants.push('');
+            }
+        }
+
+        return variants;
+    }
+};

lib/options/space-before-selector-delimiter.js

@@ -0,0 +1,54 @@
+module.exports = {
+    name: 'space-before-selector-delimiter',
+
+    accepts: {
+        number: true,
+        string: /^[ \t\n]*$/
+    },
+
+    /**
+     * Processes tree node.
+     *
+     * @param {String} nodeType
+     * @param {node} node
+     */
+    process: function(nodeType, node) {
+        if (nodeType !== 'selector') return;
+
+        var value = this.getValue('space-before-selector-delimiter');
+
+        for (var i = node.length; i--;) {
+            if (node[i][0] === 'delim') {
+                if (node[i - 1][node[i - 1].length - 1][0] === 's') {
+                    node[i - 1][node[i - 1].length - 1][1] = value;
+                } else {
+                    node[i - 1].push(['s', value]);
+                }
+            }
+        }
+    },
+
+    /**
+     * Detects the value of an option at the tree node.
+     *
+     * @param {String} nodeType
+     * @param {node} node
+     */
+    detect: function(nodeType, node) {
+        if (nodeType !== 'selector') return;
+
+        var variants = [];
+
+        for (var i = node.length; i--;) {
+            if (node[i][0] !== 'delim') continue;
+
+            if (node[i - 1][node[i - 1].length - 1][0] === 's') {
+                variants.push(node[i - 1][node[i - 1].length - 1][1]);
+            } else {
+                variants.push('');
+            }
+        }
+
+        return variants;
+    }
+};

test/options/space-after-selector-delimiter.js

@@ -0,0 +1,83 @@
+describe('options/space-after-selector-delimiter:', function() {
+    beforeEach(function() {
+        this.filename = __filename;
+    });
+
+    it('Array value => should not change anything', function() {
+        this.comb.configure({ 'space-after-selector-delimiter': ['', ' '] });
+        this.shouldBeEqual('test.css');
+    });
+
+    it('Invalid string value => should not change anything', function() {
+        this.comb.configure({ 'space-after-selector-delimiter': '  nani  ' });
+        this.shouldBeEqual('test.css');
+    });
+
+    it('Float number value => should not change anything', function() {
+        this.comb.configure({ 'space-after-selector-delimiter': 3.5 });
+        this.shouldBeEqual('test.css');
+    });
+
+    it('Integer value => should set proper space after selector delimiter', function() {
+        this.comb.configure({ 'space-after-selector-delimiter': 0 });
+        this.shouldBeEqual('test.css', 'test.expected.css');
+    });
+
+    it('Valid string value (spaces only) => should set proper space after selector delimiter', function() {
+        this.comb.configure({ 'space-after-selector-delimiter': '  ' });
+        this.shouldBeEqual('test.css', 'test-2.expected.css');
+    });
+
+    it('Valid string value (spaces and newlines) => should set proper space after selector delimiter', function() {
+        this.comb.configure({ 'space-after-selector-delimiter': '\n    ' });
+        this.shouldBeEqual('test.css', 'test-3.expected.css');
+    });
+
+    it('Should detect no whitespace', function() {
+        this.shouldDetect(
+            ['space-after-selector-delimiter'],
+            'a,b{top:0}',
+            { 'space-after-selector-delimiter': '' }
+        );
+    });
+
+    it('Should detect whitespace', function() {
+        this.shouldDetect(
+            ['space-after-selector-delimiter'],
+            'a, \n b {top:0}',
+            { 'space-after-selector-delimiter': ' \n ' }
+        );
+    });
+
+    it('Should detect no whitespace (2 blocks)', function() {
+        this.shouldDetect(
+            ['space-after-selector-delimiter'],
+            'a,b{top:0} a, b{left:0}',
+            { 'space-after-selector-delimiter': '' }
+        );
+    });
+
+    it('Should detect whitespace (2 blocks)', function() {
+        this.shouldDetect(
+            ['space-after-selector-delimiter'],
+            'a, b {top:0} b,a{left:0}',
+            { 'space-after-selector-delimiter': ' ' }
+        );
+    });
+
+    it('Should detect no whitespace (3 blocks)', function() {
+        this.shouldDetect(
+            ['space-after-selector-delimiter'],
+            'a, b{top:0} b,c{left:0} c,d{right:0}',
+            { 'space-after-selector-delimiter': '' }
+        );
+    });
+
+    it('Should detect whitespace (3 blocks)', function() {
+        this.shouldDetect(
+            ['space-after-selector-delimiter'],
+            'a,b{top:0} b, c{left:0} c, sd{right:0}',
+            { 'space-after-selector-delimiter': ' ' }
+        );
+    });
+});

test/options/space-after-selector-delimiter/test-2.expected.css

@@ -0,0 +1,5 @@
+a,  b { color: red }
+a,  b { color: red }
+a ,  b { color: red }
+a,  b { color: red }
+a+b,  c>d,  e{ color: red }

test/options/space-after-selector-delimiter/test-3.expected.css

@@ -0,0 +1,11 @@
+a,
+    b { color: red }
+a,
+    b { color: red }
+a ,
+    b { color: red }
+a,
+    b { color: red }
+a+b,
+    c>d,
+    e{ color: red }

test/options/space-after-selector-delimiter/test.css

@@ -0,0 +1,6 @@
+a,b { color: red }
+a, b { color: red }
+a ,b { color: red }
+a,
+b { color: red }
+a+b,c>d,e{ color: red }

test/options/space-after-selector-delimiter/test.expected.css

@@ -0,0 +1,5 @@
+a,b { color: red }
+a,b { color: red }
+a ,b { color: red }
+a,b { color: red }
+a+b,c>d,e{ color: red }