as-custom-element - npm Package Compare versions

Comparing version 0.1.2 to 0.1.3

cjs/index.js

 'use strict';
 const wm = new WeakMap;
 
-const attributeChanged = records => {
+const attributeChanged = (records, mo) => {
   for (let i = 0, {length} = records; i < length; i++) {
-    const {attributeName, oldValue, target} = records[i];
-    const newValue = target.getAttribute(attributeName);
-    wm.get(target).a.forEach(callback => {
-      callback.call(target, attributeName, oldValue, newValue);
-    });
+    const {target, attributeName, oldValue} = records[i];
+    change(wm.get(target).a.get(mo), target, attributeName, oldValue);
   }
 };
 
+const change = (attributeChangedCallback, target, attributeName, oldValue) => {
+  const newValue = target.getAttribute(attributeName);
+  attributeChangedCallback.call(target, attributeName, oldValue, newValue);
+};
+
 const fallback = () => {};
@@ -21,3 +23,3 @@
       if (key === 'd')
-        wm.get(target).o.forEach(takeRecords);
+        wm.get(target).a.forEach(takeRecords);
       wm.get(target)[key].forEach(call, target);
@@ -38,3 +40,3 @@ }
 const set = target => {
-  const sets = {a: new Set, c: new Set, d: new Set, o: new Set};
+  const sets = {a: new Map, c: new Set, d: new Set};
   wm.set(target, sets);
@@ -44,4 +46,4 @@ return sets;
 
-const takeRecords = mo => {
-  attributeChanged(mo.takeRecords());
+const takeRecords = (_, mo) => {
+  attributeChanged(mo.takeRecords(), mo);
 };
@@ -68,3 +70,3 @@
   mainLoop(mo.takeRecords());
-  const {a, c, d, o} = wm.get(target) || set(target);
+  const {a, c, d} = wm.get(target) || set(target);
   if (observedAttributes) {
@@ -77,8 +79,6 @@ const mo = new MutationObserver(attributeChanged);
     });
-    a.add(attributeChangedCallback || fallback);
-    o.add(mo);
+    a.set(mo, attributeChangedCallback || fallback);
     observedAttributes.forEach(attributeName => {
       if (target.hasAttribute(attributeName))
-        (attributeChangedCallback || fallback)
-          .call(target, attributeName, null, target.getAttribute(attributeName));
+        change(attributeChangedCallback || fallback, target, attributeName, null);
     });
@@ -89,3 +89,6 @@ }
   // if (target.isConnected) // No IE11/Edge support
-  if (target.ownerDocument.contains(target))
+  if (!(
+    target.ownerDocument.compareDocumentPosition(target) &
+    target.DOCUMENT_POSITION_DISCONNECTED
+  ))
     (connectedCallback || fallback).call(target);
@@ -92,0 +95,0 @@ return target;

es.js

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

esm/index.js

 const wm = new WeakMap;
 
-const attributeChanged = records => {
+const attributeChanged = (records, mo) => {
   for (let i = 0, {length} = records; i < length; i++) {
-    const {attributeName, oldValue, target} = records[i];
-    const newValue = target.getAttribute(attributeName);
-    wm.get(target).a.forEach(callback => {
-      callback.call(target, attributeName, oldValue, newValue);
-    });
+    const {target, attributeName, oldValue} = records[i];
+    change(wm.get(target).a.get(mo), target, attributeName, oldValue);
   }
 };
 
+const change = (attributeChangedCallback, target, attributeName, oldValue) => {
+  const newValue = target.getAttribute(attributeName);
+  attributeChangedCallback.call(target, attributeName, oldValue, newValue);
+};
+
 const fallback = () => {};
@@ -20,3 +22,3 @@
       if (key === 'd')
-        wm.get(target).o.forEach(takeRecords);
+        wm.get(target).a.forEach(takeRecords);
       wm.get(target)[key].forEach(call, target);
@@ -37,3 +39,3 @@ }
 const set = target => {
-  const sets = {a: new Set, c: new Set, d: new Set, o: new Set};
+  const sets = {a: new Map, c: new Set, d: new Set};
   wm.set(target, sets);
@@ -43,4 +45,4 @@ return sets;
 
-const takeRecords = mo => {
-  attributeChanged(mo.takeRecords());
+const takeRecords = (_, mo) => {
+  attributeChanged(mo.takeRecords(), mo);
 };
@@ -67,3 +69,3 @@
   mainLoop(mo.takeRecords());
-  const {a, c, d, o} = wm.get(target) || set(target);
+  const {a, c, d} = wm.get(target) || set(target);
   if (observedAttributes) {
@@ -76,8 +78,6 @@ const mo = new MutationObserver(attributeChanged);
     });
-    a.add(attributeChangedCallback || fallback);
-    o.add(mo);
+    a.set(mo, attributeChangedCallback || fallback);
     observedAttributes.forEach(attributeName => {
       if (target.hasAttribute(attributeName))
-        (attributeChangedCallback || fallback)
-          .call(target, attributeName, null, target.getAttribute(attributeName));
+        change(attributeChangedCallback || fallback, target, attributeName, null);
     });
@@ -88,3 +88,6 @@ }
   // if (target.isConnected) // No IE11/Edge support
-  if (target.ownerDocument.contains(target))
+  if (!(
+    target.ownerDocument.compareDocumentPosition(target) &
+    target.DOCUMENT_POSITION_DISCONNECTED
+  ))
     (connectedCallback || fallback).call(target);
@@ -91,0 +94,0 @@ return target;

index.js

@@ -6,19 +6,17 @@ self.asCustomElement = (function (exports) {
 
-  var attributeChanged = function attributeChanged(records) {
-    var _loop = function _loop(i, length) {
+  var attributeChanged = function attributeChanged(records, mo) {
+    for (var i = 0, length = records.length; i < length; i++) {
       var _records$i = records[i],
+          target = _records$i.target,
           attributeName = _records$i.attributeName,
-          oldValue = _records$i.oldValue,
-          target = _records$i.target;
-      var newValue = target.getAttribute(attributeName);
-      wm.get(target).a.forEach(function (callback) {
-        callback.call(target, attributeName, oldValue, newValue);
-      });
-    };
-
-    for (var i = 0, length = records.length; i < length; i++) {
-      _loop(i);
+          oldValue = _records$i.oldValue;
+      change(wm.get(target).a.get(mo), target, attributeName, oldValue);
     }
   };
 
+  var change = function change(attributeChangedCallback, target, attributeName, oldValue) {
+    var newValue = target.getAttribute(attributeName);
+    attributeChangedCallback.call(target, attributeName, oldValue, newValue);
+  };
+
   var fallback = function fallback() {};
@@ -31,3 +29,3 @@
       if (wm.has(target)) {
-        if (key === 'd') wm.get(target).o.forEach(takeRecords);
+        if (key === 'd') wm.get(target).a.forEach(takeRecords);
         wm.get(target)[key].forEach(call, target);
@@ -52,6 +50,5 @@ }
     var sets = {
-      a: new Set(),
+      a: new Map(),
       c: new Set(),
-      d: new Set(),
-      o: new Set()
+      d: new Set()
     };
@@ -62,4 +59,4 @@ wm.set(target, sets);
 
-  var takeRecords = function takeRecords(mo) {
-    attributeChanged(mo.takeRecords());
+  var takeRecords = function takeRecords(_, mo) {
+    attributeChanged(mo.takeRecords(), mo);
   };
@@ -82,4 +79,3 @@
         c = _ref2.c,
-        d = _ref2.d,
-        o = _ref2.o;
+        d = _ref2.d;
 
@@ -95,6 +91,5 @@ if (observedAttributes) {
 
-      a.add(attributeChangedCallback || fallback);
-      o.add(_mo);
+      a.set(_mo, attributeChangedCallback || fallback);
       observedAttributes.forEach(function (attributeName) {
-        if (target.hasAttribute(attributeName)) (attributeChangedCallback || fallback).call(target, attributeName, null, target.getAttribute(attributeName));
+        if (target.hasAttribute(attributeName)) change(attributeChangedCallback || fallback, target, attributeName, null);
       });
@@ -106,3 +101,3 @@ }
 
-    if (target.ownerDocument.contains(target)) (connectedCallback || fallback).call(target);
+    if (!(target.ownerDocument.compareDocumentPosition(target) & target.DOCUMENT_POSITION_DISCONNECTED)) (connectedCallback || fallback).call(target);
     return target;
@@ -109,0 +104,0 @@ });

min.js

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

package.json

 {
   "name": "as-custom-element",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "description": "Setup any element as if it was a Custom Element",
@@ -5,0 +5,0 @@ "main": "./cjs/index.js",

README.md

 # As Custom Element
 
-The easiest way to add Custom Elements like callback to any node.
+The easiest way to add Custom Elements like callbacks to any node.
 
@@ -5,0 +5,0 @@ Compatible with [modern browsers](https://webreflection.github.io/as-custom-element/test/), as well as [IE11](https://webreflection.github.io/as-custom-element/test/ie/), and no polyfills are needed, for a total minified size of *~0.6K*.

No alert changes

Improved metrics

Total package byte prevSize

13660

increased by2.45%

Worsened metrics

Lines of code

256

decreased by-0.39%

No dependency changes