neo.mjs 6.12.1 → 6.14.0

package/src/worker/Data.mjs

@@ -109,6 +109,6 @@ class Data extends Base {
     }
 }
 
-let instance = Neo.applyClassConfig(Data);
+let instance = Neo.setupClass(Data);
 
 export default instance;

package/src/worker/Manager.mjs

@@ -6,12 +6,11 @@ import Observable         from '../core/Observable.mjs';
 import RemoteMethodAccess from './mixin/RemoteMethodAccess.mjs';
 
 const NeoConfig = Neo.config,
-      devMode   = NeoConfig.environment === 'development',
-      windowId  = new Date().getTime();
+      devMode   = NeoConfig.environment === 'development';
 
 /**
  * The worker manager lives inside the main thread and creates the App, Data & VDom worker.
- * Also responsible for sending messages from the main thread to the different workers.
+ * Also, responsible for sending messages from the main thread to the different workers.
  * @class Neo.worker.Manager
  * @extends Neo.core.Base
  * @singleton
@@ -72,6 +71,12 @@ class Manager extends Base {
          * @protected
          */
         webWorkersEnabled: false,
+        /**
+         * Using the current timestamp as an unique window identifier
+         * @member {Number} windowId=new Date().getTime()
+         * @protected
+         */
+        windowId: new Date().getTime(),
         /**
          * Contains the fileNames for the App, Data & Vdom workers
          * @member {Object} workers
@@ -87,6 +92,9 @@ class Manager extends Base {
             data: {
                 fileName: devMode ? 'Data.mjs'   : 'dataworker.js'
             },
+            task: {
+                fileName: devMode ? 'Task.mjs'   : 'taskworker.js'
+            },
             vdom: {
                 fileName: devMode ? 'VDom.mjs'   : 'vdomworker.js'
             }
@@ -124,7 +132,7 @@ class Manager extends Base {
             'message:readDom'           : {fn: DomAccess.onReadDom,            scope: DomAccess},
             'message:registerRemote'    : {fn: me.onRegisterRemote,            scope: me},
             'message:workerConstructed' : {fn: me.onWorkerConstructed,         scope: me}
-        });
+        })
     }
 
     /**
@@ -135,9 +143,10 @@ class Manager extends Base {
         Object.keys(this.workers).forEach(name => {
             if (!(
                 name === 'canvas' && !NeoConfig.useCanvasWorker ||
+                name === 'task'   && !NeoConfig.useTaskWorker   ||
                 name === 'vdom'   && !NeoConfig.useVdomWorker
             )) {
-                this.sendMessage(name, msg);
+                this.sendMessage(name, msg)
             }
         });
     }
@@ -163,16 +172,17 @@ class Manager extends Base {
 
         me.activeWorkers++;
 
-        return worker;
+        return worker
     }
 
     /**
      * Calls createWorker for each worker inside the this.workers config.
      */
     createWorkers() {
-        let me     = this,
-            config = Neo.clone(NeoConfig, true),
-            hash   = location.hash,
+        let me       = this,
+            config   = Neo.clone(NeoConfig, true),
+            hash     = location.hash,
+            windowId = me.windowId,
             key, value;
 
         // remove configs which are not relevant for the workers scope
@@ -182,7 +192,8 @@ class Manager extends Base {
         if (hash) {
             config.hash = {
                 hash      : DomEvents.parseHash(hash.substring(1)),
-                hashString: hash.substring(1)
+                hashString: hash.substring(1),
+                windowId  : me.windowId
             }
         }
 
@@ -193,17 +204,18 @@ class Manager extends Base {
 
         for ([key, value] of Object.entries(me.workers)) {
             if (key === 'canvas' && !config.useCanvasWorker ||
+                key === 'task'   && !config.useTaskWorker   ||
                 key === 'vdom'   && !config.useVdomWorker
             ) {
-                continue;
+                continue
             }
 
             try {
-                value.worker = me.createWorker(value);
+                value.worker = me.createWorker(value)
             } catch (e) {
                 document.body.innerHTML = e;
                 me.stopCommunication = true;
-                break;
+                break
             }
 
             me.sendMessage(key, {
@@ -223,13 +235,13 @@ class Manager extends Base {
         NeoConfig.hasTouchEvents = ('ontouchstart' in window) || (navigator.maxTouchPoints > 0);
 
         if (window.Worker) {
-            me.webWorkersEnabled = true;
+            me.webWorkersEnabled = true
         } else {
-            throw new Error('Your browser does not support Web Workers');
+            throw new Error('Your browser does not support Web Workers')
         }
 
         if (window.SharedWorker) {
-            me.sharedWorkersEnabled = true;
+            me.sharedWorkersEnabled = true
         }
     }
 
@@ -239,10 +251,10 @@ class Manager extends Base {
      */
     getWorker(name) {
         if (name === 'service') {
-            return navigator.serviceWorker?.controller || this.serviceWorker;
+            return navigator.serviceWorker?.controller || this.serviceWorker
         }
 
-        return name instanceof Worker ? name : this.workers[name].worker;
+        return name instanceof Worker ? name : this.workers[name].worker
     }
 
     /**
@@ -253,7 +265,7 @@ class Manager extends Base {
             action       : 'loadApplication',
             path,
             resourcesPath: NeoConfig.resourcesPath
-        });
+        })
     }
 
     /**
@@ -265,9 +277,9 @@ class Manager extends Base {
         me.constructedThreads++;
 
         if (me.constructedThreads === me.activeWorkers) {
-            NeoConfig.appPath && setTimeout(() => { // better save than sorry => all remotes need to be registered
+            NeoConfig.appPath && setTimeout(() => { // better safe than sorry => all remotes need to be registered
                 me.loadApplication(NeoConfig.appPath);
-            }, NeoConfig.loadApplicationDelay);
+            }, NeoConfig.loadApplicationDelay)
         }
     }
 
@@ -277,7 +289,7 @@ class Manager extends Base {
      */
     onWorkerError(e) {
         // starting a worker from a JS module will show JS errors in a correct way
-        !devMode && console.log('Worker Error:', e);
+        !devMode && console.log('Worker Error:', e)
     }
 
     /**
@@ -307,12 +319,12 @@ class Manager extends Base {
                     // we want to delay the message until the rendering queue has processed it
                     // see: https://github.com/neomjs/neo/issues/2864
                     me.promiseForwardMessage(data).then(msgData => {
-                        me.sendMessage(msgData.destination, msgData);
-                    });
+                        me.sendMessage(msgData.destination, msgData)
+                    })
                 }
             } else {
                 if (data.destination === 'main') {
-                    data = data.data;
+                    data = data.data
                 }
 
                 promise[data.reject ? 'reject' : 'resolve'](data);
@@ -322,7 +334,7 @@ class Manager extends Base {
 
         if (dest !== 'main' && action !== 'reply') {
             if (data.transfer) {
-                transfer = [data.transfer];
+                transfer = [data.transfer]
             }
 
             me.promiseMessage(dest, data, transfer).then(response => {
@@ -333,8 +345,8 @@ class Manager extends Base {
                     reject : true,
                     replyId: data.id,
                     error  : err.message
-                });
-            });
+                })
+            })
         }
 
         // only needed for SharedWorkers
@@ -344,11 +356,11 @@ class Manager extends Base {
             me.broadcast({
                 action : 'registerApp',
                 appName: data.appName
-            });
+            })
         }
 
         else if (dest === 'main' && action === 'remoteMethod') {
-            me.onRemoteMethod(data);
+            me.onRemoteMethod(data)
         }
     }
 
@@ -359,8 +371,8 @@ class Manager extends Base {
      */
     promiseForwardMessage(data) {
         return new Promise((resolve, reject) => {
-            this.promises[data.replyId] = { data, reject, resolve };
-        });
+            this.promises[data.replyId] = { data, reject, resolve }
+        })
     }
 
     /**
@@ -378,8 +390,8 @@ class Manager extends Base {
             let message = me.sendMessage(dest, opts, transfer),
                 msgId   = message.id;
 
-            me.promises[msgId] = { reject, resolve };
-        });
+            me.promises[msgId] = { reject, resolve }
+        })
     }
 
     /**
@@ -391,7 +403,7 @@ class Manager extends Base {
 
             if (promise) {
                 promise.resolve(promise.data);
-                delete this.promises[replyId];
+                delete this.promises[replyId]
             }
         }
     }
@@ -412,13 +424,13 @@ class Manager extends Base {
         if (!me.stopCommunication) {
             if (opts.channelPort) {
                 worker = opts.channelPort;
-                delete opts.channelPort;
+                delete opts.channelPort
             } else {
-                worker = me.getWorker(dest);
+                worker = me.getWorker(dest)
             }
 
             if (!worker) {
-                throw new Error('Called sendMessage for a worker that does not exist: ' + dest);
+                throw new Error('Called sendMessage for a worker that does not exist: ' + dest)
             }
 
             opts.destination = dest;
@@ -426,11 +438,11 @@ class Manager extends Base {
             message = new Message(opts);
 
             (worker.port ? worker.port : worker).postMessage(message, transfer);
-            return message;
+            return message
         }
     }
 }
 
-let instance = Neo.applyClassConfig(Manager);
+let instance = Neo.setupClass(Manager);
 
 export default instance;

package/src/worker/ServiceBase.mjs

@@ -388,6 +388,6 @@ class ServiceBase extends Base {
     }
 }
 
-Neo.applyClassConfig(ServiceBase);
+Neo.setupClass(ServiceBase);
 
 export default ServiceBase;

package/src/worker/Task.mjs

@@ -0,0 +1,67 @@
+import Neo       from '../Neo.mjs';
+import Base      from './Base.mjs';
+import * as core from '../core/_export.mjs';
+
+/**
+ * The Task worker can get filled with custom remote methods as needed.
+ * To activate it, set useTaskWorker to true inside your neo-config.json and add a task.mjs file as the entry point.
+ * @class Neo.worker.Task
+ * @extends Neo.worker.Base
+ * @singleton
+ */
+class Task extends Base {
+    static config = {
+        /**
+         * @member {String} className='Neo.worker.Task'
+         * @protected
+         */
+        className: 'Neo.worker.Task',
+        /**
+         * @member {Boolean} singleton=true
+         * @protected
+         */
+        singleton: true,
+        /**
+         * @member {String} workerId='task'
+         * @protected
+         */
+        workerId: 'task'
+    }
+
+    /**
+     *
+     */
+    afterConnect() {
+        let me             = this,
+            channel        = new MessageChannel(),
+            {port1, port2} = channel;
+
+        port1.onmessage = me.onMessage.bind(me);
+
+        me.sendMessage('app', {action: 'registerPort', transfer: port2}, [port2]);
+
+        me.channelPorts.app = port1
+    }
+
+    /**
+     * @param {Object} msg
+     */
+    onRegisterNeoConfig(msg) {
+        super.onRegisterNeoConfig(msg);
+
+        let path = Neo.config.appPath.slice(0, -8); // removing "/app.mjs"
+
+        import(
+            /* webpackInclude: /\/task.mjs$/ */
+            /* webpackExclude: /\/node_modules/ */
+            /* webpackMode: "lazy" */
+            `../../${path}/task.mjs`
+        ).then(module => {
+            module.onStart()
+        })
+    }
+}
+
+let instance = Neo.setupClass(Task);
+
+export default instance;

package/src/worker/VDom.mjs

@@ -43,6 +43,6 @@ class VDom extends Base {
     }
 }
 
-let instance = Neo.applyClassConfig(VDom);
+let instance = Neo.setupClass(VDom);
 
 export default instance;

package/src/worker/mixin/RemoteMethodAccess.mjs

@@ -146,6 +146,6 @@ class RemoteMethodAccess extends Base {
     }
 }
 
-Neo.applyClassConfig(RemoteMethodAccess);
+Neo.setupClass(RemoteMethodAccess);
 
 export default RemoteMethodAccess;

package/test/components/app.mjs

@@ -3,7 +3,7 @@
 
 import '../../src/button/Base.mjs';
 import '../../src/component/DateSelector.mjs';
+import '../../src/list/Chip.mjs';
 import '../../src/form/field/Select.mjs';
-import '../../src/list/Chip.mjs'
 
 export const onStart = () => Neo.app({name: 'AppEmpty'})

package/test/components/files/form/field/Select.mjs

@@ -35,7 +35,7 @@ StartTest(t => {
         return testId;
     }
 
-    // Clear the eway for each test
+    // Clear the way for each test
     t.beforeEach(async t => {
         if (testId) {
             await Neo.worker.App.destroyNeoInstance(testId);
@@ -202,22 +202,24 @@ StartTest(t => {
 
         await t.waitFor(100);
 
-        // Inputs must have been cleared. Both typeahead and filter.
-        t.isDeeply(t.query(`#${testId} input`).map(i => i.value), ['', '']);
+        // typeahead input must be cleared, forceSelection must pick the closest value onFocusLeave
+        // todo: add another test without forceSelection => Inputs must have been cleared. Both typeahead and filter.
+        t.isDeeply(t.query(`#${testId} input`).map(i => i.value), ['', 'Marshall Islands']);
 
         blurEl.remove();
     });
 
     t.it('With store as data', async t => {
         await setup({
-            labelText : 'Foo',
-            store     : ['Foo', 'Bar', 'Bletch']
+            labelText: 'Foo',
+            store    : ['Foo', 'Bar', 'Bletch']
         });
+
         await t.click('.neo-field-trigger.fa-caret-down');
 
         await t.waitForSelector('.neo-list-item:contains(Foo)');
 
-        // All data ityems represented
+        // All data items represented
         t.selectorCountIs('.neo-list-item', 3);
     });
 });

package/test/components/files/form/field/Text.mjs

@@ -0,0 +1,90 @@
+StartTest(t => {
+    let fieldComponent, inputField, testId;
+
+    async function setup(config = {}) {
+        testId = await Neo.worker.App.createNeoInstance(Neo.merge({
+            ntype     : 'textfield',
+            labelText : 'My label',
+            labelWidth: 80,
+            width     : 300
+        }, config))
+
+        // Wait for input element to be present
+        await t.waitForSelector(`#${testId} input.neo-textfield-input`);
+
+        // Grab input element
+        inputField = t.query(`#${testId} input.neo-textfield-input`)[0];
+
+        fieldComponent = document.getElementById(testId);
+
+        return testId;
+    }
+
+    // Clear the way for each test
+    t.beforeEach(async t => {
+        if (testId) {
+            await Neo.worker.App.destroyNeoInstance(testId);
+            fieldComponent = testId = null;
+        }
+    });
+
+    t.it('Check isTouched on focusLeave', async t => {
+        await setup({value: 'Hello World!'});
+        t.is(inputField.value, 'Hello World!');
+        t.hasNotCls(fieldComponent, 'neo-is-touched');
+        t.click(inputField);
+
+        t.diag('Clicked into the input field');
+        const blurEl = document.createElement('input');
+        document.body.appendChild(blurEl);
+        await t.waitFor(50);
+        await t.click(blurEl);
+
+        t.diag('Clicked into the blur element');
+        await t.waitForSelector('.neo-is-touched');
+        t.hasCls(fieldComponent, 'neo-is-touched');
+        blurEl.remove();
+    });
+
+    t.it('Check isTouched on focusEnter', async t => {
+        await setup({isTouchedEvent: 'focusEnter', value: 'Hello World!'});
+        t.is(inputField.value, 'Hello World!');
+        t.hasNotCls(fieldComponent, 'neo-is-touched');
+        await t.click(inputField);
+        t.diag('Clicked into the input field');
+        t.hasCls(fieldComponent, 'neo-is-touched');
+    });
+
+    t.it('Check isTouched set initially', async t => {
+        await setup({isTouched: true, value: 'Hello World!'});
+        t.is(inputField.value, 'Hello World!');
+        t.hasCls(fieldComponent, 'neo-is-touched');
+    });
+
+    t.it('Label Positions', async t => {
+        t.diag('left');
+        await setup({});
+        let label = t.query(`.neo-textfield-label`)[0];
+        t.isInView(label);
+
+        t.diag('top');
+        await Neo.worker.App.setConfigs({id: testId, labelPosition: 'top'});
+        await t.waitFor(50);
+        t.hasCls(fieldComponent, 'label-top');
+
+        t.diag('bottom');
+        await Neo.worker.App.setConfigs({id: testId, labelPosition: 'bottom'});
+        await t.waitFor(50);
+        t.hasCls(fieldComponent, 'label-bottom');
+
+        t.diag('right');
+        await Neo.worker.App.setConfigs({id: testId, labelPosition: 'right'});
+        await t.waitFor(50);
+        t.hasCls(fieldComponent, 'label-right');
+
+        t.diag('inline');
+        await Neo.worker.App.setConfigs({id: testId, labelPosition: 'inline'});
+        await t.waitFor(50);
+        t.hasCls(fieldComponent, 'label-inline');
+    });
+});

package/test/components/files/{component/ChipList.mjs → list/Chip.mjs}

@@ -62,12 +62,12 @@ StartTest(t => {
                 }]
             }
         }, config));
-        
+
 
         return testId;
     }
 
-    // Clear the eway for each test
+    // Clear the way for each test
     t.beforeEach(async t => {
         if (testId) {
             await Neo.worker.App.destroyNeoInstance(testId);
@@ -80,7 +80,7 @@ StartTest(t => {
 
         // Click on the *item*, *not* the focusable chip.
         // We are testing that the Navigator directs focus to the focusable heart of the
-        // item - the Chip - which will then recieve focus and cause item activation.
+        // item - the Chip - which will then receive focus and cause item activation.
         await t.click('.neo-list-item', null, null, null, ['100%-1', 1]);
 
         // That should select and activate the clicked item.

package/test/components/siesta.js

@@ -67,31 +67,30 @@ project.configure({
     })
 });
 
-project.plan(
-    {
-        group: 'button',
+project.plan({
+    group: 'button',
+    items: [
+        'files/button/Base.mjs'
+    ]
+}, {
+    group: 'component',
+    items: [
+        'files/component/DateSelector.mjs'
+    ]
+}, {
+    group: 'form',
+    items: [{
+        group: 'field',
         items: [
-            'files/button/Base.mjs'
+            'files/form/field/Select.mjs',
+            'files/form/field/Text.mjs'
         ]
-    },
-    {
-        group: 'component',
-        items: [
-            'files/component/DateSelector.mjs',
-            'files/component/ChipList.mjs'
-        ]
-    },
-    {
-        group: 'form',
-        items: [
-            {
-                group: 'field',
-                items: [
-                    'files/form/field/Select.mjs'
-                ]
-            }
-        ]
-    }
-);
+    }]
+}, {
+    group: 'list',
+    items: [
+        'files/list/Chip.mjs'
+    ]
+});
 
 project.start();