js2css - npm Package Compare versions

Comparing version 0.1.0 to 0.1.1

lib/js2css.js

@@ -62,4 +62,7 @@ 'use strict';
     var addRule = function (scope, contents) {
-        rules.unshift(joinScope(scope) + ' {\n' +
-            processContents(scope, contents) + '}\n');
+        var content = processContents(scope, contents);
+        if (content) {
+            rules.unshift(joinScope(scope) + ' {\n' +
+                content + '}\n');
+        }
     };
@@ -74,3 +77,3 @@
             }
-            return acc + sep + rule;
+            return (acc ? acc + sep : '') + rule;
         }, '');
@@ -119,5 +122,5 @@ };
 
-css.space = '\t';
+css.space = ' ';
 css.mixins = {};
 
 module.exports = css;

package.json

 {
   "name": "js2css",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "JS CSS Pre-processor",
-  "main": "lib/js3.js",
+  "main": "lib/js2css.js",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "test": "mocha"
   },
@@ -9,0 +9,0 @@ "keywords": [

README.md

@@ -1,3 +0,3 @@
-# js2css
-Use plain JavaScript to write your CSS. 
+# js2css [![Build Status](https://travis-ci.org/sjurba/js2css.svg?branch=master)](https://travis-ci.org/sjurba/js2css)
+Use plain JavaScript to write your CSS.
 
@@ -4,0 +4,0 @@ ## Disclaimer

test/js2css.spec.js

 'use strict';
 var js2css = require('../lib/js2css.js');
+var expect = require('chai').expect;
 
@@ -7,7 +8,140 @@ describe('JS2CSS', function () {
     describe('compile', function () {
+
+        beforeEach(function () {
+            js2css.mixins = {};
+        });
+
+        function consolidate(css) {
+            return css.replace(/\n*/g, '').replace(/([;:{}])\s/g, '$1').replace(/\s([;:{}])/g, '$1').trim();
+        }
+
+        function verifyCompile(input, expected) {
+            var res = js2css(input);
+            expect(consolidate(res)).to.equal(consolidate(expected));
+        }
+
         it('basic', function () {
-            js2css({
+            verifyCompile({
                 body: {
                     color: 'red'
                 }
+            }, 'body { color: red;}');
+        });
+        it('function', function () {
+            function foo() {
+                return 'red';
+            }
+            verifyCompile({
+                body: {
+                    color: foo
+                }
+            }, 'body { color: red;}');
+        });
+        it('array', function () {
+            verifyCompile({
+                body: {
+                    color: ['red', 'blue', 'black']
+                }
+            }, 'body { color: red; color: blue; color: black;}');
+        });
+        it('nesting', function () {
+            verifyCompile({
+                    body: {
+                        color: 'blue',
+                        div: {
+                            color: 'red'
+                        }
+                    }
+                },
+                'body { color: blue; }' +
+                'body div {color: red; }');
+        });
+
+        it('empty selectors', function () {
+            verifyCompile({
+                    body: {
+                        div: {}
+                    }
+                },
+                '');
+        });
+
+        it('nesting connected selectors', function () {
+            verifyCompile({
+                    div: {
+                        '&.myclass': {
+                            color: 'red'
+                        }
+                    }
+                },
+                'div.myclass {color: red; }');
+        });
+
+        it('mixins', function () {
+            var coolmixin = function (val) {
+                return {
+                    padding: val + 'px'
+                };
+            };
+            var styles = {
+                body: {
+                    coolmixin: 12
+                }
+            };
+            var mixins = {
+                coolmixin: coolmixin
+            };
+            verifyCompile({
+                styles: styles,
+                mixins: mixins
+            }, 'body { padding: 12px; }');
+        });
+
+        it('global mixins', function () {
+            var coolmixin = function (val) {
+                return {
+                    padding: val + 'px'
+                };
+            };
+            js2css.mixins.coolmixin = coolmixin;
+            verifyCompile({
+                body: {
+                    coolmixin: 12
+                }
+            }, 'body { padding: 12px; }');
+        });
+
+        it('array of styles', function () {
+            verifyCompile([{
+                body: {
+                    color: 'red'
+                }
+            }, {
+                div: {
+                    color: 'blue'
+                }
+            }], 'body { color: red;} div { color: blue; }');
+        });
+
+        it('camelcase', function () {
+            verifyCompile({
+                body: {
+                    fontSize: '12px'
+                }
+            }, 'body { font-size: 12px;}');
+        });
+
+    });
+
+    describe('to json', function () {
+        function verifyToJson(input, expected) {
+            var res = js2css.toJSON(input);
+            expect(res).to.deep.equal(expected);
+        }
+
+        it('basic', function () {
+            verifyToJson('body { color: red;}', {
+                body: {
+                    color: 'red'
+                }
             });
@@ -14,0 +148,0 @@ });

Fixed alerts

No tests

Quality

Package does not have any tests. This is a strong signal of a poorly maintained or low quality package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

15486

43.77%

Number of package files

12

9.09%

Lines of code

351

54.63%

Number of low quality alerts

2

-33.33%

No dependency changes