feat: update scripts; add: tests

Author: denisx

README.md

@@ -1356,7 +1356,7 @@ as a classname position at file, with filepath `hash:base64:8`, to have strong s
 **webpack.config.js**
 
 ```js
-const { OneLetterCss } = require('css-loader/plugins');
+const { HashLenSuggest, OneLetterCss } = require('css-loader/plugins');
 const MyOneLetterCss = new OneLetterCss();
 
 const cssHashLen = 8;

src/plugins/hash-len-suggest.js

@@ -1,29 +1,4 @@
-/* eslint-disable no-console */
-
-/*
-at webpack settings:
-const cssHashLen = 8
-...
-{
-    loader: 'css-loader',
-    options: {
-        modules: {
-            localIdentName: `[hash:base64:${cssHashLen}]`,
-            getLocalIdent: MyOneLetterCss.getLocalIdent
-        }
-    }
-}
-...
-plugins: [
-        ...plugins,
-        new HashLenSuggest({
-            instance: MyOneLetterCss,
-            selectedHashLen: cssHashLen
-        })
-    ]
-*/
-
-class HashLenSuggest {
+export default class HashLenSuggest {
   constructor({ instance, selectedHashLen }) {
     this.instance = instance;
     this.selectedHashLen = selectedHashLen;
@@ -33,7 +8,8 @@ class HashLenSuggest {
     compiler.plugin('done', this.run);
   }
 
-  static collectHashLen(data) {
+  run() {
+    const data = this.instance.getStat();
     const matchLen = {};
     const base = {};
 
@@ -51,17 +27,12 @@ class HashLenSuggest {
       }
     });
 
-    return matchLen;
-  }
-
-  run() {
-    const { instance, selectedHashLen } = this;
-    const matchLen = HashLenSuggest.collectHashLen(instance.getStat());
-
     console.log();
     console.log('Suggest Minify Plugin');
     console.log('Matched length (len: number):', matchLen);
 
+    const { selectedHashLen } = this;
+
     if (matchLen[selectedHashLen]) {
       console.log(
         `🚫 You can't use selected hash length (${selectedHashLen}). Increase the hash length.`
@@ -83,5 +54,3 @@ class HashLenSuggest {
     }
   }
 }
-
-module.exports = HashLenSuggest;

src/plugins/index.js

@@ -1,6 +1,7 @@
 import importParser from './postcss-import-parser';
 import icssParser from './postcss-icss-parser';
-import OneLetterCss from './one-letter-css';
 import urlParser from './postcss-url-parser';
+import HashLenSuggest from './hash-len-suggest';
+import OneLetterCss from './one-letter-css';
 
-export { OneLetterCss, importParser, icssParser, urlParser };
+export { HashLenSuggest, OneLetterCss, importParser, icssParser, urlParser };

src/plugins/one-letter-css.js

@@ -1,92 +1,207 @@
+const { interpolateName } = require('loader-utils');
+
 /**
- * @author denisx <github.com@denisx.com>
+ * Заменяем css-классы на 64-битный префикс по номеру позиции в файле + хеш от пути файла
  */
 
-const loaderUtils = require('loader-utils');
+// Парсим кодирующую строку, или берем дефолтные значения
+const getRule = (externalRule) => {
+  let iRule = {
+    type: 'hash',
+    rule: 'base64',
+    hashLen: 8,
+    val: '',
+  };
+
+  iRule.val = `[${iRule.type}:${iRule.rule}:${iRule.hashLen}]`;
+
+  const matchHashRule =
+    externalRule
+      .replace(/_/g, '')
+      .match(/^(?:\[local])*\[([a-z\d]+):([a-z\d]+):(\d+)]$/) || [];
+
+  if (matchHashRule.length >= 4) {
+    const [, type, rule, hashLen] = matchHashRule;
+
+    iRule = {
+      type,
+      rule,
+      hashLen,
+      val: `[${type}:${rule}:${hashLen}]`,
+    };
+  }
+
+  return iRule;
+};
 
-export default class OneLetterCss {
+export default class OneLetterCssClasses {
   constructor() {
-    // Save char symbol start positions
+    // Сохраняем начальные точки из таблицы
     this.a = 'a'.charCodeAt(0);
     this.A = 'A'.charCodeAt(0);
-    // file hashes cache
+    this.zero = '0'.charCodeAt(0);
     this.files = {};
-    /** encoding [a-zA-Z] */
-    this.symbols = 52;
-    /** a half of encoding */
-    this.half = 26;
-    /** prevent loop-hell */
-    this.maxLoop = 10;
+    // [a-zA-Z\d_-]
+    this.encoderSize = 64;
+    this.symbolsArea = {
+      // a-z
+      az: 26,
+      // A-Z
+      AZ: 52,
+      // _
+      under: 53,
+      // 0-9 | \d
+      digit: 63,
+      // -
+      // dash: 64
+    };
+    // prevent loop hell
+    this.maxLoop = 5;
+    this.rootPathLen = process.cwd().length;
   }
 
-  /** encoding by rule count at file, 0 - a, 1 - b, 51 - Z, 52 - ba, etc */
-  getName(lastUsed) {
-    const { a, A, symbols, maxLoop, half } = this;
-    let name = '';
-    let loop = 0;
-    let main = lastUsed;
-    let tail = 0;
-
-    while (
-      ((main > 0 && tail >= 0) ||
-        // first step anyway needed
-        loop === 0) &&
-      loop < maxLoop
-    ) {
-      const newMain = Math.floor(main / symbols);
-
-      tail = main % symbols;
-      name = String.fromCharCode((tail >= half ? A - half : a) + tail) + name;
-      main = newMain;
-      loop += 1;
+  getSingleSymbol(n) {
+    const {
+      a,
+      A,
+      zero,
+      encoderSize,
+      symbolsArea: { az, AZ, under, digit },
+    } = this;
+
+    if (!n) {
+      console.error(`!n, n=${n}`);
+
+      return '';
+    }
+
+    if (n > encoderSize) {
+      console.error(`n > ${encoderSize}, n=${n}`);
+
+      return '';
+    }
+
+    // work with 1 <= n <= 64
+    if (n <= az) {
+      return String.fromCharCode(n - 1 + a);
+    }
+
+    if (n <= AZ) {
+      return String.fromCharCode(n - 1 - az + A);
+    }
+
+    if (n <= under) {
+      return '_';
+    }
+
+    if (n <= digit) {
+      return String.fromCharCode(n - 1 - under + zero);
     }
 
-    return name;
+    return '-';
   }
 
-  getLocalIdent(context, localIdentName, localName) {
+  /** Кодируем класс по позиции в списке, 0 - а, 1 - b, итп */
+  getNamePrefix(num) {
+    const { maxLoop, encoderSize } = this;
+
+    if (!num) {
+      return '';
+    }
+
+    let loopCount = 0;
+    let n = num;
+    let res = '';
+
+    // Немного усовеншенственный енкодер. В найденых простейших пропускаются комбинации
+    // Ходим в цикле, делим на кодирующий размер (64)
+    // Например, с 1 по 64 - 1 проход, с 65 по 4096 (64*64) - 2 прохода цикла, итд
+    while (n && loopCount < maxLoop) {
+      // Остаток от деления, будем его кодировать от 1 до 64.
+      let tail = n % encoderSize;
+      const origTail = tail;
+
+      // Проверка граничных значений n === encoderSize. 64 % 64 = 0, а кодировать будем 64
+      if (tail === 0) {
+        tail = encoderSize;
+      }
+
+      // Берем результат кодирования, добавляем в строку
+      res = this.getSingleSymbol(tail) + res;
+
+      // Проверяем, нужно ли уходить на новый цикл
+      if (Math.floor((n - 1) / encoderSize)) {
+        // Находим кол-во разрядов для след. цикла кодирования.
+        n = (n - origTail) / encoderSize;
+
+        // На граничном значении (64) уйдем на новый круг, -1 чтобы этого избежать (это мы уже закодировали в текущем проходе)
+        if (origTail === 0) {
+          n -= 1;
+        }
+      } else {
+        n = 0;
+      }
+
+      loopCount += 1;
+    }
+
+    return res;
+  }
+
+  /**
+   * Переопределяем ф-ию хеширования класса.
+   * Т.к. обработка на этапе сборки, то файлы разные, отсюда меньше выхлопа
+   */
+  getLocalIdentWithFileHash(context, localIdentName, localName) {
     const { resourcePath } = context;
-    const { files } = this;
+    const { files, rootPathLen } = this;
+
+    // Чтобы убрать разницу стендов - оставляем только значимый кусок пути файла
+    const resPath = resourcePath.substr(rootPathLen);
 
-    // check file data at cache by absolute path
-    let fileShort = files[resourcePath];
+    // Файл уже в списке, берем его новое имя
+    let fileShort = files[resPath];
 
-    // no file data, lets generate and save
+    // Файла нет в списке, генерируем новое имя, и сохраняем
     if (!fileShort) {
-      // if we know file position, we must use base52 encoding with '_'
-      // between rule position and file position
-      // to avoid collapse hash combination. a_ab vs aa_b
-      const fileShortName = loaderUtils.interpolateName(
-        context,
-        '[hash:base64:8]',
-        {
-          content: resourcePath,
-        }
-      );
+      // парсим переданное правило
+      const localIdentRule = getRule(localIdentName);
+
+      const fileShortName = interpolateName(context, localIdentRule.val, {
+        content: resPath,
+      });
 
-      fileShort = { name: fileShortName, lastUsed: -1, ruleNames: {} };
-      files[resourcePath] = fileShort;
+      fileShort = { name: fileShortName, lastUsed: 0, ruleNames: {} };
+      files[resPath] = fileShort;
     }
 
-    // Get generative rule name from this file
+    // Берем сгенерированное имя правило, если такое уже было в текущем файле
     let newRuleName = fileShort.ruleNames[localName];
 
-    // If no rule - renerate new, and save
+    // Если его не было - генерируем новое, и сохраняем
     if (!newRuleName) {
-      // Count +1
+      // Увеличиваем счетчик правила для текущего файла
       fileShort.lastUsed += 1;
 
-      // Generate new rule name
-      newRuleName = this.getName(fileShort.lastUsed) + fileShort.name;
+      // Генерируем новое имя правила
+      newRuleName = this.getNamePrefix(fileShort.lastUsed) + fileShort.name;
 
-      // Saved
+      // сохраняем
       fileShort.ruleNames[localName] = newRuleName;
     }
 
-    // If has "local" at webpack settings
+    // Проверяем, есть ли в веб-паке настройки, что нам нужны оригинальные имена классов
     const hasLocal = /\[local]/.test(localIdentName);
 
-    // If has - add prefix
-    return hasLocal ? `${localName}__${newRuleName}` : newRuleName;
+    // Если develop-настройка есть - добавляем префикс
+    const res = hasLocal ? `${localName}__${newRuleName}` : newRuleName;
+
+    // Добавляем префикс '_' для классов, начинающихся с '-', цифры '\d'
+    // или '_' (для исключения коллизий, т.к. символ участвует в кодировании)
+    return /^[\d_-]/.test(res) ? `_${res}` : res;
+  }
+
+  getStat() {
+    return this.files;
   }
 }