linkedom - npm Package Compare versions

Comparing version 0.1.20 to 0.1.21

cjs/attr.js

@@ -16,3 +16,4 @@ 'use strict';
     this.name = String(name);
-    this.value = String(value);
+    this._value = String(value);
+    this._changed = false;
 
@@ -25,7 +26,16 @@ /**
 
+  get value() { return this._value; }
+
+  set value(value) {
+    this._changed = true;
+    this._value = String(value);
+  }
+
   toString() {
-    const {name, value} = this;
-    return value ? `${name}="${escape(this.value)}"` : name;
+    let {ownerElement, name, _value} = this;
+    if (name === 'style' && ownerElement)
+      _value = ownerElement.style.cssText;
+    return _value ? `${name}="${escape(_value)}"` : name;
   }
 }
 exports.Attr = Attr

cjs/dom-string-map.js

@@ -9,15 +9,15 @@ 'use strict';
 const handler = {
-  get(self, name) {
-    return refs.get(self).getAttribute(key(name));
+  get(dataset, name) {
+    return refs.get(dataset).getAttribute(key(name));
   },
 
-  set(self, name, value) {
-    refs.get(self).setAttribute(key(name), value);
-    self[name] = value;
+  set(dataset, name, value) {
+    refs.get(dataset).setAttribute(key(name), value);
+    dataset[name] = value;
     return true;
   },
 
-  deleteProperty(self, name) {
-    refs.get(self).removeAttribute(key(name));
-    return delete self[name];
+  deleteProperty(dataset, name) {
+    refs.get(dataset).removeAttribute(key(name));
+    return delete dataset[name];
   }
@@ -24,0 +24,0 @@ };

cjs/element.js

@@ -9,4 +9,6 @@ 'use strict';
 const {NodeElement, NodeElementEnd} = require('./node.js');
+
 const {DOMStringMap} = require('./dom-string-map.js');
 const {DOMTokenList} = require('./dom-token-list.js');
+const {CSSStyleDeclaration} = require('./css-style-declaration.js');
 
@@ -30,2 +32,3 @@ const matches = (m => m.__esModule ? /* c8 ignore next */ m.default : /* c8 ignore next */ m)(require('./matches.js'));
     this._dataset = null;
+    this._style = null;
     this._next = this._end = new NodeElementEnd(this);
@@ -39,3 +42,6 @@ }
   set id(value) {
-    this.setAttribute('id', value);
+    if (value == null)
+      this.removeAttribute('id');
+    else
+      this.setAttribute('id', value);
   }
@@ -82,2 +88,11 @@
   /**
+   * @type {CSSStyleDeclaration}
+   */
+  get style() {
+    return this._style || (this._style = new CSSStyleDeclaration(this));
+  }
+
+  get innerText() { return this.textContent; }
+
+  /**
    * @type {string}
@@ -205,3 +220,3 @@ */
   /**
-   * @param {Attr} attribute 
+   * @param {Attr} attribute
    */
@@ -228,3 +243,3 @@ setAttributeNode(attribute) {
   /**
-   * @param {string} name 
+   * @param {string} name
    */
@@ -253,3 +268,3 @@ hasAttribute(name) {
   /**
-   * @param {string} name 
+   * @param {string} name
    */
@@ -283,4 +298,4 @@ removeAttribute(name) {
   /**
-   * @param {string} name 
-   * @param {boolean?} force 
+   * @param {string} name
+   * @param {boolean?} force
    */
@@ -311,3 +326,9 @@ toggleAttribute(name, force) {
         case ATTRIBUTE_NODE:
-          out.push(' ' + _next);
+          if (_next.name === 'style') {
+            const value = _next.toString();
+            if (value !== 'style')
+              out.push(' ' + value);
+          }
+          else
+            out.push(' ' + _next);
           break;
@@ -314,0 +335,0 @@ case ELEMENT_NODE_END:

cjs/utils.js

@@ -86,3 +86,3 @@ 'use strict';
 
-// export const invalidate = $ => { $._childNodes = $._children = null; };
+// DO_NOTE_REMOVE export const invalidate = $ => { $._childNodes = $._children = null; };
 
@@ -89,0 +89,0 @@ const isVoidElement = ({localName, ownerDocument}) => {

esm/attr.js

@@ -15,3 +15,4 @@ import {escape} from 'html-escaper';
     this.name = String(name);
-    this.value = String(value);
+    this._value = String(value);
+    this._changed = false;
 
@@ -24,6 +25,15 @@ /**
 
+  get value() { return this._value; }
+
+  set value(value) {
+    this._changed = true;
+    this._value = String(value);
+  }
+
   toString() {
-    const {name, value} = this;
-    return value ? `${name}="${escape(this.value)}"` : name;
+    let {ownerElement, name, _value} = this;
+    if (name === 'style' && ownerElement)
+      _value = ownerElement.style.cssText;
+    return _value ? `${name}="${escape(_value)}"` : name;
   }
 }

esm/dom-string-map.js

@@ -8,15 +8,15 @@ import uhyphen from 'uhyphen';
 const handler = {
-  get(self, name) {
-    return refs.get(self).getAttribute(key(name));
+  get(dataset, name) {
+    return refs.get(dataset).getAttribute(key(name));
   },
 
-  set(self, name, value) {
-    refs.get(self).setAttribute(key(name), value);
-    self[name] = value;
+  set(dataset, name, value) {
+    refs.get(dataset).setAttribute(key(name), value);
+    dataset[name] = value;
     return true;
   },
 
-  deleteProperty(self, name) {
-    refs.get(self).removeAttribute(key(name));
-    return delete self[name];
+  deleteProperty(dataset, name) {
+    refs.get(dataset).removeAttribute(key(name));
+    return delete dataset[name];
   }
@@ -23,0 +23,0 @@ };

esm/element.js

@@ -8,4 +8,6 @@ import {ELEMENT_NODE, ELEMENT_NODE_END, ATTRIBUTE_NODE, TEXT_NODE, COMMENT_NODE} from './constants.js';
 import {NodeElement, NodeElementEnd} from './node.js';
+
 import {DOMStringMap} from './dom-string-map.js';
 import {DOMTokenList} from './dom-token-list.js';
+import {CSSStyleDeclaration} from './css-style-declaration.js';
 
@@ -29,2 +31,3 @@ import matches from './matches.js';
     this._dataset = null;
+    this._style = null;
     this._next = this._end = new NodeElementEnd(this);
@@ -38,3 +41,6 @@ }
   set id(value) {
-    this.setAttribute('id', value);
+    if (value == null)
+      this.removeAttribute('id');
+    else
+      this.setAttribute('id', value);
   }
@@ -81,2 +87,11 @@
   /**
+   * @type {CSSStyleDeclaration}
+   */
+  get style() {
+    return this._style || (this._style = new CSSStyleDeclaration(this));
+  }
+
+  get innerText() { return this.textContent; }
+
+  /**
    * @type {string}
@@ -204,3 +219,3 @@ */
   /**
-   * @param {Attr} attribute 
+   * @param {Attr} attribute
    */
@@ -227,3 +242,3 @@ setAttributeNode(attribute) {
   /**
-   * @param {string} name 
+   * @param {string} name
    */
@@ -252,3 +267,3 @@ hasAttribute(name) {
   /**
-   * @param {string} name 
+   * @param {string} name
    */
@@ -282,4 +297,4 @@ removeAttribute(name) {
   /**
-   * @param {string} name 
-   * @param {boolean?} force 
+   * @param {string} name
+   * @param {boolean?} force
    */
@@ -310,3 +325,9 @@ toggleAttribute(name, force) {
         case ATTRIBUTE_NODE:
-          out.push(' ' + _next);
+          if (_next.name === 'style') {
+            const value = _next.toString();
+            if (value !== 'style')
+              out.push(' ' + value);
+          }
+          else
+            out.push(' ' + _next);
           break;
@@ -313,0 +334,0 @@ case ELEMENT_NODE_END:

esm/utils.js

@@ -78,3 +78,3 @@ import {Parser} from 'htmlparser2';
 
-// export const invalidate = $ => { $._childNodes = $._children = null; };
+// DO_NOTE_REMOVE export const invalidate = $ => { $._childNodes = $._children = null; };
 
@@ -81,0 +81,0 @@ export const isVoidElement = ({localName, ownerDocument}) => {

package.json

 {
   "name": "linkedom",
-  "version": "0.1.20",
+  "version": "0.1.21",
   "description": "A triple-linked lists based DOM",
@@ -11,2 +11,3 @@ "main": "./cjs/index.js",
     "benchmark:html": "node test/benchmark-linkedom.js --html; node test/benchmark-basichtml.js --html; node test/benchmark-jsdom.js --html",
+    "benchmark:html:nc": "node test/benchmark-linkedom.js --html --no-clone; node test/benchmark-basichtml.js --html --no-clone; node test/benchmark-jsdom.js --html --no-clone",
     "build": "npm run cjs && npm run test",
@@ -13,0 +14,0 @@ "cjs": "ascjs --no-default esm cjs",

No alert changes

Improved metrics

Total package byte prevSize

1516034

increased by0.38%

Number of package files

58

increased by3.57%

Lines of code

4372

increased by5.1%

No dependency changes