Merge pull request #39 from webschik/webschik.38

#38

Author: webschik

.eslintrc

@@ -3,25 +3,71 @@
     "ecmaVersion": 6,
     "sourceType": "module"
   },
-
-  "extends": ["strict", "strict/es6", "strict/mocha"],
-
+  "extends": [
+    "strict",
+    "strict/es6",
+    "strict/mocha"
+  ],
   "rules": {
     // JUSTIFICATION: code cleanliness
     // separation of variable declarations and logic makes source code more readable
-    "newline-after-var": [2, "always"],
-    "semi": [2, "always"],
-    "space-before-function-paren": [2, "always"],
-    "comma-dangle": [2, "never"],
-    "array-bracket-spacing": [2, "never"],
-    "object-curly-spacing": [2, "never"],
-    "no-trailing-spaces": [2, { "skipBlankLines": true }],
-    
-    //let JSCS to validate indentations
-    "indent": [0],
-    "eol-last": [0],
-    "no-extra-semi": 0,
-    "semi-spacing": [2, {"before": false, "after": true}],
-    "quotes": [2, "single", "avoid-escape"]
+    "newline-after-var": [
+      "error",
+      "always"
+    ],
+    "semi": [
+      "error",
+      "always"
+    ],
+    "space-before-function-paren": [
+      "error",
+      "always"
+    ],
+    "comma-dangle": [
+      "error",
+      "never"
+    ],
+    "array-bracket-spacing": [
+      "error",
+      "never"
+    ],
+    "object-curly-spacing": [
+      "error",
+      "never"
+    ],
+    "no-trailing-spaces": [
+      "error",
+      {
+        "skipBlankLines": true
+      }
+    ],
+    "indent": [
+      "error",
+      4,
+      {
+        "SwitchCase": 1
+      }
+    ],
+    "eol-last": [
+      "off"
+    ],
+    "no-extra-semi": [
+      "off"
+    ],
+    "no-return-assign": [
+      "off"
+    ],
+    "semi-spacing": [
+      "error",
+      {
+        "before": false,
+        "after": true
+      }
+    ],
+    "quotes": [
+      "error",
+      "single",
+      "avoid-escape"
+    ]
   }
 }

.jscsrc

@@ -57,19 +57,7 @@ This module also enables parsing of single-line comments in CSS source code.
 
 Note that you don't need a special stringifier to handle the output; the default
 one will automatically convert single line comments into block comments. 
-If you need to get inline comments, use stringifier from `postcss-less` module:
-
-````js
-import postCssLess from 'postcss-less';
-
-const root = postCssLess.parse('// Hello world');
-
-root.first.toString(); // returns '/* Hello world */'
-
-root.first.toString({
-    stringify: postCssLess.stringify
-}); // returns '// Hello world'
-````
+If you need to get inline comments, use [custom PostCSSLess stringifier](#stringifier)
 
 ### Rule node
 [PostCSS Rule Node](https://github.com/postcss/postcss/blob/master/docs/api.md#rule-node)
@@ -161,6 +149,39 @@ const root = postCssLess.parse('// Hello world');
 root.first.raws.content // => '// Hello world'
 ````
 
+### Stringifier
+
+If you need to have LESS code without PostCSS transformation, you have to specify a custom stringifier:
+
+````js
+import postcss from 'postcss';
+import postcssLess from 'postcss-less';
+import stringify from 'postcss-less/less-stringify';
+
+const lessCode = `
+    // Non-css comment
+    
+    .container {
+        .mixin-1();
+        .mixin-2;
+        .mixin-3 (@width: 100px) {
+            width: @width;
+        }
+    }
+    
+    .rotation(@deg:5deg){
+      .transform(rotate(@deg));
+    }
+`;
+
+postcss().process(less, {
+    syntax: postcssLess,
+    stringifier: stringify
+}).then((result) => {
+    console.log(result.content); // this will be value of `lessCode` without changing of comment nodes and mixins
+});         
+````
+
 ## Contribution
 Please, check our guidelines: [CONTRIBUTING.md](./CONTRIBUTING.md)
 

README.md

@@ -7,7 +7,6 @@ import babel from 'gulp-babel';
 import clean from 'gulp-rimraf';
 import eslint from 'gulp-eslint';
 import gulp from 'gulp';
-import jscs from 'gulp-jscs';
 import mocha from 'gulp-mocha';
 import path from 'path';
 import postcss from 'postcss';
@@ -37,9 +36,6 @@ const config = {
 function lint (srcPath) {
     return gulp
         .src(srcPath)
-        .pipe(jscs())
-        .pipe(jscs.reporter())
-        .pipe(jscs.reporter('failImmediately'))
         .pipe(eslint())
         .pipe(eslint.format())
         .pipe(eslint.failAfterError());

gulpfile.babel.js

@@ -85,6 +85,9 @@ export default class LessParser extends Parser {
         delete this.current.nodes;
         this.current.extendRule = this.current.selector.indexOf('&:extend') >= 0;
         this.current.important = this.current.selector.indexOf('!important') >= 0;
+
+        this.pos--;
+        
         this.end(this.tokens[this.pos]);
     }
 

lib/less-parser.js

@@ -11,4 +11,31 @@ export default class LessStringifier extends Stringifier {
             this.builder(`/*${ left }${ node.text }${ right }*/`, node);
         }
     }
-}
+
+    block (node, start) {
+        const {ruleWithoutBody} = node;
+        const between = this.raw(node, 'between', 'beforeOpen');
+        let after = '';
+        
+        if (ruleWithoutBody) {
+            this.builder(start + between, node, 'start');
+        } else {
+            this.builder(`${ start + between }{`, node, 'start');
+        }
+        
+        if (node.nodes && node.nodes.length) {
+            this.body(node);
+            after = this.raw(node, 'after');
+        } else {
+            after = this.raw(node, 'after', 'emptyBody');
+        }
+
+        if (after) {
+            this.builder(after);
+        }
+        
+        if (!ruleWithoutBody) {
+            this.builder('}', node, 'end');
+        }
+    }
+}

lib/less-stringifier.js

@@ -1,6 +1,6 @@
 {
   "name": "postcss-less",
-  "version": "0.10.0",
+  "version": "0.11.0",
   "description": "LESS parser for PostCSS",
   "keywords": [
     "css",
@@ -9,6 +9,10 @@
     "parser",
     "less"
   ],
+  "main": "dist/less-syntax.js",
+  "files": [
+    "dist/*.js"
+  ],
   "author": "Denys Kniazevych <webschik@gmail.com>",
   "contributors": [
     "Andrew Powell <andrew@shellscape.org>",
@@ -37,13 +41,11 @@
     "babel-preset-es2015": "^6.6.0",
     "babel-register": "^6.7.2",
     "chai": "^3.5.0",
-    "eslint": "^2.5.1",
     "eslint-config-strict": "^8.5.0",
     "eslint-plugin-filenames": "^0.2.0",
     "gulp": "^3.9.1",
     "gulp-babel": "^6.1.2",
     "gulp-eslint": "^2.0.0",
-    "gulp-jscs": "^3.0.2",
     "gulp-json-editor": "2.2.1",
     "gulp-mocha": "^2.2.0",
     "gulp-rename": "^1.2.2",

package.json

@@ -3,8 +3,10 @@
 
 import cases from 'postcss-parser-tests';
 import {expect} from 'chai';
-import parse from '../lib/less-parse';
-import stringify from '../lib/less-stringify';
+import parse from './../lib/less-parse';
+import postcss from 'postcss';
+import postcssLess from 'postcss-less';
+import stringify from 'postcss-less/less-stringify';
 
 describe('#stringify()', () => {
     describe('CSS for PostCSS', () => {
@@ -49,17 +51,73 @@ describe('#stringify()', () => {
             expect(result).to.eql('// comment ');
         });
     });
-    
+
+    describe('Extend', () => {
+        it('stringifies mixin without body. #1', (done) => {
+            const less = '.selector:extend(.f, .g)  {&:extend(.a);}';
+
+            postcss().process(less, {
+                syntax: postcssLess,
+                stringifier: stringify
+            }).then((result) => {
+                expect(result.content).to.eql(less);
+                done();
+            }).catch((error) => {
+                done(error);
+            });
+        });
+    });
+
     describe('Mixins', () => {
         it('stringifies mixins', () => {
             const root = parse('.foo (@bar; @baz...) { border: @{baz}; }');
             let result = '';
-            
+
             stringify(root, (i) => {
                 result += i;
             });
 
             expect(result).to.eql('.foo (@bar; @baz...) { border: @{baz}; }');
         });
+
+        it('stringifies mixin without body. #1', (done) => {
+            const less = '.mix() {color: red} .selector {.mix()}';
+
+            postcss().process(less, {
+                syntax: postcssLess,
+                stringifier: stringify
+            }).then((result) => {
+                expect(result.content).to.eql(less);
+                done();
+            }).catch((error) => {
+                done(error);
+            });
+        });
+
+        it('stringifies mixin without body. #2', (done) => {
+            const less = `
+                .container {
+                    .mixin-1();
+                    .mixin-2;
+                    .mixin-3 (@width: 100px) {
+                        width: @width;
+                    }
+                }
+                
+                .rotation(@deg:5deg){
+                  .transform(rotate(@deg));
+                }
+            `;
+
+            postcss().process(less, {
+                syntax: postcssLess,
+                stringifier: stringify
+            }).then((result) => {
+                expect(result.content).to.eql(less);
+                done();
+            }).catch((error) => {
+                done(error);
+            });
+        });
     });
 });