Merge pull request #1270 from Patternslib/petschki-mockup-parser-fixes

modernize code in `mockup-parser.js`

Author: thet

src/core/mockup-parser.js

@@ -1,4 +1,3 @@
-import $ from "jquery";
 
 var parser = {
     getOptions($el, patternName, options) {
@@ -12,7 +11,7 @@ var parser = {
          */
         options = options || {};
         // get options from parent element first, stop if element tag name is 'body'
-        if ($el.length !== 0 && !$.nodeName($el[0], "body")) {
+        if ($el.length !== 0 && $el[0].nodeName !== "BODY") {
             options = this.getOptions($el.parent(), patternName, options);
         }
         // collect all options from element
@@ -23,7 +22,7 @@ var parser = {
                 // parse options if string
                 if (typeof elOptions === "string") {
                     const tmpOptions = {};
-                    $.each(elOptions.split(";"), function (i, item) {
+                    elOptions.split(";").forEach(item => {
                         item = item.split(":");
                         item.reverse();
                         let key = item.pop();
@@ -37,7 +36,10 @@ var parser = {
                 }
             }
         }
-        return $.extend(true, {}, options, elOptions);
+        return {
+            ...options,
+            ...elOptions,
+        }
     },
 };
 

src/core/mockup-parser.test.js

@@ -0,0 +1,40 @@
+import $ from "jquery";
+import mockupParser from "./mockup-parser";
+
+describe("The mockup-parser", function () {
+    it("parses the data attribute of a single node", function () {
+        const $el = $(`
+            <span data-pat-testpattern="option1: value1; option2: value2">
+                mockup parser test
+            </span>`);
+        const options = mockupParser.getOptions($el, "testpattern");
+        expect(options.option1).toBe("value1");
+        expect(options.option2).toBe("value2");
+    });
+    it("parses the data attribute of nested nodes", function () {
+        const $el = $(`
+            <div data-pat-testpattern="parentOption1: value1; parentOption2: value2">
+                <span data-pat-testpattern="option1: subvalue1; option2: subvalue2">
+                    nested mockup parser test
+                </span>
+            </div>`);
+        const options = mockupParser.getOptions($el, "testpattern");
+        expect(options.parentOption1).toBe("value1");
+        expect(options.parentOption2).toBe("value2");
+        expect(options.option1).toBe(undefined);
+        expect(options.option2).toBe(undefined);
+    });
+    it("parses the data attribute of a single node and preserves injected options", function () {
+        const $el = $(`
+            <span data-pat-testpattern="option1: value1; option2: value2">
+                mockup parser test
+            </span>
+        `);
+        const options = mockupParser.getOptions($el, "testpattern", {
+            injectedOption: "injectedValue",
+        });
+        expect(options.option1).toBe("value1");
+        expect(options.option2).toBe("value2");
+        expect(options.injectedOption).toBe("injectedValue");
+    });
+});