@schukai/monster 1.28.1 → 1.29.3

package/test/cases/dom/customelement.js

@@ -17,14 +17,12 @@ let html1 = `
 `;
 
 
-
 describe('DOM', function () {
 
     let CustomElement, registerCustomElement, TestComponent, document, TestComponent2;
 
     describe('CustomElement()', function () {
 
-
         before(function (done) {
             initJSDOM().then(() => {
 
@@ -209,6 +207,219 @@ describe('DOM', function () {
             })
         })
 
+        /**
+         * @link https://gitlab.schukai.com/oss/libraries/javascript/monster/-/issues/113
+         */
+        describe('Assign CSSStyle as Array with wrong type', function () {
+
+            const htmlTAG = 'monster-testclass-x1';
+
+            let mocks, TestComponentX1;
+            beforeEach(() => {
+
+                mocks = document.getElementById('mocks');
+                mocks.innerHTML = html1;
+
+
+                TestComponentX1 = class extends CustomElement {
+                    static getTag() {
+                        return htmlTAG
+                    }
+
+                    static getCSSStyleSheet() {
+                        return [true];
+                    }
+
+                    /**
+                     * @return {Object}
+                     */
+                    get defaults() {
+
+                        return Object.assign({}, super.defaults, {
+                            templates: {
+                                main: '<h1>test</h1>'
+                            },
+                        })
+                    }
+
+                }
+
+                registerCustomElement(TestComponentX1)
+
+
+            })
+
+            it(htmlTAG + " should throw Exception", function (done) {
+                let d = document.createElement(htmlTAG);
+
+                let div = document.getElementById('test1');
+                div.append(d);
+
+
+                expect(div).contain.html('data-monster-error="TypeError: value is not an instance of CSSStyleSheet"');
+                done();
+
+            })
+
+
+        })
+
+
+        /**
+         * @link https://gitlab.schukai.com/oss/libraries/javascript/monster/-/issues/113
+         */
+        describe('Assign CSSStyle as Array and CSSStylesheet', function () {
+
+            const htmlTAG = 'monster-testclass-x113-2';
+
+            let mocks, TestComponentX113X2;
+            beforeEach(() => {
+
+                mocks = document.getElementById('mocks');
+                mocks.innerHTML = html1;
+
+                TestComponentX113X2 = class extends CustomElement {
+                    static getTag() {
+                        return htmlTAG
+                    }
+
+                    /**
+                     * @return {Object}
+                     */
+                    get defaults() {
+                        return Object.assign({}, super.defaults, {
+                            templates: {main: '<h1>test</h1>'},
+                        })
+                    }
+
+
+                    static getCSSStyleSheet() {
+
+                        const s = (new CSSStyleSheet())
+                        s.insertRule('a { color : red}');
+
+                        return [s];
+                    }
+                }
+
+                registerCustomElement(TestComponentX113X2)
+
+
+            })
+
+            it(htmlTAG + " should throw Exception 2", function (done) {
+                let d = document.createElement(htmlTAG);
+
+                let div = document.getElementById('test1');
+                div.append(d);
+
+                expect(d.shadowRoot.innerHTML).is.eq('<h1>test</h1>');
+                done();
+
+            })
+        })
+
+        /**
+         * @link https://gitlab.schukai.com/oss/libraries/javascript/monster/-/issues/113
+         */
+        describe('Assign CSSStyle as Array and CSS as string', function () {
+
+            const htmlTAG = 'monster-testclass-x113-21';
+
+            let mocks, TestComponentX113X22;
+            beforeEach(() => {
+
+                mocks = document.getElementById('mocks');
+                mocks.innerHTML = html1;
+
+                TestComponentX113X22 = class extends CustomElement {
+                    static getTag() {
+                        return htmlTAG
+                    }
+
+                    /**
+                     * @return {Object}
+                     */
+                    get defaults() {
+                        return Object.assign({}, super.defaults, {
+                            templates: {main: '<h1>test</h1>'},
+                        })
+                    }
+
+
+                    static getCSSStyleSheet() {
+                        return 'a { color:red }';
+                    }
+                }
+
+                registerCustomElement(TestComponentX113X22)
+
+
+            })
+
+            it(htmlTAG + " should eq <style>a { color:red }</style><h1>test</h1>", function (done) {
+                let d = document.createElement(htmlTAG);
+
+                let div = document.getElementById('test1');
+                div.append(d);
+
+
+                expect(d.shadowRoot.innerHTML).is.eq('<style>a { color:red }</style><h1>test</h1>');
+                done();
+
+            })
+        })
+        /**
+         * @link https://gitlab.schukai.com/oss/libraries/javascript/monster/-/issues/113
+         */
+        describe('Assign CSSStyle as Array and CSS as string', function () {
+
+            const htmlTAG = 'monster-testclass-x113-22';
+
+            let mocks, TestComponentX113X223;
+            beforeEach(() => {
+
+                mocks = document.getElementById('mocks');
+                mocks.innerHTML = html1;
+
+                TestComponentX113X223 = class extends CustomElement {
+                    static getTag() {
+                        return htmlTAG
+                    }
+
+                    /**
+                     * @return {Object}
+                     */
+                    get defaults() {
+                        return Object.assign({}, super.defaults, {
+                            templates: {main: '<h1>test</h1>'},
+                        })
+                    }
+
+
+                    static getCSSStyleSheet() {
+                        return ['a { color:red }'];
+                    }
+                }
+
+                registerCustomElement(TestComponentX113X223)
+
+
+            })
+
+            it(htmlTAG + " should eq <style>a { color:red }</style><h1>test</h1>", function (done) {
+                let d = document.createElement(htmlTAG);
+
+                let div = document.getElementById('test1');
+                div.append(d);
+
+
+                expect(d.shadowRoot.innerHTML).is.eq('<style>a { color:red }</style><h1>test</h1>');
+                done();
+
+            })
+        })
+
         describe('hasNode()', function () {
 
             let mocks;
@@ -217,7 +428,6 @@ describe('DOM', function () {
                 mocks = document.getElementById('mocks');
                 mocks.innerHTML = html1;
 
-
             })
 
             it("hasNode monster-testclass should return ...", function () {

package/test/cases/dom/resource/link.js

@@ -12,15 +12,10 @@ let expect = chai.expect;
 
 chai.use(chaiDom);
 
-let html1 = `
-
-`;
 
 
 describe('Link', function () {
 
-    let mutationobserver, addedNodes=[];
-
     before(function (done) {
         initJSDOM().then(() => {
             done()
@@ -36,6 +31,8 @@ describe('Link', function () {
     })
 
     describe('Link()', function () {
+        this.timeout(5000);
+
         it('connect().available()', function (done) {
 
             const link = new Link({
@@ -51,6 +48,7 @@ describe('Link', function () {
     });
 
     describe('External Link', () => {
+        this.timeout(5000);
 
         let id = new ID('link').toString();
         let link, url = 'https://monsterjs.org/assets/empty.css?' + id;

package/test/cases/dom/updater.js

@@ -664,7 +664,7 @@ describe('DOM', function () {
 
     describe('manuel update', function () {
         let id, mocks;
-        
+
         beforeEach(() => {
             mocks = document.getElementById('mocks');
             id = new ID('monster').toString();
@@ -677,10 +677,10 @@ describe('DOM', function () {
 
         it('should get value', function () {
 
-            document.getElementById(id).value="hello";
+            document.getElementById(id).value = "hello";
             const updater = new Updater(mocks);
             const subject = updater.getSubject();
-            
+
             expect(subject).to.not.have.property('myvalue');
             updater.retrieve();
             expect(subject).to.have.property('myvalue');
@@ -688,4 +688,77 @@ describe('DOM', function () {
 
 
     });
+
+
+    /**
+     * https://gitlab.schukai.com/oss/libraries/javascript/monster/-/issues/112
+     */
+    describe('Updater() 20220107', function () {
+
+        beforeEach(() => {
+            let mocks = document.getElementById('mocks');
+            // language=HTML
+            mocks.innerHTML = `
+
+                <div id="container">
+                    <div data-monster-replace="path:content"></div>
+                </div>
+
+
+            `;
+        })
+
+        describe('Bugfix #112', function () {
+
+            it('should add ', function (done) {
+                let containerElement = document.getElementById('container');
+                let newElement = document.createElement('div');
+                newElement.innerHTML = 'yeah! <b>Test</b>!';
+
+                const containerHTML = containerElement.innerHTML;
+                const newHTML = newElement.innerHTML;
+
+                let d = new Updater(
+                    containerElement,
+                    {
+                        content: newElement
+                    }
+                );
+                setTimeout(() => {
+                    d.run().then(() => {
+                        try {
+                            expect(containerElement).contain.html('<div>yeah! <b>Test</b>!</div>');
+                        } catch (e) {
+                            return done(e);
+                        }
+
+
+                        done()
+                    })
+                }, 100)
+
+                // d.setCallback('myformatter', function (a) {
+                //     return a + 'yes!'
+                // })
+                //
+                // setTimeout(() => {
+                //     d.run().then(() => {
+                //
+                //         expect(typeof d).is.equal('object');
+                //         expect(element).contain.html('<div data-monster-replace="path:text | tolower">hallo</div>');
+                //         expect(element).contain.html('<div data-monster-replace="path:text | call:myformatter">HALLOyes!</div>');
+                //         expect(element).contain.html('<div data-monster-replace="static:hello\\ ">hello </div>');
+                //
+                //         return done();
+                //     }).catch(
+                //         e => {
+                //             done(new Error(e))
+                //         })
+                // }, 100)
+
+            });
+        });
+    });
+
+
 });

package/test/cases/math/random.js

@@ -1,8 +1,11 @@
 /** nodejs doesnt support window.crypt */
 import {expect} from "chai"
+import {getGlobal} from "../../../source/types/global.js";
 import * as Crypto from "@peculiar/webcrypto";
 import {Monster, random} from "../../../source/math/random.js";
 
+const global = getGlobal();
+
 if (!global['crypto']) {
     global['crypto'] = new Crypto.Crypto();
 }

package/test/cases/monster.js

@@ -9,7 +9,7 @@ describe('Monster', function () {
         let monsterVersion
 
     /**#@+ dont touch, replaced by make with package.json version */
-    monsterVersion = new Version('1.28.1')
+    monsterVersion = new Version('1.29.3')
     /**#@-*/
 
         let m = Monster.getVersion();

package/test/cases/util/deadmansswitch.js

@@ -0,0 +1,71 @@
+import {DeadMansSwitch} from "../../../source/util/deadmansswitch.js";
+
+
+describe('DeadMansSwitch', function () {
+
+    describe('run instance', function () {
+
+        it('should run', function (done) {
+
+            const ms1 =  Date.now();
+
+            const deadmansswitch = new DeadMansSwitch(100, () => {
+
+                const ms2 =  Date.now();
+
+                const diff = ms2 - ms1;
+                if (diff < 100) {
+                    done('to short ' + diff);
+                    return;
+                }
+                done();
+            })
+
+
+        });
+    });
+
+    describe('run instance and touch', function () {
+
+        it('should run', function (done) {
+
+            const ms1 = Date.now();
+
+            const deadmansswitch = new DeadMansSwitch(100, () => {
+
+                const ms2 = Date.now();
+
+                const diff = ms2 - ms1;
+
+                if (ms1 > ms2) {
+                    done('timing error');
+                    return;
+                }
+
+                if (diff < 600) {
+                    done('to short ' + diff);
+                    return;
+                }
+                done();
+            })
+
+            //   0 ms: init() -> wait 100 ms 
+            //  50 ms: touch() -> wait 100 ms
+            //          -> wait 100
+            // 100 ms: touch(500) -> wait 500 ms
+            //          -> wait 500
+            // 600 ms: execute callback
+            setTimeout(() => {
+                deadmansswitch.touch()
+
+                setTimeout(() => {
+                    deadmansswitch.touch(500)
+                }, 50)
+
+            }, 50)
+
+
+        });
+    });
+
+});

package/test/web/import.js

@@ -57,6 +57,7 @@ import "../cases/constraint/invalid.js";
 import "../cases/constraint/oroperator.js";
 import "../cases/constraint/andoperator.js";
 import "../cases/constraint/isarray.js";
+import "../cases/util/deadmansswitch.js";
 import "../cases/util/comparator.js";
 import "../cases/util/trimspaces.js";
 import "../cases/util/clone.js";

package/test/web/monster-dev.html

@@ -10,13 +10,13 @@
             crossorigin="anonymous"
             referrerpolicy="no-referrer"></script>
 
-    <script src="https://monsterjs.org/dist/1.28.1/dist/monster.dev.js"></script>
+    <script src="https://monsterjs.org/dist/1.29.3/dist/monster.dev.js"></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 1.28.1</h1>
-  <div id="lastupdate" style='font-size:0.7em'>last update So 12. Dez 17:02:34 CET 2021</div>
+  <h1 style='margin-bottom: 0.1em;'>Monster 1.29.3</h1>
+  <div id="lastupdate" style='font-size:0.7em'>last update So 23. Jan 22:07:38 CET 2022</div>
 </div>
 </body>
 </html>

package/test/web/monster.html

@@ -14,8 +14,8 @@
 </head>
 <body>
 <div id="headline" style="display: flex;align-items: center;justify-content: center;flex-direction: column;">
-  <h1 style='margin-bottom: 0.1em;'>Monster 1.28.1</h1>
-  <div id="lastupdate" style='font-size:0.7em'>last update So 12. Dez 17:02:34 CET 2021</div>
+  <h1 style='margin-bottom: 0.1em;'>Monster 1.29.3</h1>
+  <div id="lastupdate" style='font-size:0.7em'>last update So 23. Jan 22:07:38 CET 2022</div>
 </div>
 </body>
 </html>

package/test/web/test.html

@@ -8,12 +8,13 @@
    <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,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.padStart,String.prototype.startsWith,String.prototype.trim,Symbol,Symbol.iterator,Uint16Array,Uint8Array,URL,WeakMap,WeakSet"
             crossorigin="anonymous"
             referrerpolicy="no-referrer"></script>
+   <script src="https://cdn.jsdelivr.net/npm/element-internals-polyfill@0.1.52/dist/index.min.js"></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 1.28.1</h1>
-  <div id="lastupdate" style='font-size:0.7em'>last update So 12. Dez 17:02:34 CET 2021</div>
+  <h1 style='margin-bottom: 0.1em;'>Monster 1.29.3</h1>
+  <div id="lastupdate" style='font-size:0.7em'>last update So 23. Jan 22:07:38 CET 2022</div>
 </div>
 <div id="mocks"></div>
 <div id="mocha"></div>