\n Time: ', '\n
\n '], ['\n\n Time: ', '\n
\n ']), - _templateObject2 = _taggedTemplateLiteral(['', ' world
'], ['', ' world
']), - _templateObject3 = _taggedTemplateLiteral(['', '
'], ['', '
']), - _templateObject4 = _taggedTemplateLiteral(['click'], ['click']), - _templateObject5 = _taggedTemplateLiteral(['how cool'], ['how cool']), - _templateObject6 = _taggedTemplateLiteral(['\n1
\n2
\n '], ['\n1
\n2
\n ']), - _templateObject7 = _taggedTemplateLiteral(['\n1
\n2
\n3
\n '], ['\n1
\n2
\n3
\n ']), - _templateObject8 = _taggedTemplateLiteral(['OK
'], ['OK
']), - _templateObject9 = _taggedTemplateLiteral(['\n1
\n '], ['\n1
\n ']), - _templateObject10 = _taggedTemplateLiteral(['\n 0\n1
\n '], ['\n 0\n1
\n ']), - _templateObject11 = _taggedTemplateLiteral(['', ''], ['', '']), - _templateObject12 = _taggedTemplateLiteral(['a'], ['a']), - _templateObject13 = _taggedTemplateLiteral(['\n O'], ['\n O']), - _templateObject14 = _taggedTemplateLiteral(['\n', '
', '', '
', '', '
'], ['', '
']), - _templateObject36 = _taggedTemplateLiteral([''], ['']), - _templateObject37 = _taggedTemplateLiteral([''], ['']), - _templateObject38 = _taggedTemplateLiteral(['any content
'], ['any content
']), - _templateObject49 = _taggedTemplateLiteral([''], ['']), - _templateObject50 = _taggedTemplateLiteral(['abc'], ['abc']), - _templateObject51 = _taggedTemplateLiteral(['a', 'c
'], ['a', 'c
']), - _templateObject52 = _taggedTemplateLiteral(['a', 'c'], ['a', 'c']), - _templateObject53 = _taggedTemplateLiteral(['hello
'], ['\nhello
']), - _templateObject58 = _taggedTemplateLiteral(['\nhello
'], ['\nhello
']), - _templateObject59 = _taggedTemplateLiteral(['hello
'], ['\nhello
']), - _templateObject63 = _taggedTemplateLiteral([''], ['']), - _templateObject64 = _taggedTemplateLiteral(['I\'m grand child
'], ['\nI\'m grand child
']), - _templateObject72 = _taggedTemplateLiteral(['\na
b
'], ['a
b
']), - _templateObject77 = _taggedTemplateLiteral(['c
'], ['c
']), - _templateObject78 = _taggedTemplateLiteral(['', ' - ', ''], ['', ' - ', '']), - _templateObject79 = _taggedTemplateLiteral([''], ['']), - _templateObject80 = _taggedTemplateLiteral([''], ['']), - _templateObject81 = _taggedTemplateLiteral([''], ['']), - _templateObject82 = _taggedTemplateLiteral(['\s*Time: \d+\.\d+<[^>]+?>\s*<\/p>\s*$/i.test(html)
- );
- }
- var html = update(i++).innerHTML;
- var p = div.querySelector('p');
- var attr = p.attributes[0];
- tressa.assert(compare(html), 'correct HTML');
- tressa.assert(html === div.innerHTML, 'correctly returned');
- setTimeout(function () {
- tressa.log('## updating same nodes');
- var html = update(i++).innerHTML;
- tressa.assert(compare(html), 'correct HTML update');
- tressa.assert(html === div.innerHTML, 'update applied');
- tressa.assert(p === div.querySelector('p'), 'no node was changed');
- tressa.assert(attr === p.attributes[0], 'no attribute was changed');
- done();
- });
-}).then(function () {
- return tressa.async(function (done) {
- tressa.log('## perf: same virtual text twice');
- var div = document.body.appendChild(document.createElement('div'));
- var render = hyperHTML.bind(div);
- var html = (update('hello').innerHTML, update('hello').innerHTML);
- function update(text) {
- return render(_templateObject2, text);
+(function () {
+ 'use strict';
+
+ function _classCallCheck(instance, Constructor) {
+ if (!(instance instanceof Constructor)) {
+ throw new TypeError("Cannot call a class as a function");
}
- tressa.assert(update('hello').innerHTML === update('hello').innerHTML, 'same text');
- done(div);
- });
-}).then(function () {
- return tressa.async(function (done) {
- tressa.log('## injecting HTML');
+ }
+
+ function _defineProperties(target, props) {
+ for (var i = 0; i < props.length; i++) {
+ var descriptor = props[i];
+ descriptor.enumerable = descriptor.enumerable || false;
+ descriptor.configurable = true;
+ if ("value" in descriptor) descriptor.writable = true;
+ Object.defineProperty(target, descriptor.key, descriptor);
+ }
+ }
+
+ function _createClass(Constructor, protoProps, staticProps) {
+ if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+ if (staticProps) _defineProperties(Constructor, staticProps);
+ return Constructor;
+ }
+
+ function _inherits(subClass, superClass) {
+ if (typeof superClass !== "function" && superClass !== null) {
+ throw new TypeError("Super expression must either be null or a function");
+ }
+
+ subClass.prototype = Object.create(superClass && superClass.prototype, {
+ constructor: {
+ value: subClass,
+ writable: true,
+ configurable: true
+ }
+ });
+ if (superClass) _setPrototypeOf(subClass, superClass);
+ }
+
+ function _getPrototypeOf(o) {
+ _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
+ return o.__proto__ || Object.getPrototypeOf(o);
+ };
+ return _getPrototypeOf(o);
+ }
+
+ function _setPrototypeOf(o, p) {
+ _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
+ o.__proto__ = p;
+ return o;
+ };
+
+ return _setPrototypeOf(o, p);
+ }
+
+ function _assertThisInitialized(self) {
+ if (self === void 0) {
+ throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+ }
+
+ return self;
+ }
+
+ function _possibleConstructorReturn(self, call) {
+ if (call && (typeof call === "object" || typeof call === "function")) {
+ return call;
+ }
+
+ return _assertThisInitialized(self);
+ }
+
+ function _taggedTemplateLiteral(strings, raw) {
+ if (!raw) {
+ raw = strings.slice(0);
+ }
+
+ return Object.freeze(Object.defineProperties(strings, {
+ raw: {
+ value: Object.freeze(raw)
+ }
+ }));
+ }
+
+ function _templateObject137() {
+ var data = _taggedTemplateLiteral(["
c
"]); + + _templateObject131 = function _templateObject131() { + return data; + }; + + return data; + } + + function _templateObject130() { + var data = _taggedTemplateLiteral(["a
b
"]); + + _templateObject130 = function _templateObject130() { + return data; + }; + + return data; + } + + function _templateObject129() { + var data = _taggedTemplateLiteral(["", ""]); + + _templateObject129 = function _templateObject129() { + return data; + }; + + return data; + } + + function _templateObject128() { + var data = _taggedTemplateLiteral(["", ""]); + + _templateObject128 = function _templateObject128() { + return data; + }; + + return data; + } + + function _templateObject127() { + var data = _taggedTemplateLiteral(["\nI'm grand child
"]); + + _templateObject122 = function _templateObject122() { + return data; + }; + + return data; + } + + function _templateObject121() { + var data = _taggedTemplateLiteral(["\n "]); + + _templateObject121 = function _templateObject121() { + return data; + }; + + return data; + } + + function _templateObject120() { + var data = _taggedTemplateLiteral(["\n "]); + + _templateObject120 = function _templateObject120() { + return data; + }; + + return data; + } + + function _templateObject119() { + var data = _taggedTemplateLiteral(["\n "]); + + _templateObject119 = function _templateObject119() { + return data; + }; + + return data; + } + + function _templateObject118() { + var data = _taggedTemplateLiteral(["\n "]); + + _templateObject118 = function _templateObject118() { + return data; + }; + + return data; + } + + function _templateObject117() { + var data = _taggedTemplateLiteral(["\nhello
"]); + + _templateObject113 = function _templateObject113() { + return data; + }; + + return data; + } + + function _templateObject112() { + var data = _taggedTemplateLiteral(["hello
"]); + + _templateObject109 = function _templateObject109() { + return data; + }; + + return data; + } + + function _templateObject108() { + var data = _taggedTemplateLiteral(["", ""]); + + _templateObject108 = function _templateObject108() { + return data; + }; + + return data; + } + + function _templateObject107() { + var data = _taggedTemplateLiteral(["", ""]); + + _templateObject107 = function _templateObject107() { + return data; + }; + + return data; + } + + function _templateObject106() { + var data = _taggedTemplateLiteral(["", ""]); + + _templateObject106 = function _templateObject106() { + return data; + }; + + return data; + } + + function _templateObject105() { + var data = _taggedTemplateLiteral(["\nhello
"]); + + _templateObject105 = function _templateObject105() { + return data; + }; + + return data; + } + + function _templateObject104() { + var data = _taggedTemplateLiteral(["\na", "c
"]); + + _templateObject100 = function _templateObject100() { + return data; + }; + + return data; + } + + function _templateObject99() { + var data = _taggedTemplateLiteral(["abc"]); + + _templateObject99 = function _templateObject99() { + return data; + }; + + return data; + } + + function _templateObject98() { + var data = _taggedTemplateLiteral(["a", "c
"]); + + _templateObject98 = function _templateObject98() { + return data; + }; + + return data; + } + + function _templateObject97() { + var data = _taggedTemplateLiteral(["abc"]); + + _templateObject97 = function _templateObject97() { + return data; + }; + + return data; + } + + function _templateObject96() { + var data = _taggedTemplateLiteral(["a", "c"]); + + _templateObject96 = function _templateObject96() { + return data; + }; + + return data; + } + + function _templateObject95() { + var data = _taggedTemplateLiteral(["abc"]); + + _templateObject95 = function _templateObject95() { + return data; + }; + + return data; + } + + function _templateObject94() { + var data = _taggedTemplateLiteral(["a", "c
"]); + + _templateObject94 = function _templateObject94() { + return data; + }; + + return data; + } + + function _templateObject93() { + var data = _taggedTemplateLiteral(["abc"]); + + _templateObject93 = function _templateObject93() { + return data; + }; + + return data; + } + + function _templateObject92() { + var data = _taggedTemplateLiteral(["", "
"]); + + _templateObject92 = function _templateObject92() { + return data; + }; + + return data; + } + + function _templateObject91() { + var data = _taggedTemplateLiteral(["", "
"]); + + _templateObject91 = function _templateObject91() { + return data; + }; + + return data; + } + + function _templateObject90() { + var data = _taggedTemplateLiteral(["", "
"]); + + _templateObject90 = function _templateObject90() { + return data; + }; + + return data; + } + + function _templateObject89() { + var data = _taggedTemplateLiteral(["a=", ""]); + + _templateObject89 = function _templateObject89() { + return data; + }; + + return data; + } + + function _templateObject88() { + var data = _taggedTemplateLiteral(["", "
"]); + + _templateObject88 = function _templateObject88() { + return data; + }; + + return data; + } + + function _templateObject87() { + var data = _taggedTemplateLiteral([""]); + + _templateObject87 = function _templateObject87() { + return data; + }; + + return data; + } + + function _templateObject86() { + var data = _taggedTemplateLiteral([""]); + + _templateObject86 = function _templateObject86() { + return data; + }; + + return data; + } + + function _templateObject85() { + var data = _taggedTemplateLiteral([""]); + + _templateObject85 = function _templateObject85() { + return data; + }; + + return data; + } + + function _templateObject84() { + var data = _taggedTemplateLiteral([""]); + + _templateObject84 = function _templateObject84() { + return data; + }; + + return data; + } + + function _templateObject83() { + var data = _taggedTemplateLiteral(["any content
"]); + + _templateObject83 = function _templateObject83() { + return data; + }; + + return data; + } + + function _templateObject82() { + var data = _taggedTemplateLiteral(["any content
"]); + + _templateObject82 = function _templateObject82() { + return data; + }; + + return data; + } + + function _templateObject81() { + var data = _taggedTemplateLiteral(["any content
"]); + + _templateObject81 = function _templateObject81() { + return data; + }; + + return data; + } + + function _templateObject80() { + var data = _taggedTemplateLiteral(["any content
"]); + + _templateObject80 = function _templateObject80() { + return data; + }; + + return data; + } + + function _templateObject79() { + var data = _taggedTemplateLiteral(["any content
"]); + + _templateObject79 = function _templateObject79() { + return data; + }; + + return data; + } + + function _templateObject78() { + var data = _taggedTemplateLiteral(["a=", ""]); + + _templateObject78 = function _templateObject78() { + return data; + }; + + return data; + } + + function _templateObject77() { + var data = _taggedTemplateLiteral(["", "
"]); + + _templateObject77 = function _templateObject77() { + return data; + }; + + return data; + } + + function _templateObject76() { + var data = _taggedTemplateLiteral(["a=", ""]); + + _templateObject76 = function _templateObject76() { + return data; + }; + + return data; + } + + function _templateObject75() { + var data = _taggedTemplateLiteral(["a ", ""]); + + _templateObject75 = function _templateObject75() { + return data; + }; + + return data; + } + + function _templateObject74() { + var data = _taggedTemplateLiteral(["a ", ""]); + + _templateObject74 = function _templateObject74() { + return data; + }; + + return data; + } + + function _templateObject73() { + var data = _taggedTemplateLiteral(["a ", ""]); + + _templateObject73 = function _templateObject73() { + return data; + }; + + return data; + } + + function _templateObject72() { + var data = _taggedTemplateLiteral(["a ", ""]); + + _templateObject72 = function _templateObject72() { + return data; + }; + + return data; + } + + function _templateObject71() { + var data = _taggedTemplateLiteral(["a ", ""]); + + _templateObject71 = function _templateObject71() { + return data; + }; + + return data; + } + + function _templateObject70() { + var data = _taggedTemplateLiteral(["", "
"]); + + _templateObject70 = function _templateObject70() { + return data; + }; + + return data; + } + + function _templateObject69() { + var data = _taggedTemplateLiteral(["", "
"]); + + _templateObject69 = function _templateObject69() { + return data; + }; + + return data; + } + + function _templateObject68() { + var data = _taggedTemplateLiteral(["", "
"]); + + _templateObject68 = function _templateObject68() { + return data; + }; + + return data; + } + + function _templateObject67() { + var data = _taggedTemplateLiteral([""]); + + _templateObject67 = function _templateObject67() { + return data; + }; + + return data; + } + + function _templateObject66() { + var data = _taggedTemplateLiteral([""]); + + _templateObject66 = function _templateObject66() { + return data; + }; + + return data; + } + + function _templateObject65() { + var data = _taggedTemplateLiteral([""]); + + _templateObject65 = function _templateObject65() { + return data; + }; + + return data; + } + + function _templateObject64() { + var data = _taggedTemplateLiteral(["\n ", ""]); + + _templateObject64 = function _templateObject64() { + return data; + }; + + return data; + } + + function _templateObject63() { + var data = _taggedTemplateLiteral(["\n ", ""]); + + _templateObject63 = function _templateObject63() { + return data; + }; + + return data; + } + + function _templateObject62() { + var data = _taggedTemplateLiteral(["", ""]); + + _templateObject62 = function _templateObject62() { + return data; + }; + + return data; + } + + function _templateObject61() { + var data = _taggedTemplateLiteral(["\n", "
"]); + + _templateObject45 = function _templateObject45() { + return data; + }; + + return data; + } + + function _templateObject44() { + var data = _taggedTemplateLiteral([""]); + + _templateObject44 = function _templateObject44() { + return data; + }; + + return data; + } + + function _templateObject43() { + var data = _taggedTemplateLiteral([""]); + + _templateObject43 = function _templateObject43() { + return data; + }; + + return data; + } + + function _templateObject42() { + var data = _taggedTemplateLiteral(["", "
", "1
\n "]); + + _templateObject11 = function _templateObject11() { + return data; + }; + + return data; + } + + function _templateObject10() { + var data = _taggedTemplateLiteral(["\n1
\n "]); + + _templateObject10 = function _templateObject10() { + return data; + }; + + return data; + } + + function _templateObject9() { + var data = _taggedTemplateLiteral(["OK
"]); + + _templateObject9 = function _templateObject9() { + return data; + }; + + return data; + } + + function _templateObject8() { + var data = _taggedTemplateLiteral(["\n1
\n2
\n3
\n "]); + + _templateObject8 = function _templateObject8() { + return data; + }; + + return data; + } + + function _templateObject7() { + var data = _taggedTemplateLiteral(["\n1
\n2
\n "]); + + _templateObject7 = function _templateObject7() { + return data; + }; + + return data; + } + + function _templateObject6() { + var data = _taggedTemplateLiteral(["how cool"]); + + _templateObject6 = function _templateObject6() { + return data; + }; + + return data; + } + + function _templateObject5() { + var data = _taggedTemplateLiteral(["", "
"]); + + _templateObject5 = function _templateObject5() { + return data; + }; + + return data; + } + + function _templateObject4() { + var data = _taggedTemplateLiteral(["click"]); + + _templateObject4 = function _templateObject4() { + return data; + }; + + return data; + } + + function _templateObject3() { + var data = _taggedTemplateLiteral(["", "
"]); + + _templateObject3 = function _templateObject3() { + return data; + }; + + return data; + } + + function _templateObject2() { + var data = _taggedTemplateLiteral(["", " world
"]); + + _templateObject2 = function _templateObject2() { + return data; + }; + + return data; + } + + function _templateObject() { + var data = _taggedTemplateLiteral(["\n\n Time: ", "\n
\n "]); + + _templateObject = function _templateObject() { + return data; + }; + + return data; + } + + tressa.title('HyperHTML'); + tressa.assert(typeof hyperHTML === 'function', 'hyperHTML is a function'); + + try { + tressa.log(''); + } catch (e) { + tressa.log = console.log.bind(console); + } + + tressa.async(function (done) { + tressa.log('## injecting text and attributes'); + var i = 0; var div = document.body.appendChild(document.createElement('div')); var render = hyperHTML.bind(div); - var html = update('hello').innerHTML; - function update(text) { - return render(_templateObject3, ['' + text + '']); + + function update(i) { + return render(_templateObject(), i, // IE Edge mobile did something funny here + // as template string returned xxx.xxxx + // but as innerHTML returned xxx.xx + (Math.random() * new Date()).toFixed(2)); } + function compare(html) { - return (/^\w+<\/strong><\/p>$/i.test(html)
- );
+ return /^\s* \s*Time: \d+\.\d+<[^>]+?>\s*<\/p>\s*$/i.test(html);
}
- tressa.assert(compare(html), 'HTML injected');
- tressa.assert(html === div.innerHTML, 'HTML returned');
- done(div);
- });
-}).then(function (div) {
- return tressa.async(function (done) {
- tressa.log('## function attributes');
- var render = hyperHTML.bind(div);
- var times = 0;
- update(function (e) {
- console.log(e.type);
- if (++times > 1) {
- return tressa.assert(false, 'events are broken');
+
+ var html = update(i++).innerHTML;
+ var p = div.querySelector('p');
+ var attr = p.attributes[0];
+ tressa.assert(compare(html), 'correct HTML');
+ tressa.assert(html === div.innerHTML, 'correctly returned');
+ setTimeout(function () {
+ tressa.log('## updating same nodes');
+ var html = update(i++).innerHTML;
+ tressa.assert(compare(html), 'correct HTML update');
+ tressa.assert(html === div.innerHTML, 'update applied');
+ tressa.assert(p === div.querySelector('p'), 'no node was changed');
+ tressa.assert(attr === p.attributes[0], 'no attribute was changed');
+ done();
+ });
+ }).then(function () {
+ return tressa.async(function (done) {
+ tressa.log('## perf: same virtual text twice');
+ var div = document.body.appendChild(document.createElement('div'));
+ var render = hyperHTML.bind(div);
+ var html = (update('hello').innerHTML, update('hello').innerHTML);
+
+ function update(text) {
+ return render(_templateObject2(), text);
+ }
+
+ tressa.assert(update('hello').innerHTML === update('hello').innerHTML, 'same text');
+ done(div);
+ });
+ }).then(function () {
+ return tressa.async(function (done) {
+ tressa.log('## injecting HTML');
+ var div = document.body.appendChild(document.createElement('div'));
+ var render = hyperHTML.bind(div);
+ var html = update('hello').innerHTML;
+
+ function update(text) {
+ return render(_templateObject3(), ['' + text + '']);
+ }
+
+ function compare(html) {
+ return /^ \w+<\/strong><\/p>$/i.test(html);
}
- if (e) {
- e.preventDefault();
- e.stopPropagation();
+
+ tressa.assert(compare(html), 'HTML injected');
+ tressa.assert(html === div.innerHTML, 'HTML returned');
+ done(div);
+ });
+ }).then(function (div) {
+ return tressa.async(function (done) {
+ tressa.log('## function attributes');
+ var render = hyperHTML.bind(div);
+ var times = 0;
+ update(function (e) {
+ console.log(e.type);
+
+ if (++times > 1) {
+ return tressa.assert(false, 'events are broken');
+ }
+
+ if (e) {
+ e.preventDefault();
+ e.stopPropagation();
+ }
+
+ tressa.assert(true, 'onclick invoked');
+ tressa.assert(!a.hasAttribute('onclick'), 'no attribute');
+ update(null);
+ e = document.createEvent('Event');
+ e.initEvent('click', false, false);
+ a.dispatchEvent(e);
+ done(div);
+ });
+
+ function update(click) {
+ // also test case-insensitive builtin events
+ return render(_templateObject4(), click);
}
- tressa.assert(true, 'onclick invoked');
- tressa.assert(!a.hasAttribute('onclick'), 'no attribute');
- update(null);
- e = document.createEvent('Event');
+
+ var a = div.querySelector('a');
+ var e = document.createEvent('Event');
e.initEvent('click', false, false);
a.dispatchEvent(e);
- done(div);
});
- function update(click) {
- // also test case-insensitive builtin events
- return render(_templateObject4, click);
- }
- var a = div.querySelector('a');
- var e = document.createEvent('Event');
- e.initEvent('click', false, false);
- a.dispatchEvent(e);
- });
-}).then(function (div) {
- return tressa.async(function (done) {
- tressa.log('## changing template');
- var render = hyperHTML.bind(div);
- var html = update('hello').innerHTML;
- function update(text) {
- return render(_templateObject3, { any: ['' + text + ''] });
- }
- function compare(html) {
- return (/^ \w+<\/em><\/p>$/i.test(html)
- );
- }
- tressa.assert(compare(html), 'new HTML injected');
- tressa.assert(html === div.innerHTML, 'new HTML returned');
- done(div);
- });
-}).then(function () {
- return tressa.async(function (done) {
- tressa.log('## custom events');
- var render = hyperHTML.bind(document.createElement('p'));
- var e = document.createEvent('Event');
- e.initEvent('Custom-EVENT', true, true);
- render(_templateObject5, function (e) {
- tressa.assert(e.type === 'Custom-EVENT', 'event triggered');
- done();
- }).firstElementChild.dispatchEvent(e);
- });
-}).then(function () {
- tressa.log('## multi wire removal');
- var render = hyperHTML.wire();
- var update = function update() {
- return render(_templateObject6);
- };
- update().remove();
- update = function update() {
- return render(_templateObject7);
- };
- update().remove();
- tressa.assert(true, 'OK');
-}).then(function () {
- tressa.log('## the attribute id');
- var div = document.createElement('div');
- hyperHTML.bind(div)(_templateObject8, 'id');
- tressa.assert(div.firstChild.id === 'id', 'the id is preserved');
- tressa.assert(div.firstChild.className === 'class', 'the class is preserved');
-}).then(function () {
- return tressa.async(function (done) {
- tressa.log('## hyperHTML.wire()');
+ }).then(function (div) {
+ return tressa.async(function (done) {
+ tressa.log('## changing template');
+ var render = hyperHTML.bind(div);
+ var html = update('hello').innerHTML;
+
+ function update(text) {
+ return render(_templateObject5(), {
+ any: ['' + text + '']
+ });
+ }
+
+ function compare(html) {
+ return /^ \w+<\/em><\/p>$/i.test(html);
+ }
+ tressa.assert(compare(html), 'new HTML injected');
+ tressa.assert(html === div.innerHTML, 'new HTML returned');
+ done(div);
+ });
+ }).then(function () {
+ return tressa.async(function (done) {
+ tressa.log('## custom events');
+ var render = hyperHTML.bind(document.createElement('p'));
+ var e = document.createEvent('Event');
+ e.initEvent('Custom-EVENT', true, true);
+ render(_templateObject6(), function (e) {
+ tressa.assert(e.type === 'Custom-EVENT', 'event triggered');
+ done();
+ }).firstElementChild.dispatchEvent(e);
+ });
+ }).then(function () {
+ tressa.log('## multi wire removal');
var render = hyperHTML.wire();
+
var update = function update() {
- return render(_templateObject9);
+ return render(_templateObject7());
};
- var node = update();
- tressa.assert(node.nodeName.toLowerCase() === 'p', 'correct node');
- var same = update();
- tressa.assert(node === same, 'same node returned');
- render = hyperHTML.wire(null);
+ update().remove();
+
update = function update() {
- return render(_templateObject10);
+ return render(_templateObject8());
};
- node = update().childNodes;
- tressa.assert(Array.isArray(node), 'list of nodes');
- same = update().childNodes;
- tressa.assert(node.length === same.length && node[0] && node.every(function (n, i) {
- return same[i] === n;
- }), 'same list returned');
+ update().remove();
+ tressa.assert(true, 'OK');
+ }).then(function () {
+ tressa.log('## the attribute id');
var div = document.createElement('div');
- render = hyperHTML.bind(div);
- render(_templateObject11, node);
- same = div.childNodes;
- tressa.assert(node[0] && node.every(function (n, i) {
- return same[i] === n;
- }), 'same list applied');
-
- function returnSame() {
- return render(_templateObject12);
- }
- render = hyperHTML.wire();
- tressa.assert(returnSame() === returnSame(), 'template sensible wire');
+ hyperHTML.bind(div)(_templateObject9(), 'id');
+ tressa.assert(div.firstChild.id === 'id', 'the id is preserved');
+ tressa.assert(div.firstChild.className === 'class', 'the class is preserved');
+ }).then(function () {
+ return tressa.async(function (done) {
+ tressa.log('## hyperHTML.wire()');
+ var render = hyperHTML.wire();
+
+ var update = function update() {
+ return render(_templateObject10());
+ };
+
+ var node = update();
+ tressa.assert(node.nodeName.toLowerCase() === 'p', 'correct node');
+ var same = update();
+ tressa.assert(node === same, 'same node returned');
+ render = hyperHTML.wire(null);
+
+ update = function update() {
+ return render(_templateObject11());
+ };
+
+ node = update().childNodes;
+ tressa.assert(Array.isArray(node), 'list of nodes');
+ same = update().childNodes;
+ tressa.assert(node.length === same.length && node[0] && node.every(function (n, i) {
+ return same[i] === n;
+ }), 'same list returned');
+ var div = document.createElement('div');
+ render = hyperHTML.bind(div);
+ render(_templateObject12(), node);
+ same = div.childNodes;
+ tressa.assert(node[0] && node.every(function (n, i) {
+ return same[i] === n;
+ }), 'same list applied');
+
+ function returnSame() {
+ return render(_templateObject13());
+ }
- done();
- });
-}).then(function () {
- return tressa.async(function (done) {
- tressa.log('## hyperHTML.wire(object)');
- var point = { x: 1, y: 2 };
- function update() {
- return hyperHTML.wire(point)(_templateObject13, '\n position: absolute;\n left: ' + point.x + 'px;\n top: ' + point.y + 'px;\n ');
- }
- try {
- update();
- } catch (e) {
- console.error(e);
- }
- tressa.assert(update() === update(), 'same output');
- tressa.assert(hyperHTML.wire(point) === hyperHTML.wire(point), 'same wire');
- done();
- });
-}).then(function () {
- if (typeof MutationObserver === 'undefined') return;
- return tressa.async(function (done) {
- tressa.log('## preserve first child where first child is the same as incoming');
- var div = document.body.appendChild(document.createElement('div'));
- var render = hyperHTML.bind(div);
- var observer = new MutationObserver(function (mutations) {
- for (var i = 0, len = mutations.length; i < len; i++) {
- trackMutations(mutations[i].addedNodes, 'added');
- trackMutations(mutations[i].removedNodes, 'removed');
+ render = hyperHTML.wire();
+ tressa.assert(returnSame() === returnSame(), 'template sensible wire');
+ done();
+ });
+ }).then(function () {
+ return tressa.async(function (done) {
+ tressa.log('## hyperHTML.wire(object)');
+ var point = {
+ x: 1,
+ y: 2
+ };
+
+ function update() {
+ return hyperHTML.wire(point)(_templateObject14(), "\n position: absolute;\n left: ".concat(point.x, "px;\n top: ").concat(point.y, "px;\n "));
+ }
+
+ try {
+ update();
+ } catch (e) {
+ console.error(e);
+ }
+
+ tressa.assert(update() === update(), 'same output');
+ tressa.assert(hyperHTML.wire(point) === hyperHTML.wire(point), 'same wire');
+ done();
+ });
+ }).then(function () {
+ if (typeof MutationObserver === 'undefined') return;
+ return tressa.async(function (done) {
+ tressa.log('## preserve first child where first child is the same as incoming');
+ var div = document.body.appendChild(document.createElement('div'));
+ var render = hyperHTML.bind(div);
+ var observer = new MutationObserver(function (mutations) {
+ for (var i = 0, len = mutations.length; i < len; i++) {
+ trackMutations(mutations[i].addedNodes, 'added');
+ trackMutations(mutations[i].removedNodes, 'removed');
+ }
+ });
+ observer.observe(div, {
+ childList: true,
+ subtree: true
+ });
+ var counters = [];
+
+ function trackMutations(nodes, countKey) {
+ for (var i = 0, len = nodes.length, counter, key; i < len; i++) {
+ if (nodes[i] && nodes[i].getAttribute && nodes[i].getAttribute('data-test')) {
+ key = nodes[i].getAttribute('data-test');
+ counter = counters[key] || (counters[key] = {
+ added: 0,
+ removed: 0
+ });
+ counter[countKey]++;
+ }
+
+ if (nodes[i].childNodes.length > 0) {
+ trackMutations(nodes[i].childNodes, countKey);
+ }
+ }
+ }
+
+ var listItems = [];
+
+ function update(items) {
+ render(_templateObject15(), items.map(function (item, i) {
+ return hyperHTML.wire(listItems[i] || (listItems[i] = {}))(_templateObject16(), i, function () {
+ return item.text;
+ });
+ }));
+ }
+
+ update([]);
+ setTimeout(function () {
+ update([{
+ text: 'test1'
+ }]);
+ }, 10);
+ setTimeout(function () {
+ update([{
+ text: 'test1'
+ }, {
+ text: 'test2'
+ }]);
+ }, 20);
+ setTimeout(function () {
+ update([{
+ text: 'test1'
+ }]);
+ }, 30);
+ setTimeout(function () {
+ if (counters.length) {
+ tressa.assert(counters[0].added === 1, 'first item added only once');
+ tressa.assert(counters[0].removed === 0, 'first item never removed');
+ }
+
+ done();
+ }, 100);
+ });
+ }).then(function () {
+ tressa.log('## rendering one node');
+ var div = document.createElement('div');
+ var br = document.createElement('br');
+ var hr = document.createElement('hr');
+ hyperHTML.bind(div)(_templateObject17(), br);
+ tressa.assert(div.firstChild.firstChild === br, 'one child is added');
+ hyperHTML.bind(div)(_templateObject18(), hr);
+ tressa.assert(div.firstChild.firstChild === hr, 'one child is changed');
+ hyperHTML.bind(div)(_templateObject19(), [hr, br]);
+ tressa.assert(div.firstChild.childNodes[0] === hr && div.firstChild.childNodes[1] === br, 'more children are added');
+ hyperHTML.bind(div)(_templateObject20(), [br, hr]);
+ tressa.assert(div.firstChild.childNodes[0] === br && div.firstChild.childNodes[1] === hr, 'children can be swapped');
+ hyperHTML.bind(div)(_templateObject21(), br);
+ tressa.assert(div.firstChild.firstChild === br, 'one child is kept');
+ hyperHTML.bind(div)(_templateObject22(), []);
+ tressa.assert(/