@schukai/monster 3.31.1 → 3.33.0

package/README.md

@@ -73,7 +73,7 @@ We do try to work around some browser bugs, but on the whole we don't use polyfi
 However, many functions can be mapped via [polyfill.io](https://polyfill.io/) and thus the compatibility can be increased.
 
 ```html
-<script id="polyfill" src="https://polyfill.io/v3/polyfill.min.js?features=Array.from,Array.isArray,Array.prototype.entries,Array.prototype.fill,Array.prototype.filter,Array.prototype.forEach,Array.prototype.indexOf,Array.prototype.keys,Array.prototype.lastIndexOf,Array.prototype.map,Array.prototype.reduce,Array.prototype.sort,ArrayBuffer,atob,Blob,CustomEvent,DataView,document,Document,DocumentFragment,Element,Event,fetch,globalThis,HTMLDocument,HTMLTemplateElement,Intl,JSON,Map,Math.log2,Number.isInteger,Object.assign,Object.defineProperty,Object.entries,Object.freeze,Object.getOwnPropertyDescriptor,Object.getOwnPropertyNames,Object.getPrototypeOf,Object.keys,Promise,Reflect,Reflect.defineProperty,Reflect.get,Reflect.getOwnPropertyDescriptor,Reflect.setPrototypeOf,Set,String.prototype.endsWith,String.prototype.matchAll,String.prototype.padStart,String.prototype.startsWith,String.prototype.trim,Symbol,Symbol.for,Symbol.hasInstance,Symbol.iterator,Uint16Array,Uint8Array,URL,WeakMap,WeakSet"
+<script id="polyfill" src="https://polyfill.io/v3/polyfill.min.js?features=Array.from,Array.isArray,Array.prototype.entries,Array.prototype.fill,Array.prototype.filter,Array.prototype.forEach,Array.prototype.includes,Array.prototype.indexOf,Array.prototype.keys,Array.prototype.lastIndexOf,Array.prototype.map,Array.prototype.reduce,Array.prototype.sort,ArrayBuffer,atob,Blob,CustomEvent,DataView,document,Document,DocumentFragment,Element,Event,fetch,globalThis,HTMLDocument,HTMLTemplateElement,Intl,JSON,Map,Math.log2,Number.isInteger,Object.assign,Object.defineProperty,Object.entries,Object.freeze,Object.getOwnPropertyDescriptor,Object.getOwnPropertyNames,Object.getPrototypeOf,Object.keys,Promise,Reflect,Reflect.defineProperty,Reflect.get,Reflect.getOwnPropertyDescriptor,Reflect.setPrototypeOf,Set,String.prototype.endsWith,String.prototype.includes,String.prototype.matchAll,String.prototype.padStart,String.prototype.startsWith,String.prototype.trim,Symbol,Symbol.for,Symbol.hasInstance,Symbol.iterator,Uint16Array,Uint8Array,URL,WeakMap,WeakSet"
        crossorigin="anonymous"
        referrerpolicy="no-referrer"></script>
 ```

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@schukai/monster",
-  "version": "3.31.1",
+  "version": "3.33.0",
   "description": "Monster is a simple library for creating fast, robust and lightweight websites.",
   "keywords": [
     "framework",

package/source/data/transformer.mjs

@@ -168,8 +168,6 @@ function transform(value) {
     let key;
     let defaultValue;
 
-    let element;
-    let attribute;
     let translations;
     let date;
     let locale;
@@ -330,6 +328,15 @@ function transform(value) {
             if (trueStatement === "\\value") {
                 trueStatement = "value";
             }
+
+            if (trueStatement === "\\undefined") {
+                trueStatement = undefined;
+            }
+
+            if (trueStatement === "\\null") {
+                trueStatement = null;
+            }
+
             if (falseStatement === "value") {
                 falseStatement = value;
             }
@@ -337,6 +344,14 @@ function transform(value) {
                 falseStatement = "value";
             }
 
+            if (falseStatement === "\\undefined") {
+                falseStatement = undefined;
+            }
+
+            if (falseStatement === "\\null") {
+                falseStatement = null;
+            }
+
             let condition =
                 (value !== undefined && value !== "" && value !== "off" && value !== "false" && value !== false) ||
                 value === "on" ||

package/source/dom/customelement.mjs

@@ -29,6 +29,7 @@ import {findDocumentTemplate, Template} from "./template.mjs";
 import {addObjectWithUpdaterToElement} from "./updater.mjs";
 import {instanceSymbol} from "../constants.mjs";
 import {getDocumentTranslations, Translations} from "../i18n/translations.mjs";
+import {getSlottedElements} from "./slotted.mjs";
 
 export {
     CustomElement,
@@ -599,58 +600,6 @@ class CustomElement extends HTMLElement {
     }
 }
 
-/**
- * @private
- * @param {String|undefined} query
- * @param {String|undefined|null} name name of the slot (if the parameter is undefined, all slots are searched, if the parameter has the value null, all slots without a name are searched. if a string is specified, the slots with this name are searched.)
- * @return {*}
- * @this CustomElement
- * @license AGPLv3
- * @since 1.23.0
- * @throws {Error} query must be a string
- */
-function getSlottedElements(query, name) {
-    const self = this;
-    const result = new Set();
-
-    if (!(self.shadowRoot instanceof ShadowRoot)) {
-        return result;
-    }
-
-    let selector = "slot";
-    if (name !== undefined) {
-        if (name === null) {
-            selector += ":not([name])";
-        } else {
-            selector += `[name=${validateString(name)}]`;
-        }
-    }
-
-    const slots = self.shadowRoot.querySelectorAll(selector);
-
-    for (const [, slot] of Object.entries(slots)) {
-        slot.assignedElements().forEach(function (node) {
-            if (!(node instanceof HTMLElement)) return;
-
-            if (isString(query)) {
-                node.querySelectorAll(query).forEach(function (n) {
-                    result.add(n);
-                });
-
-                if (node.matches(query)) {
-                    result.add(node);
-                }
-            } else if (query !== undefined) {
-                throw new Error("query must be a string");
-            } else {
-                result.add(node);
-            }
-        });
-    }
-
-    return result;
-}
-
 /**
  * @this CustomElement
  * @private

package/source/dom/slotted.mjs

@@ -0,0 +1,111 @@
+import {isString} from "../types/is.mjs";
+import {validateString} from "../types/validate.mjs";
+
+export {getSlottedElements, getSlottedNodes};
+
+/**
+ * @private
+ * @param {String|undefined} query
+ * @param {String|undefined|null} name name of the slot (if the parameter is undefined, all slots are searched, if the parameter has the value null, all slots without a name are searched. if a string is specified, the slots with this name are searched.)
+ * @return {*}
+ * @this CustomElement
+ * @license AGPLv3
+ * @since 3.33.0
+ * @throws {Error} query must be a string
+ */
+function getSlottedNodes(query, name) {
+    const self = this;
+    const result = new Set();
+    
+    if (!self.shadowRoot) {
+        return result;
+    }
+
+    let selector = "slot";
+    if (name !== undefined) {
+        if (name === null) {
+            selector += ":not([name])";
+        } else {
+            selector += `[name=${validateString(name)}]`;
+        }
+    }
+
+    const slots = self.shadowRoot.querySelectorAll(selector);
+
+    for (const [, slot] of Object.entries(slots)) {
+        slot.assignedNodes().forEach(function (node) {
+            if (node === null || node === undefined) {
+                return;
+            }
+
+            if (isString(query)) {
+                node.querySelectorAll(query).forEach(function (n) {
+                    result.add(n);
+                });
+
+                if (node.matches(query)) {
+                    result.add(node);
+                }
+            } else if (query !== undefined) {
+                throw new Error("query must be a string");
+            } else {
+                result.add(node);
+            }
+        });
+    }
+
+    return result;
+}
+
+
+/**
+ * @private
+ * @param {String|undefined} query
+ * @param {String|undefined|null} name name of the slot (if the parameter is undefined, all slots are searched, if the parameter has the value null, all slots without a name are searched. if a string is specified, the slots with this name are searched.)
+ * @return {*}
+ * @this CustomElement
+ * @license AGPLv3
+ * @since 1.23.0
+ * @throws {Error} query must be a string
+ */
+function getSlottedElements(query, name) {
+    const self = this;
+    const result = new Set();
+
+    if (!(self.shadowRoot instanceof ShadowRoot)) {
+        return result;
+    }
+
+    let selector = "slot";
+    if (name !== undefined) {
+        if (name === null) {
+            selector += ":not([name])";
+        } else {
+            selector += `[name=${validateString(name)}]`;
+        }
+    }
+
+    const slots = self.shadowRoot.querySelectorAll(selector);
+
+    for (const [, slot] of Object.entries(slots)) {
+        slot.assignedElements().forEach(function (node) {
+            if (!(node instanceof HTMLElement)) return;
+
+            if (isString(query)) {
+                node.querySelectorAll(query).forEach(function (n) {
+                    result.add(n);
+                });
+
+                if (node.matches(query)) {
+                    result.add(node);
+                }
+            } else if (query !== undefined) {
+                throw new Error("query must be a string");
+            } else {
+                result.add(node);
+            }
+        });
+    }
+
+    return result;
+}

package/source/types/version.mjs

@@ -142,7 +142,7 @@ function getMonsterVersion() {
     }
 
     /** don't touch, replaced by make with package.json version */
-    monsterVersion = new Version("3.31.1");
+    monsterVersion = new Version("3.33.0");
 
     return monsterVersion;
 }

package/test/cases/dom/customelement.mjs

@@ -2,7 +2,7 @@
 
 import chai from "chai"
 import {internalSymbol} from "../../../../application/source/constants.mjs";
-import {ATTRIBUTE_OPTIONS, customElementUpdaterLinkSymbol} from "../../../../application/source/dom/constants.mjs";
+import {ATTRIBUTE_OPTIONS} from "../../../../application/source/dom/constants.mjs";
 import {getDocument} from "../../../../application/source/dom/util.mjs";
 import {ProxyObserver} from "../../../../application/source/types/proxyobserver.mjs";
 import {addObjectWithUpdaterToElement} from "../../../../application/source/dom/updater.mjs";
@@ -32,42 +32,6 @@ describe('DOM', function () {
 
     let CustomElement, registerCustomElement, TestComponent, document, TestComponent2,assignUpdaterToElement;
 
-    // This allows us to inspect the addEventListener calls
-    
-    // let addEventListener = EventTarget.prototype.addEventListener;
-    // let removeEventListener = EventTarget.prototype.removeEventListener;
-    //
-    // before(function (done) {
-    //     initJSDOM().then(() => {
-    //
-    //         EventTarget.prototype.addEventListener = function (type, callback, options) {
-    //             /* store args and then… */
-    //             // callback = (e) => {
-    //             //     console.log("event fired" + e);
-    //             //     callback(e);
-    //             // };
-    //
-    //             addEventListener.call(this, type, callback, options);
-    //         };
-    //
-    //         EventTarget.prototype.removeEventListener = function (type, callback, options) {
-    //             /* remove from stored args and then… */
-    //             removeEventListener.call(this, type, callback, options);
-    //         };
-    //
-    //         done(e);
-    //
-    //
-    //     });
-    //
-    //    
-    // })
-    //
-    // after(function () {
-    //     EventTarget.prototype.addEventListener = addEventListener;
-    //     EventTarget.prototype.removeEventListener = removeEventListener;
-    // });
-
 
     describe("assignUpdaterToElement", function () {
 

package/test/cases/dom/find.mjs

@@ -2,30 +2,16 @@ import {
     findElementWithIdUpwards
 } from "../../../../application/source/dom/util.mjs";
 
-import { expect } from 'chai';
-import { JSDOM } from 'jsdom';
-
-let originalEnvironment;
+import {expect} from 'chai';
+import {initJSDOM} from "../../util/jsdom.mjs";
 
 function setupTestEnvironment() {
-    const { window } = new JSDOM('<!DOCTYPE html>', { pretendToBeVisual: true });
 
-    const { document, customElements, HTMLElement } = window;
-    originalEnvironment = {
-        document: globalThis.document,
-        customElements: globalThis.customElements,
-        HTMLElement: globalThis.HTMLElement,
-        ShadowRoot: globalThis.ShadowRoot,
-    };
-    globalThis.document = document;
-    globalThis.customElements = customElements;
-    globalThis.HTMLElement = HTMLElement;
-    globalThis.ShadowRoot = window.ShadowRoot || class ShadowRoot {}; // Fallback for JSDOM
 
     class TestComponent extends HTMLElement {
         constructor() {
             super();
-            this.attachShadow({ mode: 'open' });
+            this.attachShadow({mode: 'open'});
         }
     }
 
@@ -35,12 +21,16 @@ function setupTestEnvironment() {
 }
 
 function cleanupTestEnvironment() {
-    Object.assign(globalThis, originalEnvironment);
+    let mocks = document.getElementById('mocks');
+    mocks.innerHTML = "";
 }
 
 describe('findElementWithIdUpwards', () => {
-    before(() => {
-        setupTestEnvironment();
+    before((done) => {
+        initJSDOM().then(() => {
+            setupTestEnvironment();
+            done()
+        });
     });
 
     after(() => {
@@ -49,17 +39,18 @@ describe('findElementWithIdUpwards', () => {
 
     beforeEach(() => {
         // Set up the DOM
-        document.body.innerHTML = `
-      <div id="container">
+
+        let mocks = document.getElementById('mocks');
+        mocks.innerHTML = `
+            <div id="container">
         <div id="parent">
           <div id="child"></div>
         </div>
-      </div>
-    `;
+      </div>`;
 
         const shadowHost = document.createElement('div');
         document.body.appendChild(shadowHost);
-        const shadowRoot = shadowHost.attachShadow({ mode: 'open' });
+        const shadowRoot = shadowHost.attachShadow({mode: 'open'});
         const innerElement = document.createElement('div');
         innerElement.id = 'inner';
         shadowRoot.appendChild(innerElement);

package/test/cases/dom/slotted-nodes.mjs

@@ -0,0 +1,14 @@
+import {expect} from 'chai';
+import {getSlottedNodes} from "../../../../application/source/dom/slotted.mjs";
+
+
+describe('getSlottedNodes', () => {
+
+
+    it('should return an empty Set if there is no ShadowRoot', () => {
+        expect(getSlottedNodes).is.a('function');
+    });
+
+
+});
+

package/test/cases/monster.mjs

@@ -7,7 +7,7 @@ describe('Monster', function () {
         let monsterVersion
 
         /** don´t touch, replaced by make with package.json version */
-        monsterVersion = new Version("3.31.1")
+        monsterVersion = new Version("3.33.0")
 
         let m = getMonsterVersion();
 

package/test/util/chai-dom.mjs

@@ -15,10 +15,10 @@
  **********/
 
 export function chaiDom(chai, utils) {
-    var flag = utils.flag,
+    let flag = utils.flag,
 
         elToString = function(el) {
-            var desc
+            let desc
             if (isNodeList(el)) {
                 if (el.length === 0) return 'empty NodeList'
                 desc = Array.prototype.slice.call(el, 0, 5).map(elToString).join(', ')

package/test/web/import.js

@@ -6,6 +6,8 @@ import "../cases/logging/logentry.mjs";
 import "../cases/logging/handler/console.mjs";
 import "../cases/logging/handler.mjs";
 import "../cases/text/formatter.mjs";
+import "../cases/text/util.mjs";
+import "../cases/dom/slotted-nodes.mjs";
 import "../cases/dom/resource/link/stylesheet.mjs";
 import "../cases/dom/resource/data.mjs";
 import "../cases/dom/resource/link.mjs";
@@ -17,6 +19,7 @@ import "../cases/dom/theme.mjs";
 import "../cases/dom/resource.mjs";
 import "../cases/dom/resourcemanager.mjs";
 import "../cases/dom/util.mjs";
+import "../cases/dom/find.mjs";
 import "../cases/dom/customelement.mjs";
 import "../cases/dom/attributes.mjs";
 import "../cases/dom/events.mjs";
@@ -40,6 +43,7 @@ import "../cases/types/randomid.mjs";
 import "../cases/types/observablequeue.mjs";
 import "../cases/types/uuid.mjs";
 import "../cases/types/observer.mjs";
+import "../cases/types/internal.mjs";
 import "../cases/types/tokenlist.mjs";
 import "../cases/types/queue.mjs";
 import "../cases/types/stack.mjs";
@@ -82,6 +86,7 @@ import "../cases/data/diff.mjs";
 import "../cases/data/datasource/server.mjs";
 import "../cases/data/datasource/storage/sessionstorage.mjs";
 import "../cases/data/datasource/storage/localstorage.mjs";
+import "../cases/data/datasource/dom.mjs";
 import "../cases/data/datasource/server/restapi.mjs";
 import "../cases/data/datasource/server/websocket.mjs";
 import "../cases/math/random.mjs";

package/test/web/test.html

@@ -5,17 +5,17 @@
     <title>Mocha Monster</title>
     <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
     <link rel="stylesheet" href="mocha.css"/>
-   <script id="polyfill" src="https://polyfill.io/v3/polyfill.min.js?features=Array.from,Array.isArray,Array.prototype.entries,Array.prototype.fill,Array.prototype.filter,Array.prototype.forEach,Array.prototype.indexOf,Array.prototype.keys,Array.prototype.lastIndexOf,Array.prototype.map,Array.prototype.reduce,Array.prototype.sort,ArrayBuffer,atob,Blob,CustomEvent,DataView,document,Document,DocumentFragment,Element,Event,fetch,globalThis,HTMLDocument,HTMLTemplateElement,Intl,JSON,Map,Math.log2,Number.isInteger,Object.assign,Object.defineProperty,Object.entries,Object.freeze,Object.getOwnPropertyDescriptor,Object.getOwnPropertyNames,Object.getPrototypeOf,Object.keys,Promise,Reflect,Reflect.defineProperty,Reflect.get,Reflect.getOwnPropertyDescriptor,Reflect.setPrototypeOf,Set,String.prototype.endsWith,String.prototype.matchAll,String.prototype.padStart,String.prototype.startsWith,String.prototype.trim,Symbol,Symbol.for,Symbol.hasInstance,Symbol.iterator,Uint16Array,Uint8Array,URL,WeakMap,WeakSet"
+   <script id="polyfill" src="https://polyfill.io/v3/polyfill.min.js?features=Array.from,Array.isArray,Array.prototype.entries,Array.prototype.fill,Array.prototype.filter,Array.prototype.forEach,Array.prototype.includes,Array.prototype.indexOf,Array.prototype.keys,Array.prototype.lastIndexOf,Array.prototype.map,Array.prototype.reduce,Array.prototype.sort,ArrayBuffer,atob,Blob,CustomEvent,DataView,document,Document,DocumentFragment,Element,Event,fetch,globalThis,HTMLDocument,HTMLTemplateElement,Intl,JSON,Map,Math.log2,Number.isInteger,Object.assign,Object.defineProperty,Object.entries,Object.freeze,Object.getOwnPropertyDescriptor,Object.getOwnPropertyNames,Object.getPrototypeOf,Object.keys,Promise,Reflect,Reflect.defineProperty,Reflect.get,Reflect.getOwnPropertyDescriptor,Reflect.setPrototypeOf,Set,String.prototype.endsWith,String.prototype.includes,String.prototype.matchAll,String.prototype.padStart,String.prototype.startsWith,String.prototype.trim,Symbol,Symbol.for,Symbol.hasInstance,Symbol.iterator,Uint16Array,Uint8Array,URL,WeakMap,WeakSet"
             src="https://polyfill.io/v3/polyfill.min.js?features=Array.from,Array.isArray,Array.prototype.entries,Array.prototype.fill,Array.prototype.forEach,Array.prototype.indexOf,Array.prototype.keys,Array.prototype.lastIndexOf,Array.prototype.map,Array.prototype.reduce,Array.prototype.sort,ArrayBuffer,atob,DataView,document,DocumentFragment,Element,Event,globalThis,HTMLDocument,HTMLTemplateElement,JSON,Map,Math.log2,Number.isInteger,Object.assign,Object.defineProperty,Object.entries,Object.getOwnPropertyDescriptor,Object.getPrototypeOf,Object.keys,Promise,Reflect,Reflect.defineProperty,Reflect.get,Reflect.getOwnPropertyDescriptor,Reflect.setPrototypeOf,Set,String.prototype.endsWith,String.prototype.matchAll,String.prototype.padStart,String.prototype.startsWith,String.prototype.trim,Symbol,Symbol.iterator,WeakMap,WeakSet"
             crossorigin="anonymous"
             referrerpolicy="no-referrer"></script>
-    <script src="https://cdn.jsdelivr.net/npm/element-internals-polyfill@0.1.52/dist/index.min.mjs"></script>
+    <script src="https://cdn.jsdelivr.net/npm/element-internals-polyfill"></script>
 
 </head>
 <body>
 <div id="headline" style="display: flex;align-items: center;justify-content: center;flex-direction: column;">
-  <h1 style='margin-bottom: 0.1em;'>Monster 3.8.0</h1>
-  <div id="lastupdate" style='font-size:0.7em'>last update Do 2. Feb 11:38:37 CET 2023</div>
+  <h1 style='margin-bottom: 0.1em;'>Monster 3.32.0</h1>
+  <div id="lastupdate" style='font-size:0.7em'>last update So 26. Mär 17:02:25 CEST 2023</div>
 </div>
 <div id="mocks"></div>
 <div id="mocha"></div>