Add eslint config, changes in plugin main file

.eslintignore

@@ -0,0 +1,3 @@
+# Ignore built files except build/index.js
+/.vscode
+node_modules

.eslintrc-full.js

@@ -0,0 +1,19 @@
+module.exports = {
+  parserOptions: {
+    ecmaVersion: 2018,
+  },
+  env: {
+    node: true,
+    es6: true,
+    mocha: true,
+  },
+  extends: [
+    "eslint-config-postcss",
+  ],
+  rules: {
+    "max-len": [1, 100],
+    "semi": [2, "always"],
+
+    "prefer-let/prefer-let": 0,
+  },
+}

.eslintrc.js

@@ -0,0 +1,19 @@
+module.exports = {
+  parserOptions: {
+    ecmaVersion: 2018,
+  },
+  env: {
+    node: true,
+    es6: true,
+    mocha: true,
+  },
+  extends: [
+    "eslint-config-postcss",
+  ],
+  rules: {
+    "max-len": [1, 100],
+    "semi": [1, "always"],
+
+    "prefer-let/prefer-let": 0,
+  },
+}

.gitignore

@@ -4,3 +4,4 @@ yarn-error.log
 *.css
 postcss.config.js
 test/test.js
+styles/

index.js

@@ -1,36 +1,51 @@
-const postcss = require('postcss')
-const valueParser = require('postcss-values-parser')
-const convert = require('color-convert')
+const postcss = require('postcss');
+const valueParser = require('postcss-values-parser');
+const convert = require('color-convert');
 
-const regexpHEX = /#([a-f\d]{3}|[a-f\d]{6})/i
+const regexpHEX = /#([a-f\d]{3}|[a-f\d]{6})$/i;
+const regexpHEXAlpha = /#([a-f\d]{4}|[a-f\d]{8})$/i;
+const regexpRGB = /rgb\(/;
+const regexpHSL = /hsl\(/;
 
 const defaultOptions = {
   syntax: '',
   outputColorFormat: ''
-}
+};
 
 module.exports = postcss.plugin('postcss-color-converter', (opts = {}) => {
   let currentOptions = {
     ...defaultOptions,
     ...opts
-  }
+  };
 
   return style => {
     style.walkDecls(decl => {
-      let value = decl.value
+      let value = decl.value;
 
       if (value) {
-        let newColor = valueParser.parse(value)
+        let newValue = valueParser.parse(value);
 
         if (regexpHEX.test(value) && currentOptions.outputColorFormat === 'rgb') {
-          newColor.walk(node => {
-            if (node.type === 'word') {
-              node.value = `rgb(${ convert.hex.rgb(node.value).join(', ') })`
+          newValue.walk(node => {
+            if (node.type === 'word' && node.isColor && node.isHex) {
+              node.value = `rgb(${ convert.hex.rgb(node.value).join(', ') })`;
             }
-          })
+          });
         }
-        decl.value = newColor.toString()
+
+        if (regexpRGB.test(value) && currentOptions.outputColorFormat === 'hex') {
+          newValue.walk(node => {
+            if (node.type === 'func' && node.isColor) {
+              const newNode = node.clone({ type: 'word' });
+              newNode.value = `#${ convert.rgb.hex(node.nodes[0], node.nodes[2], node.nodes[4]) }`;
+              node.replaceWith(newNode);
+              // console.log(newNode)
+            }
+          });
+        }
+
+        decl.value = newValue.toString();
       }
-    })
-  }
-})
+    });
+  };
+});

package.json

@@ -10,8 +10,9 @@
     "converter"
   ],
   "scripts": {
-    "test": "mocha ./test/index.test.js",
-    "postcss": "postcss test.css --config ./postcss.config.js -r"
+    "test": "mocha ./test/*.test.js",
+    "lint": "eslint --config ./.eslintrc-full.js **/*.js --fix",
+    "postcss": "postcss ./styles/test.{css,scss} --config ./postcss.config.js -r"
   },
   "author": "EdMSL <eduard2011rus@gmail.com>",
   "license": "MIT",

test/hex.test.js

@@ -0,0 +1,50 @@
+const postcss = require('postcss');
+const { assert } = require('chai');
+
+const plugin = require('../index');
+
+/* eslint-disable prefer-arrow-callback, func-names */
+
+describe('postcss-color-converter', function () {
+  function transform (source, opts) {
+    return postcss([plugin(opts)]).process(source).css;
+  }
+
+  it('Input color should not be converted', function () {
+    assert.equal(transform(
+      'body { color: #ffffff; }',
+      {}
+    ), 'body { color: #ffffff; }');
+    assert.equal(transform(
+      'body { color: #ffffff; }',
+      { outputColorFormat: 'hex' }
+    ), 'body { color: #ffffff; }');
+  });
+
+  it('Input color must be converted to rgb', function () {
+    assert.equal(transform(
+      'body { color: #ffffff; }',
+      { outputColorFormat: 'rgb' }
+    ), 'body { color: rgb(255, 255, 255); }');
+    assert.equal(transform(
+      `ul {
+        background: linear-gradient(
+          to bottom,
+          #456789 0%,
+          #fff555 100%,
+        );
+      }`,
+      { outputColorFormat: 'rgb' }
+    ), `ul {
+        background: linear-gradient(
+          to bottom,
+          rgb(69, 103, 137) 0%,
+          rgb(255, 245, 85) 100%,
+        );
+      }`);
+    assert.equal(transform(
+      'body { color: #555; }',
+      { outputColorFormat: 'rgb' }
+    ), 'body { color: rgb(85, 85, 85); }');
+  });
+});

test/rgb.test.js

@@ -0,0 +1,46 @@
+const postcss = require('postcss');
+const { assert } = require('chai');
+
+const plugin = require('../index');
+
+/* eslint-disable prefer-arrow-callback, func-names */
+
+describe('postcss-color-converter', function () {
+  function transform (source, opts) {
+    return postcss([plugin(opts)]).process(source).css;
+  }
+
+  it('Input color should not be converted', function () {
+    assert.equal(transform(
+      'body { color: rgb(255, 255, 255); }',
+      { outputColorFormat: 'rgb' }
+    ), 'body { color: rgb(255, 255, 255); }');
+    assert.equal(transform(
+      'body { color: rgb(255, 255, 255); }',
+      {}
+    ), 'body { color: rgb(255, 255, 255); }');
+  });
+
+  it('Input color must be converted to hex', function () {
+    assert.equal(transform(
+      'body { color: rgb(255, 255, 255); }',
+      { outputColorFormat: 'hex' }
+    ), 'body { color: #ffffff; }');
+    assert.equal(transform(
+      `ul {
+        background: linear-gradient(
+          to bottom,
+          rgb(69, 103, 137) 0%,
+          rgb(255, 245, 85) 100%,
+        );
+      }`,
+      { outputColorFormat: 'hex' }
+    ), `ul {
+        background: linear-gradient(
+          to bottom,
+          #456789 0%,
+          #fff555 100%,
+        );
+      }`);
+  });
+});