Merge pull request #21 from minas90/attrs

Add getAttribute, fix tests, fix rawAttributes, fix setAttribute when the value is number
This commit is contained in:
taoqf 2020-02-05 13:45:38 +08:00 committed by GitHub
commit a0fc07a23c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 40 additions and 27 deletions

3
.gitignore vendored
View file

@ -18,3 +18,6 @@ bower_components
*.sublime-* *.sublime-*
dist/ dist/
yarn.lock yarn.lock
.idea
.DS_Store

View file

@ -407,7 +407,7 @@ export default class HTMLElement extends Node {
const attrs = this.rawAttributes; const attrs = this.rawAttributes;
for (const key in attrs) { for (const key in attrs) {
const val = attrs[key] || ''; const val = attrs[key] || '';
this._attrs[key] = decode(val.replace(/^['"]/, '').replace(/['"]$/, '')); this._attrs[key] = decode(val);
} }
return this._attrs; return this._attrs;
} }
@ -421,40 +421,43 @@ export default class HTMLElement extends Node {
return this._rawAttrs; return this._rawAttrs;
const attrs = {} as RawAttributes; const attrs = {} as RawAttributes;
if (this.rawAttrs) { if (this.rawAttrs) {
const re = /\b([a-z][a-z0-9\-]*)(?:\s*=\s*("(?:[^"]*)"|'(?:[^']*)'|(?:\S+)))?/ig; const re = /\b([a-z][a-z0-9\-]*)(?:\s*=\s*(?:"([^"]*)"|'([^']*)'|(\S+)))?/ig;
let match: RegExpExecArray; let match: RegExpExecArray;
while (match = re.exec(this.rawAttrs)) { while (match = re.exec(this.rawAttrs)) {
attrs[match[1]] = match[2] || null; attrs[match[1]] = match[2] || match[3] || match[4] || null;
} }
} }
this._rawAttrs = attrs; this._rawAttrs = attrs;
return attrs; return attrs;
} }
/**
* Get an attribute
* @return {string} value of the attribute
*/
getAttribute(key: string) {
return this.attributes[key] || null;
}
/** /**
* Set an attribute value to the HTMLElement * Set an attribute value to the HTMLElement
* @param {string} key The attribute name * @param {string} key The attribute name
* @param {string|number} value The value to set, or null / undefined to remove an attribute * @param {string|number} value The value to set, or null / undefined to remove an attribute
*/ */
setAttribute(key: string, value: string | number) { setAttribute(key: string, value: string | number) {
// Update the this.attributes // Invalidate current this.attributes
if (this._attrs) { if (this._attrs) {
delete this._attrs; delete this._attrs;
} }
const attrs = this.rawAttributes; // ref this._rawAttrs const attrs = this.rawAttributes;
if (value === undefined || value === null) { if (value === undefined || value === null) {
delete attrs[key]; delete attrs[key];
} else { } else {
attrs[key] = JSON.stringify(value); attrs[key] = String(value);
// if (typeof value === 'string') {
// attrs[key] = JSON.stringify(encode(value));//??? should we encode value here?
// } else {
// attrs[key] = JSON.stringify(value);
// }
} }
// Update rawString // Update rawString
this.rawAttrs = Object.keys(attrs).map((name) => { this.rawAttrs = Object.keys(attrs).map((name) => {
const val = attrs[name]; const val = JSON.stringify(attrs[name]);
if (val === undefined || val === null) { if (val === undefined || val === null) {
return name; return name;
} else { } else {
@ -468,11 +471,11 @@ export default class HTMLElement extends Node {
* @param {Attributes} attributes the new attribute set * @param {Attributes} attributes the new attribute set
*/ */
setAttributes(attributes: Attributes) { setAttributes(attributes: Attributes) {
// Update the this.attributes // Invalidate current this.attributes
if (this._attrs) { if (this._attrs) {
delete this._attrs; delete this._attrs;
} }
// Update the raw attributes map // Invalidate current this.rawAttributes
if (this._rawAttrs) { if (this._rawAttrs) {
delete this._rawAttrs; delete this._rawAttrs;
} }
@ -482,12 +485,7 @@ export default class HTMLElement extends Node {
if (val === undefined || val === null) { if (val === undefined || val === null) {
return name; return name;
} else { } else {
return name + '=' + JSON.stringify(val); return name + '=' + JSON.stringify(String(val));
// if (typeof val === 'string') {
// return name + '=' + JSON.stringify(encode(val)); //??? should we encode value here?
// } else {
// return name + '=' + JSON.stringify(val);
// }
} }
}).join(' '); }).join(' ');
} }

View file

@ -300,8 +300,8 @@ describe('HTML Parser', function () {
var root = parseHTML('<p a=12 data-id="!$$&amp;" yAz=\'1\'></p>'); var root = parseHTML('<p a=12 data-id="!$$&amp;" yAz=\'1\'></p>');
root.firstChild.rawAttributes.should.eql({ root.firstChild.rawAttributes.should.eql({
'a': '12', 'a': '12',
'data-id': '"!$$&amp;"', 'data-id': '!$$&amp;',
'yAz': '\'1\'' 'yAz': '1'
}); });
}); });
}); });
@ -319,6 +319,18 @@ describe('HTML Parser', function () {
}); });
}); });
describe('#getAttribute', function () {
it('should return value of the attribute', function () {
var root = parseHTML('<p a="a1b"></p>');
root.firstChild.getAttribute('a').should.eql('a1b');
});
it('should return null when there is no such attribute', function () {
var root = parseHTML('<p></p>');
should.equal(root.firstChild.getAttribute('b'), null);
});
});
describe('#setAttribute', function () { describe('#setAttribute', function () {
it('should edit the attributes of the element', function () { it('should edit the attributes of the element', function () {
var root = parseHTML('<p a=12></p>'); var root = parseHTML('<p a=12></p>');
@ -326,7 +338,7 @@ describe('HTML Parser', function () {
root.firstChild.attributes.should.eql({ root.firstChild.attributes.should.eql({
'a': '13', 'a': '13',
}); });
root.firstChild.toString().should.eql('<p a=13></p>'); root.firstChild.toString().should.eql('<p a="13"></p>');
}); });
it('should add an attribute to the element', function () { it('should add an attribute to the element', function () {
var root = parseHTML('<p a=12></p>'); var root = parseHTML('<p a=12></p>');
@ -335,7 +347,7 @@ describe('HTML Parser', function () {
'a': '12', 'a': '12',
'b': '13', 'b': '13',
}); });
root.firstChild.toString().should.eql('<p a=12 b=13></p>'); root.firstChild.toString().should.eql('<p a="12" b="13"></p>');
}); });
it('should remove an attribute from the element', function () { it('should remove an attribute from the element', function () {
var root = parseHTML('<p a=12 b=13 c=14></p>'); var root = parseHTML('<p a=12 b=13 c=14></p>');
@ -344,7 +356,7 @@ describe('HTML Parser', function () {
root.firstChild.attributes.should.eql({ root.firstChild.attributes.should.eql({
'a': '12', 'a': '12',
}); });
root.firstChild.toString().should.eql('<p a=12></p>'); root.firstChild.toString().should.eql('<p a="12"></p>');
}); });
it('should keep quotes arount value', function () { it('should keep quotes arount value', function () {
var root = parseHTML('<p a="12"></p>'); var root = parseHTML('<p a="12"></p>');
@ -355,7 +367,7 @@ describe('HTML Parser', function () {
'b': '13', 'b': '13',
'c': '2' 'c': '2'
}); });
root.firstChild.toString().should.eql('<p a="12" b=13 c="2"></p>'); root.firstChild.toString().should.eql('<p a="12" b="13" c="2"></p>');
}); });
}); });
@ -370,7 +382,7 @@ describe('HTML Parser', function () {
'c': '12', 'c': '12',
d: '&&<>foo' d: '&&<>foo'
}); });
root.firstChild.toString().should.eql('<p c=12 d="&&<>foo"></p>'); root.firstChild.toString().should.eql('<p c="12" d="&&<>foo"></p>');
// root.firstChild.toString().should.eql('<p c=12 d="&#x26;&#x26;&#x3C;&#x3E;foo"></p>'); // root.firstChild.toString().should.eql('<p c=12 d="&#x26;&#x26;&#x3C;&#x3E;foo"></p>');
}); });
}); });