Adding tests

.github/workflows/release.yml

@@ -24,6 +24,9 @@ jobs:
       - name: "Install Dependencies"
         run: npm i
 
+      - name: "Test"
+        run: npm test
+
       - name: "Zip release files" # Only if the version has been updated
         run: |
           echo "Creating a release zip file..."

modules/main/parser.js

@@ -87,7 +87,9 @@ function processVar(value) {
                     max ??= 100;
                 }
                 varData.default = defaultValue;
-                Object.assign(varData, { min, max, step });
+                varData.min = min ?? null;
+                varData.max = max ?? null;
+                varData.step = step ?? null;
                 break;
             }
             case "checkbox":

package.json

@@ -4,7 +4,7 @@
   "description": "Load custom UserStyles for QQNT",
   "main": "main.js",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1",
+    "test": "node ./scripts/test.js",
     "version": "node ./scripts/update_version.js"
   },
   "repository": {

scripts/test.js

@@ -0,0 +1,65 @@
+// Test `extractUserStyleMetadata` from modules/main/parser.js
+const { extractUserStyleMetadata } = require("../modules/main/parser");
+const fs = require("fs");
+
+/** Recursively compare two Objects.
+ * @param {Object} a The first object.
+ * @param {Object} b The second object.
+ * @returns {boolean} Whether the two objects are the same.
+ */
+function isSame(a, b) {
+    if (typeof a !== typeof b) return false;
+    if (typeof a !== "object") return a === b;
+    if (a === null || b === null) return a === b;
+    if (Array.isArray(a) !== Array.isArray(b)) return false;
+    if (Array.isArray(a)) {
+        if (a.length !== b.length) return false;
+        for (let i = 0; i < a.length; i++) {
+            if (!isSame(a[i], b[i])) return false;
+        }
+        return true;
+    }
+    const keysA = Object.keys(a).sort();
+    const keysB = Object.keys(b).sort();
+    if (keysA.length !== keysB.length) return false;
+    for (let i = 0; i < keysA.length; i++) {
+        if (keysA[i] !== keysB[i]) return false;
+        if (!isSame(a[keysA[i]], b[keysA[i]])) return false;
+    }
+    return true;
+}
+
+// Read testcases from `tests/input` directory
+const testcases = fs.readdirSync("tests/input").map(file => {
+    // Filename
+    const fname = file.split(".")[0];
+    return {
+        name: fname,
+        input: fs.readFileSync(`tests/input/${file}`, "utf-8"),
+        output: fs.readFileSync(`tests/output/${fname}.json`, "utf-8")
+    };
+});
+
+// Run testcases
+let success = true;
+for (const { name, input, output } of testcases) {
+    process.stdout.write(`- Testcase "${name}": `);
+    const metadata = extractUserStyleMetadata(input);
+    const expected = JSON.parse(output);
+    if (isSame(metadata, expected)) {
+        process.stdout.write("✅\n");
+    } else {
+        success = false;
+        process.stdout.write("❌\n");
+        console.log("  Expected:\n", expected);
+        console.log("  Got:\n", metadata);
+        console.log("  Full output:\n", JSON.stringify(metadata));
+    }
+}
+
+if (success) {
+    console.log("✅ All testcases passed!");
+} else {
+    console.log("❌ Some testcases failed!");
+    process.exit(1);
+}

tests/input/test-stylus.styl

@@ -0,0 +1,43 @@
+/* ==UserStyle==
+@name         test
+@description  UserCSS example
+@namespace    example.com
+@author       me
+@version      0.1.0
+@preprocessor stylus
+@var checkbox fontEnable "Font enabled" 1
+@var text     fontSize   "Font size"    2.1em
+@var color    fontColor  "Font color"   #123456
+@var select   fontName   "Font name"    ["Arial", "Consolas*", "Times New Roman"]
+@var select   fontBkgd   "Body background color"   {
+  "Near Black": "#111111",
+  "Near White*": "#eeeeee"
+}
+@var text     bkgdImg    "Bkgd image"   "'http://example.com/bkgd.jpg'"
+@var text     logoImg    "Logo image"   none
+@var number   adOpacity  "Ad opacity"       [0.5, 0, 1, 0.1]
+@var range    imgHeight  "Max image height" [50, 10, 200, 10, "px"]
+==/UserStyle== */
+// From https://github.com/openstyles/stylus/wiki/Writing-UserCSS#variable-examples
+@-moz-document domain("example.com") {
+  if fontEnable {
+    body {
+      font-size: fontSize !important;
+      color: fontColor !important;
+      font-family: fontName !important; /* Consolas (without the "*") will be set as default */
+      background-color: fontBkgd !important;
+      /* This approach will not allow setting the background-image to "none" */
+      background-image: url(bkgdImg) !important;
+    }
+    #logo {
+       /* This approach will, but needs url('URL_HERE') written in the config input if set to a URL */
+      background-image: logoImg !important;
+    }
+    #ad {
+      opacity: adOpacity !important;
+    }
+    img {
+      max-height: imgHeight !important; /* the 'px' is added to this value automatically */
+    }
+  }
+}

tests/input/test-transitio.css

@@ -0,0 +1,28 @@
+/* ==UserStyle==
+@name         test
+@description  UserCSS example
+@namespace    example.com
+@author       me
+@version      0.1.0
+@preprocessor transitio
+@var text     var-1  "Var 1"  "Val 1"
+@var color    var-2  "Var 2"  "#012345"
+@var number   var-3  "Var 3"  123
+@var number   var-4  "Var 4"  [12, 3]
+@var number   var-5  "Var 5"  [12, 3, 45]
+@var number   var-6  "Var 6"  [12, 3, 45, 3]
+@var range    var-7  "Var 7"  [12, 3, 45, 3]
+@var percent  var-8  "Var 8"  [99]
+@var percent  var-9  "Var 9"  [12, 3]
+@var percent  var-10 "Var 10" [12, 3, 45]
+@var percent  var-11 "Var 11" [12, 3, 45, 3]
+@var checkbox var-12 "Var 12" [true, "0", "1"]
+@var checkbox var-13 "Var 13" [false, "a", "b"]
+@var select   var-14 "Var 14" [1, "\\"String 1\\"", "\\"String 2\\"", "\\"String 3\\""]
+@var select   var-15 "Var 15" [0, ["inline", "显示"], ["none", "隐藏"]]
+@var select   var-16 "Var 16" [2, ["inline", "显示"], ["none", "隐藏"], ["block", "块级"]]
+@var raw      var-17 "Var 17" "display: none;"
+==/UserStyle== */
+#target {
+    display: var(--var-15);
+}

tests/output/test-stylus.json

@@ -0,0 +1,117 @@
+{
+    "name": "test",
+    "description": "UserCSS example",
+    "namespace": "example.com",
+    "author": "me",
+    "version": "0.1.0",
+    "preprocessor": "stylus",
+    "vars": {
+        "fontEnable": {
+            "type": "checkbox",
+            "label": "Font enabled",
+            "name": "fontEnable",
+            "value": null,
+            "default": true,
+            "options": null
+        },
+        "fontSize": {
+            "type": "text",
+            "label": "Font size",
+            "name": "fontSize",
+            "value": null,
+            "default": "2.1em",
+            "options": null
+        },
+        "fontColor": {
+            "type": "color",
+            "label": "Font color",
+            "name": "fontColor",
+            "value": null,
+            "default": "#123456",
+            "options": null
+        },
+        "fontName": {
+            "type": "select",
+            "label": "Font name",
+            "name": "fontName",
+            "value": null,
+            "default": "Consolas",
+            "options": [
+                {
+                    "name": "Arial",
+                    "label": "Arial",
+                    "value": "Arial"
+                },
+                {
+                    "name": "Consolas",
+                    "label": "Consolas",
+                    "value": "Consolas"
+                },
+                {
+                    "name": "Times New Roman",
+                    "label": "Times New Roman",
+                    "value": "Times New Roman"
+                }
+            ]
+        },
+        "fontBkgd": {
+            "type": "select",
+            "label": "Body background color",
+            "name": "fontBkgd",
+            "value": null,
+            "default": "Near White",
+            "options": [
+                {
+                    "name": "Near Black",
+                    "label": "Near Black",
+                    "value": "#111111"
+                },
+                {
+                    "name": "Near White",
+                    "label": "Near White",
+                    "value": "#eeeeee"
+                }
+            ]
+        },
+        "bkgdImg": {
+            "type": "text",
+            "label": "Bkgd image",
+            "name": "bkgdImg",
+            "value": null,
+            "default": "'http://example.com/bkgd.jpg'",
+            "options": null
+        },
+        "logoImg": {
+            "type": "text",
+            "label": "Logo image",
+            "name": "logoImg",
+            "value": null,
+            "default": "none",
+            "options": null
+        },
+        "adOpacity": {
+            "type": "number",
+            "label": "Ad opacity",
+            "name": "adOpacity",
+            "value": null,
+            "default": 0.5,
+            "options": null,
+            "min": 0,
+            "max": 1,
+            "step": 0.1,
+            "units": null
+        },
+        "imgHeight": {
+            "type": "range",
+            "label": "Max image height",
+            "name": "imgHeight",
+            "value": null,
+            "default": 50,
+            "options": null,
+            "min": 10,
+            "max": 200,
+            "step": 10,
+            "units": "px"
+        }
+    }
+}