@schukai/monster 3.96.0 → 3.96.2

package/test/cases/components/form/toggle-switch.mjs

@@ -1,7 +1,7 @@
-import { getGlobal } from "../../../../source/types/global.mjs";
+import {getGlobal} from "../../../../source/types/global.mjs";
 import * as chai from 'chai';
-import { chaiDom } from "../../../util/chai-dom.mjs";
-import { initJSDOM } from "../../../util/jsdom.mjs";
+import {chaiDom} from "../../../util/chai-dom.mjs";
+import {initJSDOM} from "../../../util/jsdom.mjs";
 
 let expect = chai.expect;
 chai.use(chaiDom);
@@ -91,21 +91,24 @@ describe('ToggleSwitch', function () {
         it('toggle to on', function () {
 
             const toggleSwitch = document.createElement('monster-toggle-switch');
-            toggleSwitch.setOption('actions.on', 'true');
-            toggleSwitch.setOption('actions.off', 'false');
+            toggleSwitch.setOption('values.on', 'true');
+            toggleSwitch.setOption('values.off', 'false');
 
-            expect(toggleSwitch.value).is.equal('off');
-            expect(toggleSwitch.state).is.equal('off');
+            toggleSwitch.value = "true";
+
+            expect("true").is.equal(toggleSwitch.value);
+            expect("on").is.equal(toggleSwitch.state);
 
             toggleSwitch.toggle();
 
-            expect(toggleSwitch.value).is.equal('on');
-            expect(toggleSwitch.state).is.equal('on');
+            expect("false").is.equal(toggleSwitch.value);
+            expect("off").is.equal(toggleSwitch.state);
 
             toggleSwitch.toggle();
 
-            expect(toggleSwitch.value).is.equal('off');
-            expect(toggleSwitch.state).is.equal('off');
+            expect("true").is.equal(toggleSwitch.value);
+            expect("on").is.equal(toggleSwitch.state);
+
         });
 
         it('toggle on to off', function () {
@@ -156,37 +159,46 @@ describe('ToggleSwitch', function () {
              */
             document.getElementById('mocks').appendChild(toggleSwitch);
 
-            /**
-             * expect that classes.on is set to Element Switch
-             */
-            let hasClassA = toggleSwitch.shadowRoot.querySelectorAll('[data-monster-role="switch"]')[0].classList.contains(toggleSwitch.getOption('classes.on'));
-            expect(hasClassA).is.true;
-
-            /**
-            * switch off
-            */
-            toggleSwitch.value = "off";
-
             /**
              * Updater prozess runs in setTimeout
              * self[internalSymbol].attachObserver();
              */
             setTimeout(() => {
-                
-                /**
-                * expect that classes.on is removed from Element Switch
-                */
-                let hasClassB  = toggleSwitch.shadowRoot.querySelectorAll('[data-monster-role="switch"]')[0].classList.contains(toggleSwitch.getOption('classes.on'));
-                expect(hasClassB).is.false;
 
-                /**
-                * expect that classes.off is set to Element Switch
-                */
-                let hasClassC  = toggleSwitch.shadowRoot.querySelectorAll('[data-monster-role="switch"]')[0].classList.contains(toggleSwitch.getOption('classes.off'));
-                expect(hasClassC).is.true;    
+                window.requestAnimationFrame(() => {
+
+                    /**
+                     * expect that classes.on is set to Element Switch
+                     */
+                    let hasClassA = toggleSwitch.shadowRoot.querySelectorAll('[data-monster-role="switch"]')[0].classList.contains(toggleSwitch.getOption('classes.on'));
+
+
+                    expect(hasClassA).is.true;
+
+                    /**
+                     * switch off
+                     */
+                    toggleSwitch.value = "off";
 
+                    window.requestAnimationFrame(() => {
+                        /**
+                         * expect that classes.on is removed from Element Switch
+                         */
+                        let hasClassB = toggleSwitch.shadowRoot.querySelectorAll('[data-monster-role="switch"]')[0].classList.contains(toggleSwitch.getOption('classes.on'));
+                        expect(hasClassB).is.false;
+
+                        /**
+                         * expect that classes.off is set to Element Switch
+                         */
+                        let hasClassC = toggleSwitch.shadowRoot.querySelectorAll('[data-monster-role="switch"]')[0].classList.contains(toggleSwitch.getOption('classes.off'));
+                        expect(hasClassC).is.true;
+
+
+                        done();
+                    });
+
+                });
 
-                done();
             }, 0);
 
         })
@@ -212,16 +224,18 @@ describe('ToggleSwitch', function () {
              * new Control
              */
             let toggleSwitch = document.createElement('monster-toggle-switch');
+            window.requestAnimationFrame(() => {
 
-            /**
-             * the switch is off and provides the value for off
-             */
-            expect(toggleSwitch.value).is.equal('off');
+                /**
+                 * the switch is off and provides the value for off
+                 */
+                expect(null).is.equal(toggleSwitch.value);
 
-            /**
-             * the switch is off
-             */
-            expect(toggleSwitch.state).is.equal('off');
+                /**
+                 * the switch is off
+                 */
+                expect(toggleSwitch.state).is.equal('off');
+            });
 
         });
 
@@ -240,31 +254,33 @@ describe('ToggleSwitch', function () {
              */
             toggleSwitch.value = "test";
 
-            /**
-             * the switch is off and provides the value for off
-             */
-            expect(toggleSwitch.value).is.equal('false');
+            window.requestAnimationFrame(() => {
 
-            /**
-             * the switch is off
-             */
-            expect(toggleSwitch.state).is.equal('off');
+                /**
+                 * the switch is off and provides the value for off
+                 */
+                expect(null).is.equal(toggleSwitch.value);
 
-            /**
-            * disabled attribute is only set when the element has been mounted in the DOM
-            */
-            expect(toggleSwitch.hasAttribute('disabled')).is.false;
+                /**
+                 * the switch is off
+                 */
+                expect(toggleSwitch.state).is.equal('off');
 
-            /**
-             * insert DOM
-             */
-            document.getElementById('mocks').appendChild(toggleSwitch);
+                /**
+                 * disabled attribute is only set when the element has been mounted in the DOM
+                 */
+                expect(toggleSwitch.hasAttribute('disabled')).is.false;
 
-            /**
-            * now the element is disabled
-            */
-            expect(toggleSwitch.hasAttribute('disabled')).is.true;
+                /**
+                 * insert DOM
+                 */
+                document.getElementById('mocks').appendChild(toggleSwitch);
 
+                /**
+                 * now the element is disabled
+                 */
+                expect(toggleSwitch.hasAttribute('disabled')).is.false;
+            });
 
         });
 
@@ -294,8 +310,8 @@ describe('ToggleSwitch', function () {
             expect(toggleSwitch.state).is.equal('on');
 
             /**
-            * insert DOM
-            */
+             * insert DOM
+             */
             document.getElementById('mocks').appendChild(toggleSwitch);
 
             /**
@@ -308,5 +324,4 @@ describe('ToggleSwitch', 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.95.2")
+        monsterVersion = new Version("3.96.1")
 
         let m = getMonsterVersion();
 

package/test/web/test.html

@@ -9,8 +9,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 3.95.2</h1>
-  <div id="lastupdate" style='font-size:0.7em'>last update So 29. Dez 11:41:55 CET 2024</div>
+  <h1 style='margin-bottom: 0.1em;'>Monster 3.96.1</h1>
+  <div id="lastupdate" style='font-size:0.7em'>last update Di 31. Dez 23:30:20 CET 2024</div>
 </div>
 <div id="mocha-errors"
      style="color: red;font-weight: bold;display: flex;align-items: center;justify-content: center;flex-direction: column;margin:20px;"></div>