mount-observer 0.0.2 → 0.0.3

package/MountObserver.js

@@ -12,7 +12,12 @@ export class MountObserver extends EventTarget {
     constructor(init) {
         super();
         const { match, whereElementIntersectsWith, whereMediaMatches } = init;
-        this.#isComplex = match !== undefined && (match.includes(' ') || match.includes(':'));
+        let isComplex = false;
+        if (match !== undefined) {
+            const reducedMatch = match.replaceAll(':not(', '');
+            isComplex = reducedMatch.includes(' ') || reducedMatch.includes(':');
+        }
+        this.#isComplex = isComplex;
         if (whereElementIntersectsWith || whereMediaMatches)
             throw 'NI'; //not implemented
         this.#mountInit = init;
@@ -58,7 +63,7 @@ export class MountObserver extends EventTarget {
             const doDisconnect = this.#mountInit.do?.onDisconnect;
             for (const mutationRecord of mutationRecords) {
                 const { addedNodes, type, removedNodes } = mutationRecord;
-                console.log(mutationRecord);
+                //console.log(mutationRecord);
                 const addedElements = Array.from(addedNodes).filter(x => x instanceof Element);
                 addedElements.forEach(x => elsToInspect.push(x));
                 if (type === 'attributes') {

package/MountObserver.ts

@@ -20,7 +20,12 @@ export class MountObserver extends EventTarget implements MountContext{
     constructor(init: MountInit){
         super();
         const {match, whereElementIntersectsWith, whereMediaMatches} = init;
-        this.#isComplex = match !== undefined && (match.includes(' ') || match.includes(':'));
+        let isComplex = false;
+        if(match !== undefined){
+            const reducedMatch = match.replaceAll(':not(', '');
+            isComplex = reducedMatch.includes(' ') || reducedMatch.includes(':');
+        }
+        this.#isComplex = isComplex;
         if(whereElementIntersectsWith || whereMediaMatches) throw 'NI'; //not implemented
         this.#mountInit = init;
         this.#abortController = new AbortController();
@@ -65,7 +70,7 @@ export class MountObserver extends EventTarget implements MountContext{
             const doDisconnect = this.#mountInit.do?.onDisconnect;
             for(const mutationRecord of mutationRecords){
                 const {addedNodes, type, removedNodes} = mutationRecord;
-                console.log(mutationRecord);
+                //console.log(mutationRecord);
                 const addedElements = Array.from(addedNodes).filter(x => x instanceof Element) as Array<Element>;
                 addedElements.forEach(x => elsToInspect.push(x));
                 if(type === 'attributes'){

package/README.md

@@ -183,6 +183,34 @@ If an element that is in "mounted" state according to a MountObserver instance i
 
 Extra support is provided for monitoring attributes.
 
+Example:
+
+```html
+<div id=div>
+   <span id=span></span>
+</div>
+<script type=module>
+   import {MountObserver} from '../MountObserver.js';
+   const mo = new MountObserver({
+      match: '#span',
+      attribMatches:[
+         {
+            names: ['test-1']
+         }
+      ]
+   });
+   mo.addEventListener('attr-change', e => {
+      console.log(e);
+   });
+   mo.observe(div);
+   setTimeout(() => {
+      span.setAttribute('test-1', 'hello')
+   }, 1000);
+</script>
+```
+
+
+
 ## Preemptive downloading
 
 There are two significant steps to imports, each of which imposes a cost:  

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mount-observer",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "description": "",
   "main": "MountObserver.js",
   "module": "MountObserver.js",

package/tests/test6.html

@@ -18,13 +18,7 @@
                 {
                     names: ['test-1']
                 }
-            ],
-            do:{
-                onDisconnect: (el, ctx) => {
-                    console.log({el, ctx});
-                    
-                }
-            }
+            ]
         });
         mo.addEventListener('attr-change', e => {
             console.log(e);