as-custom-element - npm Package Compare versions

Comparing version 0.1.5 to 0.2.0

cjs/index.js

 'use strict';
+const sdo = (m => m.__esModule ? /* istanbul ignore next */ m.default : /* istanbul ignore next */ m)(require('shared-document-observer'));
+
 const wm = new WeakMap;
+const {observer} = sdo;
 
-const attributeChanged = (records, mo) => {
+const attributeChanged = records => {
   for (let i = 0, {length} = records; i < length; i++) {
     const {target, attributeName, oldValue} = records[i];
-    change(wm.get(target).a.get(mo), target, attributeName, oldValue);
+    const newValue = target.getAttribute(attributeName);
+    wm.get(target).a[attributeName].forEach(attributeChangedCallback => {
+      attributeChangedCallback.call(target, attributeName, oldValue, newValue);
+    });
   }
 };
 
-const change = (attributeChangedCallback, target, attributeName, oldValue) => {
-  attributeChangedCallback.call(
-    target,
-    attributeName,
-    oldValue,
-    target.getAttribute(attributeName)
-  );
-};
-
-const fallback = () => {};
-
 const invoke = (nodes, key) => {
   for (let i = 0, {length} = nodes; i < length; i++) {
-    const target = nodes[i], info = wm.get(target);
-    if (info) {
-      if (key === 'd')
-        info.a.forEach(takeRecords);
-      info[key].forEach(call, target);
-    }
+    const target = nodes[i];
+    if (wm.has(target))
+      wm.get(target)[key].forEach(call, target);
     invoke(target.children || [], key);
@@ -38,2 +30,3 @@ }
     invoke(addedNodes, 'c');
+    attributeChanged(sao.takeRecords());
     invoke(removedNodes, 'd');
@@ -43,4 +36,6 @@ }
 
+const sao = new MutationObserver(attributeChanged);
+
 const set = target => {
-  const sets = {a: new Map, c: new Set, d: new Set};
+  const sets = {a: {}, c: new Set, d: new Set};
   wm.set(target, sets);
@@ -50,13 +45,4 @@ return sets;
 
-const takeRecords = (_, mo) => {
-  attributeChanged(mo.takeRecords(), mo);
-};
+sdo.add(mainLoop);
 
-const mo = new MutationObserver(mainLoop);
-
-mo.observe(
-  document,
-  {childList: true, subtree: true}
-);
-
 module.exports = (
@@ -73,25 +59,33 @@ target,
 ) => {
-  mainLoop(mo.takeRecords());
+  mainLoop(observer.takeRecords());
   const {a, c, d} = wm.get(target) || set(target);
   if (observedAttributes) {
-    const mo = new MutationObserver(attributeChanged);
-    mo.observe(target, {
+    sao.observe(target, {
       attributes: true,
-      attributeFilter: observedAttributes,
-      attributeOldValue: true
+      attributeOldValue: true,
+      attributeFilter: observedAttributes
     });
-    a.set(mo, attributeChangedCallback || fallback);
     observedAttributes.forEach(attributeName => {
+      (a[attributeName] || (a[attributeName] = new Set))
+        .add(attributeChangedCallback);
       if (target.hasAttribute(attributeName))
-        change(attributeChangedCallback || fallback, target, attributeName, null);
+        attributeChangedCallback.call(
+          target,
+          attributeName,
+          null,
+          target.getAttribute(attributeName)
+        );
     });
   }
-  c.add(connectedCallback || fallback);
-  d.add(disconnectedCallback || fallback);
-  // if (target.isConnected) // No IE11/Edge support
-  if (!(
-    target.ownerDocument.compareDocumentPosition(target) &
-    target.DOCUMENT_POSITION_DISCONNECTED
-  ))
-    (connectedCallback || fallback).call(target);
+  if (disconnectedCallback)
+    d.add(disconnectedCallback);
+  if (connectedCallback) {
+    c.add(connectedCallback);
+    // if (target.isConnected) // No IE11/Edge support
+    if (!(
+      target.ownerDocument.compareDocumentPosition(target) &
+      target.DOCUMENT_POSITION_DISCONNECTED
+    ))
+      connectedCallback.call(target);
+  }
   return target;
@@ -98,0 +92,0 @@ };

es.js

@@ -1,1 +0,1 @@
-self.asCustomElement=function(e){"use strict";const t=new WeakMap,a=(e,a)=>{for(let r=0,{length:o}=e;r<o;r++){const{target:o,attributeName:c,oldValue:s}=e[r];n(t.get(o).a.get(a),o,c,s)}},n=(e,t,a,n)=>{e.call(t,a,n,t.getAttribute(a))},r=()=>{},o=(e,a)=>{for(let n=0,{length:r}=e;n<r;n++){const r=e[n],c=t.get(r);c&&("d"===a&&c.a.forEach(s),c[a].forEach(d,r)),o(r.children||[],a)}},c=e=>{for(let t=0,{length:a}=e;t<a;t++){const{addedNodes:a,removedNodes:n}=e[t];o(a,"c"),o(n,"d")}},s=(e,t)=>{a(t.takeRecords(),t)},l=new MutationObserver(c);l.observe(document,{childList:!0,subtree:!0});function d(e){e.call(this)}return e.default=(e,{connectedCallback:o,disconnectedCallback:s,observedAttributes:d,attributeChangedCallback:u})=>{c(l.takeRecords());const{a:i,c:b,d:h}=t.get(e)||(e=>{const a={a:new Map,c:new Set,d:new Set};return t.set(e,a),a})(e);if(d){const t=new MutationObserver(a);t.observe(e,{attributes:!0,attributeFilter:d,attributeOldValue:!0}),i.set(t,u||r),d.forEach(t=>{e.hasAttribute(t)&&n(u||r,e,t,null)})}return b.add(o||r),h.add(s||r),e.ownerDocument.compareDocumentPosition(e)&e.DOCUMENT_POSITION_DISCONNECTED||(o||r).call(e),e},e}({}).default;
+self.asCustomElement=function(e){"use strict";const t=new Set,a=new MutationObserver(e=>{t.forEach(r,e)});function r(e){e(this,a)}a.observe(document,{subtree:!0,childList:!0}),t.observer=a;const n=new WeakMap,{observer:o}=t,c=e=>{for(let t=0,{length:a}=e;t<a;t++){const{target:a,attributeName:r,oldValue:o}=e[t],c=a.getAttribute(r);n.get(a).a[r].forEach(e=>{e.call(a,r,o,c)})}},s=(e,t)=>{for(let a=0,{length:r}=e;a<r;a++){const r=e[a];n.has(r)&&n.get(r)[t].forEach(u,r),s(r.children||[],t)}},l=e=>{for(let t=0,{length:a}=e;t<a;t++){const{addedNodes:a,removedNodes:r}=e[t];s(a,"c"),c(d.takeRecords()),s(r,"d")}},d=new MutationObserver(c);t.add(l);function u(e){e.call(this)}return e.default=(e,{connectedCallback:t,disconnectedCallback:a,observedAttributes:r,attributeChangedCallback:c})=>{l(o.takeRecords());const{a:s,c:u,d:i}=n.get(e)||(e=>{const t={a:{},c:new Set,d:new Set};return n.set(e,t),t})(e);return r&&(d.observe(e,{attributes:!0,attributeOldValue:!0,attributeFilter:r}),r.forEach(t=>{(s[t]||(s[t]=new Set)).add(c),e.hasAttribute(t)&&c.call(e,t,null,e.getAttribute(t))})),a&&i.add(a),t&&(u.add(t),e.ownerDocument.compareDocumentPosition(e)&e.DOCUMENT_POSITION_DISCONNECTED||t.call(e)),e},e}({}).default;

esm/index.js

@@ -0,29 +1,21 @@
+import sdo from 'shared-document-observer';
+
 const wm = new WeakMap;
+const {observer} = sdo;
 
-const attributeChanged = (records, mo) => {
+const attributeChanged = records => {
   for (let i = 0, {length} = records; i < length; i++) {
     const {target, attributeName, oldValue} = records[i];
-    change(wm.get(target).a.get(mo), target, attributeName, oldValue);
+    const newValue = target.getAttribute(attributeName);
+    wm.get(target).a[attributeName].forEach(attributeChangedCallback => {
+      attributeChangedCallback.call(target, attributeName, oldValue, newValue);
+    });
   }
 };
 
-const change = (attributeChangedCallback, target, attributeName, oldValue) => {
-  attributeChangedCallback.call(
-    target,
-    attributeName,
-    oldValue,
-    target.getAttribute(attributeName)
-  );
-};
-
-const fallback = () => {};
-
 const invoke = (nodes, key) => {
   for (let i = 0, {length} = nodes; i < length; i++) {
-    const target = nodes[i], info = wm.get(target);
-    if (info) {
-      if (key === 'd')
-        info.a.forEach(takeRecords);
-      info[key].forEach(call, target);
-    }
+    const target = nodes[i];
+    if (wm.has(target))
+      wm.get(target)[key].forEach(call, target);
     invoke(target.children || [], key);
@@ -37,2 +29,3 @@ }
     invoke(addedNodes, 'c');
+    attributeChanged(sao.takeRecords());
     invoke(removedNodes, 'd');
@@ -42,4 +35,6 @@ }
 
+const sao = new MutationObserver(attributeChanged);
+
 const set = target => {
-  const sets = {a: new Map, c: new Set, d: new Set};
+  const sets = {a: {}, c: new Set, d: new Set};
   wm.set(target, sets);
@@ -49,13 +44,4 @@ return sets;
 
-const takeRecords = (_, mo) => {
-  attributeChanged(mo.takeRecords(), mo);
-};
+sdo.add(mainLoop);
 
-const mo = new MutationObserver(mainLoop);
-
-mo.observe(
-  document,
-  {childList: true, subtree: true}
-);
-
 export default (
@@ -72,25 +58,33 @@ target,
 ) => {
-  mainLoop(mo.takeRecords());
+  mainLoop(observer.takeRecords());
   const {a, c, d} = wm.get(target) || set(target);
   if (observedAttributes) {
-    const mo = new MutationObserver(attributeChanged);
-    mo.observe(target, {
+    sao.observe(target, {
       attributes: true,
-      attributeFilter: observedAttributes,
-      attributeOldValue: true
+      attributeOldValue: true,
+      attributeFilter: observedAttributes
     });
-    a.set(mo, attributeChangedCallback || fallback);
     observedAttributes.forEach(attributeName => {
+      (a[attributeName] || (a[attributeName] = new Set))
+        .add(attributeChangedCallback);
       if (target.hasAttribute(attributeName))
-        change(attributeChangedCallback || fallback, target, attributeName, null);
+        attributeChangedCallback.call(
+          target,
+          attributeName,
+          null,
+          target.getAttribute(attributeName)
+        );
     });
   }
-  c.add(connectedCallback || fallback);
-  d.add(disconnectedCallback || fallback);
-  // if (target.isConnected) // No IE11/Edge support
-  if (!(
-    target.ownerDocument.compareDocumentPosition(target) &
-    target.DOCUMENT_POSITION_DISCONNECTED
-  ))
-    (connectedCallback || fallback).call(target);
+  if (disconnectedCallback)
+    d.add(disconnectedCallback);
+  if (connectedCallback) {
+    c.add(connectedCallback);
+    // if (target.isConnected) // No IE11/Edge support
+    if (!(
+      target.ownerDocument.compareDocumentPosition(target) &
+      target.DOCUMENT_POSITION_DISCONNECTED
+    ))
+      connectedCallback.call(target);
+  }
   return target;
@@ -97,0 +91,0 @@ };

index.js

 self.asCustomElement = (function (exports) {
   'use strict';
 
+  var set = new Set();
+  var observer = new MutationObserver(function (records) {
+    set.forEach(invoke, records);
+  });
+  observer.observe(document, {
+    subtree: true,
+    childList: true
+  });
+  set.observer = observer;
+
+  function invoke(callback) {
+    callback(this, observer);
+  }
+
   var wm = new WeakMap();
+  var observer$1 = set.observer;
 
-  var attributeChanged = function attributeChanged(records, mo) {
-    for (var i = 0, length = records.length; i < length; i++) {
+  var attributeChanged = function attributeChanged(records) {
+    var _loop = function _loop(i, length) {
       var _records$i = records[i],
@@ -12,22 +27,17 @@ target = _records$i.target,
           oldValue = _records$i.oldValue;
-      change(wm.get(target).a.get(mo), target, attributeName, oldValue);
+      var newValue = target.getAttribute(attributeName);
+      wm.get(target).a[attributeName].forEach(function (attributeChangedCallback) {
+        attributeChangedCallback.call(target, attributeName, oldValue, newValue);
+      });
+    };
+
+    for (var i = 0, length = records.length; i < length; i++) {
+      _loop(i);
     }
   };
 
-  var change = function change(attributeChangedCallback, target, attributeName, oldValue) {
-    attributeChangedCallback.call(target, attributeName, oldValue, target.getAttribute(attributeName));
-  };
-
-  var fallback = function fallback() {};
-
-  var invoke = function invoke(nodes, key) {
+  var invoke$1 = function invoke(nodes, key) {
     for (var i = 0, length = nodes.length; i < length; i++) {
-      var target = nodes[i],
-          info = wm.get(target);
-
-      if (info) {
-        if (key === 'd') info.a.forEach(takeRecords);
-        info[key].forEach(call, target);
-      }
-
+      var target = nodes[i];
+      if (wm.has(target)) wm.get(target)[key].forEach(call, target);
       invoke(target.children || [], key);
@@ -42,10 +52,13 @@ }
           removedNodes = _records$i2.removedNodes;
-      invoke(addedNodes, 'c');
-      invoke(removedNodes, 'd');
+      invoke$1(addedNodes, 'c');
+      attributeChanged(sao.takeRecords());
+      invoke$1(removedNodes, 'd');
     }
   };
 
-  var set = function set(target) {
+  var sao = new MutationObserver(attributeChanged);
+
+  var set$1 = function set(target) {
     var sets = {
-      a: new Map(),
+      a: {},
       c: new Set(),
@@ -58,11 +71,3 @@ d: new Set()
 
-  var takeRecords = function takeRecords(_, mo) {
-    attributeChanged(mo.takeRecords(), mo);
-  };
-
-  var mo = new MutationObserver(mainLoop);
-  mo.observe(document, {
-    childList: true,
-    subtree: true
-  });
+  set.add(mainLoop);
   var index = (function (target, _ref) {
@@ -73,5 +78,5 @@ var connectedCallback = _ref.connectedCallback,
         attributeChangedCallback = _ref.attributeChangedCallback;
-    mainLoop(mo.takeRecords());
+    mainLoop(observer$1.takeRecords());
 
-    var _ref2 = wm.get(target) || set(target),
+    var _ref2 = wm.get(target) || set$1(target),
         a = _ref2.a,
@@ -82,20 +87,21 @@ c = _ref2.c,
     if (observedAttributes) {
-      var _mo = new MutationObserver(attributeChanged);
-
-      _mo.observe(target, {
+      sao.observe(target, {
         attributes: true,
-        attributeFilter: observedAttributes,
-        attributeOldValue: true
+        attributeOldValue: true,
+        attributeFilter: observedAttributes
       });
-
-      a.set(_mo, attributeChangedCallback || fallback);
       observedAttributes.forEach(function (attributeName) {
-        if (target.hasAttribute(attributeName)) change(attributeChangedCallback || fallback, target, attributeName, null);
+        (a[attributeName] || (a[attributeName] = new Set())).add(attributeChangedCallback);
+        if (target.hasAttribute(attributeName)) attributeChangedCallback.call(target, attributeName, null, target.getAttribute(attributeName));
       });
     }
 
-    c.add(connectedCallback || fallback);
-    d.add(disconnectedCallback || fallback); // if (target.isConnected) // No IE11/Edge support
+    if (disconnectedCallback) d.add(disconnectedCallback);
 
-    if (!(target.ownerDocument.compareDocumentPosition(target) & target.DOCUMENT_POSITION_DISCONNECTED)) (connectedCallback || fallback).call(target);
+    if (connectedCallback) {
+      c.add(connectedCallback); // if (target.isConnected) // No IE11/Edge support
+
+      if (!(target.ownerDocument.compareDocumentPosition(target) & target.DOCUMENT_POSITION_DISCONNECTED)) connectedCallback.call(target);
+    }
+
     return target;
@@ -102,0 +108,0 @@ });

min.js

@@ -1,1 +0,1 @@
-self.asCustomElement=function(t){"use strict";var e=new WeakMap,a=function(t,a){for(var r=0,o=t.length;r<o;r++){var c=t[r],u=c.target,i=c.attributeName,d=c.oldValue;n(e.get(u).a.get(a),u,i,d)}},n=function(t,e,a,n){t.call(e,a,n,e.getAttribute(a))},r=function(){},o=function t(a,n){for(var r=0,o=a.length;r<o;r++){var c=a[r],i=e.get(c);i&&("d"===n&&i.a.forEach(u),i[n].forEach(d,c)),t(c.children||[],n)}},c=function(t){for(var e=0,a=t.length;e<a;e++){var n=t[e],r=n.addedNodes,c=n.removedNodes;o(r,"c"),o(c,"d")}},u=function(t,e){a(e.takeRecords(),e)},i=new MutationObserver(c);i.observe(document,{childList:!0,subtree:!0});function d(t){t.call(this)}return t.default=function(t,o){var u=o.connectedCallback,d=o.disconnectedCallback,l=o.observedAttributes,s=o.attributeChangedCallback;c(i.takeRecords());var f=e.get(t)||function(t){var a={a:new Map,c:new Set,d:new Set};return e.set(t,a),a}(t),b=f.a,v=f.c,h=f.d;if(l){var g=new MutationObserver(a);g.observe(t,{attributes:!0,attributeFilter:l,attributeOldValue:!0}),b.set(g,s||r),l.forEach((function(e){t.hasAttribute(e)&&n(s||r,t,e,null)}))}return v.add(u||r),h.add(d||r),t.ownerDocument.compareDocumentPosition(t)&t.DOCUMENT_POSITION_DISCONNECTED||(u||r).call(t),t},t}({}).default;
+self.asCustomElement=function(e){"use strict";var t=new Set,a=new MutationObserver((function(e){t.forEach(r,e)}));function r(e){e(this,a)}a.observe(document,{subtree:!0,childList:!0}),t.observer=a;var n=new WeakMap,o=t.observer,c=function(e){for(var t=function(t,a){var r=e[t],o=r.target,c=r.attributeName,u=r.oldValue,i=o.getAttribute(c);n.get(o).a[c].forEach((function(e){e.call(o,c,u,i)}))},a=0,r=e.length;a<r;a++)t(a)},u=function e(t,a){for(var r=0,o=t.length;r<o;r++){var c=t[r];n.has(c)&&n.get(c)[a].forEach(l,c),e(c.children||[],a)}},i=function(e){for(var t=0,a=e.length;t<a;t++){var r=e[t],n=r.addedNodes,o=r.removedNodes;u(n,"c"),c(d.takeRecords()),u(o,"d")}},d=new MutationObserver(c);t.add(i);function l(e){e.call(this)}return e.default=function(e,t){var a=t.connectedCallback,r=t.disconnectedCallback,c=t.observedAttributes,u=t.attributeChangedCallback;i(o.takeRecords());var l=n.get(e)||function(e){var t={a:{},c:new Set,d:new Set};return n.set(e,t),t}(e),s=l.a,f=l.c,b=l.d;return c&&(d.observe(e,{attributes:!0,attributeOldValue:!0,attributeFilter:c}),c.forEach((function(t){(s[t]||(s[t]=new Set)).add(u),e.hasAttribute(t)&&u.call(e,t,null,e.getAttribute(t))}))),r&&b.add(r),a&&(f.add(a),e.ownerDocument.compareDocumentPosition(e)&e.DOCUMENT_POSITION_DISCONNECTED||a.call(e)),e},e}({}).default;

package.json

 {
   "name": "as-custom-element",
-  "version": "0.1.5",
+  "version": "0.2.0",
   "description": "Setup any element as if it was a Custom Element",
@@ -48,3 +48,6 @@ "main": "./cjs/index.js",
   },
-  "homepage": "https://github.com/WebReflection/as-custom-element#readme"
+  "homepage": "https://github.com/WebReflection/as-custom-element#readme",
+  "dependencies": {
+    "shared-document-observer": "^0.1.2"
+  }
 }

No alert changes

Improved metrics

Total package byte prevSize

13884

increased by2.36%

Worsened metrics

Dependency count

1

increased byInfinity%

Lines of code

263

decreased by-0.38%

Dependency changes

• + Addedshared-document-observer@^0.1.2

• + Addedshared-document-observer@0.1.2(transitive)