@webqit/oohtml 4.3.8 → 4.3.10

package/package.json

@@ -14,7 +14,7 @@
     "wicg-proposal"
   ],
   "homepage": "https://webqit.io/tooling/oohtml",
-  "version": "4.3.8",
+  "version": "4.3.10",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -40,7 +40,7 @@
   },
   "dependencies": {
     "@webqit/quantum-js": "^4.5.26",
-    "@webqit/realdom": "^2.1.32",
+    "@webqit/realdom": "^2.1.33",
     "@webqit/util": "^0.8.11"
   },
   "devDependencies": {

package/src/html-imports/HTMLImportsContext.js

@@ -22,9 +22,9 @@ export default class HTMLImportsContext extends DOMContext {
             request.detail = detail;
             request.targetContext = Infinity;
         } else if ( detail?.startsWith( '@' ) ) {
-            const [ targetContext, ...detail ] = detail.slice( 1 ).split( /(?<=\w)(?=\/|#)/ ).map( s => s.trim() );
+            const [ targetContext, ..._detail ] = detail.slice( 1 ).split( /(?<=\w)(?=\/|#)/ ).map( s => s.trim() );
             request.targetContext = targetContext;
-            request.detail = detail.join( '' );
+            request.detail = _detail.join( '' );
         } else { request.detail = detail; }
         return request;
     }
@@ -33,38 +33,31 @@ export default class HTMLImportsContext extends DOMContext {
      * @localModules
      */
     get localModules() { return getDefs( this.host ); }
+    get inheritedModules() { return this.#inheritedModules; }
+    #inheritedModules = {};
 
     /**
      * @handle()
      */
+    
     handle( event ) {
         const { window: { webqit: { Observer } } } = env;
         // Any existing event.meta.controller? Abort!
         event.meta.controller?.abort();
-
         // Parse and translate detail
-        if ( ( event.detail || '' ).trim() === '/' ) return event.respondWith( this.localModules );
         let path = ( event.detail || '' ).split( /\/|(?<=\w)(?=#)/g ).map( x => x.trim() ).filter( x => x );
         if ( !path.length ) return event.respondWith();
-        path = path.join( `/${ this.configs.HTML_IMPORTS.api.defs }/` )?.split( '/' ) || [];
-
+        path = path.join( `/${ this.configs.HTML_IMPORTS.api.defs }/` )?.split( '/' ).map( x => x === '*' ? Infinity : x ) || [];
         // We'll now fulfill request
         const options = { live: event.live, signal: event.signal, descripted: true };
-        // Find a way to resolve request against two sources
-        event.meta.controller = Observer.reduce( this.localModules, path, Observer.get, ( result, { signal } = {} ) => {
-            const _result = Array.isArray( result ) ? result : result.value;
-            const _isValidLocalResult = Array.isArray( result ) ? result.length : result.value;
-            if ( !_isValidLocalResult && this.host.isConnected === false ) return; // Subtree is being disposed
-            if ( _isValidLocalResult || !this.contextModules ) {
-                event._isValidLocalResult = _isValidLocalResult;
-                return event.respondWith( _result );
-            }
-            // This superModules binding is automatically aborted by the injected control.signal; see below
-            return Observer.reduce( this.contextModules, path, Observer.get, result => {
-                event._currentSource = 'context';
-                return event.respondWith( Array.isArray( result ) ? result : result.value );
-            }, { ...options, signal } );
-        }, { lifecycleSignals: true, ...options } );
+        event.meta.controller = Observer.reduce( this.#modules, path, Observer.get, ( m ) => {
+            if ( Array.isArray( m ) ) {
+                // Paths with wildcard
+                for ( const n of m ) {
+                    event.respondWith( n );
+                }
+            } else event.respondWith( m.value );
+        }, options );
     }
 
     /**
@@ -73,49 +66,56 @@ export default class HTMLImportsContext extends DOMContext {
     unsubscribed( event ) { event.meta.controller?.abort(); }
 
     /**
-     * @startRealtime()
+     * @initialize()
      */
-    realtimeSources( host ) {
+    #modules;
+    #controller1;
+    #controller2;
+    initialize( host ) {
         this.host = host;
+        const { window: { webqit: { Observer } } } = env;
         // ----------------
-        const update = () => {
-            for ( const subscriptionEvent of this.subscriptions ) {
-                if ( subscriptionEvent._isValidLocalResult ) continue;
-                this.handle( subscriptionEvent );
+        // Observe local
+        this.#modules = { ...this.localModules };
+        this.#controller1?.abort();
+        this.#controller1 = Observer.observe( this.localModules, ( mutations ) => {
+            for ( const m of mutations ) {
+                if ( m.type === 'delete' ) {
+                    if ( this.inheritedModules && Observer.has( this.inheritedModules, m.key ) ) {
+                        Observer.set( this.#modules, m.key, Observer.get( this.inheritedModules, m.key ) );
+                    } else Observer.deleteProperty( this.#modules, m.key );
+                } else Observer.set( this.#modules, m.key, m.value );
             }
-        };
+        }, { timing: 'sync' } );
         // ----------------
-        const $config = this.configs.HTML_IMPORTS;
-        if ( !this.host.matches || !$config.attr.importscontext ) return;
-        // Any existing this.refdSourceController? Abort!
-        this.refdSourceController?.disconnect();
-        const realdom = this.host.ownerDocument.defaultView.webqit.realdom;
-        let prevRef;
-        this.refdSourceController = realdom.realtime( this.host ).attr( $config.attr.importscontext, ( record, { signal } ) => {
-            if (record.value === prevRef) return;
-            prevRef = record.value;
-            // No importscontext attr set. But we're still watching
-            if ( !record.value ) {
-                this.contextModules = undefined;
-                return update();
-            }
-            // This superModules contextrequest is automatically aborted by the injected signal below
-            const request = { ...this.constructor.createRequest( record.value.trim() ), live: true, signal, diff: true };
-            this.host.parentNode[ this.configs.CONTEXT_API.api.contexts ].request( request, response => {
-                this.contextModules = !( response && Object.getPrototypeOf( response ) ) ? response : getDefs( response );
-                update();
-            } );
-        }, { live: true, timing: 'sync', lifecycleSignals: true } );
-    }
-
-    /**
-     * @initialize()
-     */
-    initialize( host ) {
         // If host has importscontext attr, compute that
-        this.realtimeSources( host );
-        // Now, listen for contextrequest and contextclaim events
-        // And process own claim
+        const $config = this.configs.HTML_IMPORTS;
+        if ( this.host.matches && $config.attr.importscontext ) {
+            const realdom = this.host.ownerDocument.defaultView.webqit.realdom;
+            let prevRef;
+            this.#controller2?.disconnect();
+            this.#controller2 = realdom.realtime( this.host ).attr( $config.attr.importscontext, ( record, { signal } ) => { 
+                const moduleRef = ( record.value || '' ).trim();
+                if ( moduleRef === prevRef ) return;
+                prevRef = moduleRef;
+                // This superModules contextrequest is automatically aborted by the injected signal below
+                const request = { ...this.constructor.createRequest( moduleRef ? `${moduleRef}/*` : '*' ), live: true, signal, diff: true };
+                this.host.parentNode[ this.configs.CONTEXT_API.api.contexts ].request( request, ( m ) => {
+                    if ( m.type === 'delete' ) {
+                        Reflect.deleteProperty( this.inheritedModules, m.key );
+                        if ( !Observer.has( this.localModules, m.key ) ) {
+                            Observer.deleteProperty( this.#modules, m.key );
+                        }
+                    } else {
+                        Reflect.set( this.inheritedModules, m.key, m.value );
+                        if ( !Observer.has( this.localModules, m.key ) ) {
+                            Observer.set( this.#modules, m.key, m.value );
+                        }
+                    }
+                } );
+            }, { live: true, timing: 'sync', oldValue: true, lifecycleSignals: true } );
+        }
+        // ----------------
         return super.initialize( host );
     }
     
@@ -124,7 +124,8 @@ export default class HTMLImportsContext extends DOMContext {
      */
     dispose( host ) {
         // Stop listening for sources
-        this.refdSourceController?.disconnect();
+        this.#controller1?.abort();
+        this.#controller2?.disconnect();
         // Now, stop listening for contextrequest and contextclaim events
         // And relinquish own subscribers to owner context
         return super.dispose( host );

package/test/modules.test.js

@@ -186,6 +186,7 @@ describe(`HTML Modules`, function() {
             // -------
             scoped.remove();
             expect( defsObjs ).to.have.length( 3 );
+
             expect( defsObjs[ 2 ] ).to.have.property( 'scoped', false );
             // -------
             document.body.appendChild( scoped );