jss-compose - npm Package Compare versions

Comparing version 2.0.0 to 2.0.1

changelog.md

@@ -0,1 +1,5 @@
+## 2.0.1 / 2017-02-27
+
+- mock out generateClassName in tests
+
 ## 2.0.0 / 2016-12-09
@@ -2,0 +6,0 @@

lib/index.test.js

@@ -23,3 +23,7 @@ 'use strict';
     });
-    jss = (0, _jss.create)().use((0, _2.default)());
+    jss = (0, _jss.create)({
+      generateClassName: function generateClassName(str, rule) {
+        return rule.name + '-id';
+      }
+    }).use((0, _2.default)());
   });
@@ -57,7 +61,7 @@
     it('should compose classes', function () {
-      (0, _expect2.default)(sheet.getRule('b').className).to.be('b-3538039808 a-3787690649');
+      (0, _expect2.default)(sheet.getRule('b').className).to.be('b-id a-id');
     });
 
     it('should generate correct CSS', function () {
-      (0, _expect2.default)(sheet.toString()).to.be('.a-3787690649 {\n' + '  float: left;\n' + '}\n' + '.b-3538039808 {\n' + '  color: red;\n' + '}');
+      (0, _expect2.default)(sheet.toString()).to.be('.a-id {\n' + '  float: left;\n' + '}\n' + '.b-id {\n' + '  color: red;\n' + '}');
     });
@@ -87,7 +91,7 @@ });
     it('should compose classes', function () {
-      (0, _expect2.default)(sheet.getRule('a').className).to.be('a-4193320358 b');
+      (0, _expect2.default)(sheet.getRule('a').className).to.be('a-id b');
     });
 
     it('should generate correct CSS', function () {
-      (0, _expect2.default)(sheet.toString()).to.be('.a-4193320358 {\n' + '  color: red;\n' + '}');
+      (0, _expect2.default)(sheet.toString()).to.be('.a-id {\n' + '  color: red;\n' + '}');
     });
@@ -129,7 +133,7 @@ });
     it('should compose classes', function () {
-      (0, _expect2.default)(sheet.getRule('d').className).to.be('d-452344379 a-3787690649 b-3645560457 c-3525728718');
+      (0, _expect2.default)(sheet.getRule('d').className).to.be('d-id a-id b-id c-id');
     });
 
     it('should generate correct CSS', function () {
-      (0, _expect2.default)(sheet.toString()).to.be('.a-3787690649 {\n' + '  float: left;\n' + '}\n' + '.b-3645560457 {\n' + '  color: red;\n' + '}\n' + '.c-3525728718 {\n' + '  background: blue;\n' + '}\n' + '.d-452344379 {\n' + '  border: none;\n' + '}');
+      (0, _expect2.default)(sheet.toString()).to.be('.a-id {\n' + '  float: left;\n' + '}\n' + '.b-id {\n' + '  color: red;\n' + '}\n' + '.c-id {\n' + '  background: blue;\n' + '}\n' + '.d-id {\n' + '  border: none;\n' + '}');
     });
@@ -163,7 +167,7 @@ });
     it('should compose classes', function () {
-      (0, _expect2.default)(sheet.getRule('b').className).to.be('b-3696614589 a-3787690649 c d');
+      (0, _expect2.default)(sheet.getRule('b').className).to.be('b-id a-id c d');
     });
 
     it('should generate correct CSS', function () {
-      (0, _expect2.default)(sheet.toString()).to.be('.a-3787690649 {\n' + '  float: left;\n' + '}\n' + '.b-3696614589 {\n' + '  color: red;\n' + '}');
+      (0, _expect2.default)(sheet.toString()).to.be('.a-id {\n' + '  float: left;\n' + '}\n' + '.b-id {\n' + '  color: red;\n' + '}');
     });
@@ -202,8 +206,8 @@ });
     it('should compose classes', function () {
-      (0, _expect2.default)(sheet.getRule('b').className).to.be('b-3337890504 a-3787690649 d');
-      (0, _expect2.default)(sheet.getRule('c').className).to.be('c-3560954838 b-3337890504 a-3787690649 d');
+      (0, _expect2.default)(sheet.getRule('b').className).to.be('b-id a-id d');
+      (0, _expect2.default)(sheet.getRule('c').className).to.be('c-id b-id a-id d');
     });
 
     it('should generate correct CSS', function () {
-      (0, _expect2.default)(sheet.toString()).to.be('.a-3787690649 {\n' + '  float: left;\n' + '}\n' + '.b-3337890504 {\n' + '  color: red;\n' + '}\n' + '.c-3560954838 {\n' + '  background: blue;\n' + '}');
+      (0, _expect2.default)(sheet.toString()).to.be('.a-id {\n' + '  float: left;\n' + '}\n' + '.b-id {\n' + '  color: red;\n' + '}\n' + '.c-id {\n' + '  background: blue;\n' + '}');
     });
@@ -210,0 +214,0 @@ });

package.json

 {
   "name": "jss-compose",
   "description": "JSS plugin for classes composition",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "author": {
@@ -6,0 +6,0 @@ "name": "Pavel Davydov",

readme.md

@@ -9,11 +9,10 @@ # JSS plugin for classes composition
 
-[![Gitter](https://badges.gitter.im/Join Chat.svg)](https://gitter.im/cssinjs/lobby)
+[![Gitter](https://badges.gitter.im/JoinChat.svg)](https://gitter.im/cssinjs/lobby)
 
+## Compose with global classes.
 
-### Compose with global classes.
-
 To combine JSS with CSS framework like [Material Design Lite](https://getmdl.io/) or [Bootstrap](http://getbootstrap.com/) and others.
 
 ```javascript
-const sheet = jss.createStyleSheet({
+const styles = {
   button: {
@@ -24,6 +23,7 @@ composes: 'btn',
   buttonActive: {
-    composes: ['btn', 'btn-primary'], // You can use arrays too
+    // Using an array!
+    composes: ['btn', 'btn-primary'],
     color: 'blue'
   }
-})
+}
 ```
@@ -40,2 +40,3 @@ Compiles to:
 ```
+
 When you use it:
@@ -53,3 +54,3 @@
 
-### Compose with local classes.
+## Compose with local classes.
 
@@ -60,3 +61,3 @@ Manage element states without rules duplication.
 ```javascript
-const sheet = jss.createStyleSheet({
+const styles = {
   button: {
@@ -86,3 +87,3 @@ color: 'black'
   }
-})
+}
 ```
@@ -123,3 +124,3 @@
 
-### Mix global and local classes.
+## Mix global and local classes.
 
@@ -129,3 +130,3 @@ You can compose both local and global classes at the same time.
 ```javascript
-const sheet = jss.createStyleSheet({
+const styles = {
   active: {
@@ -138,3 +139,3 @@ color: 'red'
   }
-})
+}
 ```
@@ -163,5 +164,5 @@
 
-## Gotchas
+## Caveats
 
-- Composition doesn't work with option `{named: false}` - [global stylesheets](https://github.com/cssinjs/jss/blob/master/docs/json-api.md#writing-global-selectors).
+- Doesn't work within [global Style Sheets](https://github.com/cssinjs/jss-global).
 - Does not work inside of [nested rules](https://github.com/cssinjs/jss-nested).
@@ -168,0 +169,0 @@ - When composing local rules, they need to be defined first. Otherwise you get wrong css selector order and specificity.

tests/index.test.js

@@ -30,3 +30,7 @@ 'use strict';
     });
-    jss = _get__('create')().use(_get__('compose')());
+    jss = _get__('create')({
+      generateClassName: function generateClassName(str, rule) {
+        return rule.name + '-id';
+      }
+    }).use(_get__('compose')());
   });
@@ -64,7 +68,7 @@
     it('should compose classes', function () {
-      _get__('expect')(sheet.getRule('b').className).to.be('b-3538039808 a-3787690649');
+      _get__('expect')(sheet.getRule('b').className).to.be('b-id a-id');
     });
 
     it('should generate correct CSS', function () {
-      _get__('expect')(sheet.toString()).to.be('.a-3787690649 {\n' + '  float: left;\n' + '}\n' + '.b-3538039808 {\n' + '  color: red;\n' + '}');
+      _get__('expect')(sheet.toString()).to.be('.a-id {\n' + '  float: left;\n' + '}\n' + '.b-id {\n' + '  color: red;\n' + '}');
     });
@@ -94,7 +98,7 @@ });
     it('should compose classes', function () {
-      _get__('expect')(sheet.getRule('a').className).to.be('a-4193320358 b');
+      _get__('expect')(sheet.getRule('a').className).to.be('a-id b');
     });
 
     it('should generate correct CSS', function () {
-      _get__('expect')(sheet.toString()).to.be('.a-4193320358 {\n' + '  color: red;\n' + '}');
+      _get__('expect')(sheet.toString()).to.be('.a-id {\n' + '  color: red;\n' + '}');
     });
@@ -136,7 +140,7 @@ });
     it('should compose classes', function () {
-      _get__('expect')(sheet.getRule('d').className).to.be('d-452344379 a-3787690649 b-3645560457 c-3525728718');
+      _get__('expect')(sheet.getRule('d').className).to.be('d-id a-id b-id c-id');
     });
 
     it('should generate correct CSS', function () {
-      _get__('expect')(sheet.toString()).to.be('.a-3787690649 {\n' + '  float: left;\n' + '}\n' + '.b-3645560457 {\n' + '  color: red;\n' + '}\n' + '.c-3525728718 {\n' + '  background: blue;\n' + '}\n' + '.d-452344379 {\n' + '  border: none;\n' + '}');
+      _get__('expect')(sheet.toString()).to.be('.a-id {\n' + '  float: left;\n' + '}\n' + '.b-id {\n' + '  color: red;\n' + '}\n' + '.c-id {\n' + '  background: blue;\n' + '}\n' + '.d-id {\n' + '  border: none;\n' + '}');
     });
@@ -170,7 +174,7 @@ });
     it('should compose classes', function () {
-      _get__('expect')(sheet.getRule('b').className).to.be('b-3696614589 a-3787690649 c d');
+      _get__('expect')(sheet.getRule('b').className).to.be('b-id a-id c d');
     });
 
     it('should generate correct CSS', function () {
-      _get__('expect')(sheet.toString()).to.be('.a-3787690649 {\n' + '  float: left;\n' + '}\n' + '.b-3696614589 {\n' + '  color: red;\n' + '}');
+      _get__('expect')(sheet.toString()).to.be('.a-id {\n' + '  float: left;\n' + '}\n' + '.b-id {\n' + '  color: red;\n' + '}');
     });
@@ -209,8 +213,8 @@ });
     it('should compose classes', function () {
-      _get__('expect')(sheet.getRule('b').className).to.be('b-3337890504 a-3787690649 d');
-      _get__('expect')(sheet.getRule('c').className).to.be('c-3560954838 b-3337890504 a-3787690649 d');
+      _get__('expect')(sheet.getRule('b').className).to.be('b-id a-id d');
+      _get__('expect')(sheet.getRule('c').className).to.be('c-id b-id a-id d');
     });
 
     it('should generate correct CSS', function () {
-      _get__('expect')(sheet.toString()).to.be('.a-3787690649 {\n' + '  float: left;\n' + '}\n' + '.b-3337890504 {\n' + '  color: red;\n' + '}\n' + '.c-3560954838 {\n' + '  background: blue;\n' + '}');
+      _get__('expect')(sheet.toString()).to.be('.a-id {\n' + '  float: left;\n' + '}\n' + '.b-id {\n' + '  color: red;\n' + '}\n' + '.c-id {\n' + '  background: blue;\n' + '}');
     });
@@ -217,0 +221,0 @@ });

No alert changes

Improved metrics

Lines of code

948

increased by0.85%

Number of lines in readme file

175

increased by0.57%

Worsened metrics

Total package byte prevSize

60449

decreased by-0.45%

No dependency changes