dothtml 4.8.6 → 5.0.0

package/unittests/{core.js → core.ts}

@@ -13,10 +13,11 @@ function formatHTML(html){
 	html = html.split(" value=\"\"").join("");
 	html = html.split(" type=submit").join("");
 	html = html.split("\"").join("");
+	html = html.split("\'").join("");
 	return html;
 }
 
-export default function addTest(description, testFunc, expected, testTimeout){
+export default function addTest(description: string, testFunc: Function, expected: string|Array<string>, testTimeout?: number){
 	//if(description != "Conditional rendering - if true->false elseif false->true.") return;
 	// let exception = null;
 	// try{
@@ -43,7 +44,9 @@ export default function addTest(description, testFunc, expected, testTimeout){
 						let testExpected = formatHTML(expected[i]);
 						if(testExpected == processedResult) break;
 					}
-					if(!i == expected.length) i = 0;
+					// Not sure how this was supposed to work???
+					// if(!i == expected.length) i = 0;
+					if(i == expected.length) i = 0;
 					expect(processedResult).toBe(formatHTML(expected[i]));
 				}
 				else{

package/unittests/element-and-attribute-coverage.test.ts

@@ -0,0 +1,472 @@
+import dot from "../src/dot";
+import addTest from "./core";
+var dotDocuments = [...new Set([
+	"as",
+	"el",
+	"h",
+	"t",
+	"iterate",
+	"each",
+	"remove",
+	"getLast",
+	"empty",
+	"script",
+	"when",
+	"otherwiseWhen",
+	"otherwise",
+	"a",
+	"aside",
+	"abbr",
+	"address",
+	"area",
+	"article",
+	"audio",
+	"b",
+	"bdi",
+	"bdo",
+	"blockQuote",
+	"body",
+	"br",
+	"button",
+	"canvas",
+	"caption",
+	"cite",
+	"code",
+	"col",
+	"colGroup",
+	"content",
+	"data",
+	"dataList",
+	"dd",
+	"del",
+	"details",
+	"dfn",
+	"dialog",
+	"div",
+	"dl",
+	"dt",
+	"em",
+	"embed",
+	"fieldSet",
+	"figCaption",
+	"figure",
+	"footer",
+	"form",
+	"h1",
+	"h2",
+	"h3",
+	"h4",
+	"h5",
+	"h6",
+	"header",
+	"hr",
+	"i",
+	"iFrame",
+	"img",
+	"input",
+	"ins",
+	"kbd",
+	"keyGen",
+	"label",
+	"legend",
+	"li",
+	"main",
+	"map",
+	"mark",
+	"menu",
+	"meter",
+	"nav",
+	"object",
+	"ol",
+	"optGroup",
+	"option",
+	"output",
+	"p",
+	"param",
+	"pre",
+	"progress",
+	"q",
+	"rp",
+	"rt",
+	"ruby",
+	"s",
+	"samp",
+	"section",
+	"select",
+	"small",
+	"source",
+	"span",
+	"strong",
+	"svg",
+	"sub",
+	"summary",
+	"sup",
+	"table",
+	"tBody",
+	"td",
+	"textArea",
+	"tFoot",
+	"th",
+	"tHead",
+	"time",
+	"tr",
+	"track",
+	"u",
+	"ul",
+	"var",
+	"video",
+	"wbr"
+])];
+
+var dotElements = [...new Set([
+	"attr",
+	"scopeClass",
+	"bgColor",
+	"color",
+	"aLink",
+	"archive",
+	"accessKey",
+	"class",
+	"contentEditable",
+	"dir",
+	"draggable",
+	"dropZone",
+	"hidden",
+	"id",
+	"itemProp",
+	"lang",
+	"spellCheck",
+	"style",
+	"tabIndex",
+	"title",
+	"onHashChange",
+	"onOffline",
+	"onOnline",
+	"onPageHide",
+	"onPageShow",
+	"onPopState",
+	"onResize",
+	"onStorage",
+	"onSearch",
+	"onToggle",
+	"onAbort",
+	"onCantPlayThrough",
+	"onDurationChange",
+	"onEmptied",
+	"onEnded",
+	"onLoadedData",
+	"onLoadStart",
+	"onLoadedMetadata",
+	"onPause",
+	"onPlay",
+	"onPlaying",
+	"onProgress",
+	"onRateChange",
+	"onSeeked",
+	"onSeeking",
+	"onStalled",
+	"onSuspend",
+	"onTimeUpdate",
+	"onVolumeChange",
+	"onWaiting",
+	"onCanPlay",
+	"onContextMenu",
+	"onCopy",
+	"onCut",
+	"onPagePaste",
+	"onCueChange",
+	"onDrag",
+	"onDragEnd",
+	"onDragStart",
+	"onDragEnter",
+	"onDragOver",
+	"onDragLeave",
+	"onDrop",
+	"onError",
+	"onInvalid",
+	"onMouseWheel",
+	"onWheel",
+	"onBlur",
+	"onChange",
+	"onClick",
+	"onDblClick",
+	"onFocus",
+	"onInput",
+	"onKeyDown",
+	"onKeyPress",
+	"onKeyUp",
+	"onLoad",
+	"onMouseDown",
+	"onMouseEnter",
+	"onMouseMove",
+	"onMouseOut",
+	"onMouseOver",
+	"onMouseUp",
+	"onReset",
+	"onScroll",
+	"onSelect",
+	"onSubmit",
+	"onUnload",
+	"download",
+	"hRef",
+	"hRefLang",
+	"media",
+	"ping",
+	"rel",
+	"rev",
+	"target",
+	"type",
+	"alt",
+	"coords",
+	"download",
+	"media",
+	"noHRef",
+	"rel",
+	"shape",
+	"target",
+	"autoPlay",
+	"buffered",
+	"controls",
+	"loop",
+	"muted",
+	"preload",
+	"src",
+	"pause",
+	"play",
+	"stop",
+	"quoteCite",
+	"align",
+	"background",
+	"clear",
+	"autoFocus",
+	"formAction",
+	"disabled",
+	"name",
+	"type",
+	"whichForm",
+	"value",
+	"height",
+	"width",
+	"charOff",
+	"colSpan",
+	"vAlign",
+	"charOff",
+	"colSpan",
+	"vAlign",
+	"dateTime",
+	"quoteCite",
+	"open",
+	"height",
+	"src",
+	"type",
+	"width",
+	"disabled",
+	"name",
+	"whichForm",
+	"acceptCharset",
+	"action",
+	"autoComplete",
+	"encType",
+	"method",
+	"name",
+	"noValidate",
+	"rel",
+	"target",
+	"noShade",
+	"height",
+	"longDesc",
+	"marginHeight",
+	"marginWidth",
+	"name",
+	"sandbox",
+	"scrolling",
+	"seamless",
+	"src",
+	"srcDoc",
+	"width",
+	"alt",
+	"height",
+	"hSpace",
+	"isMap",
+	"longDesc",
+	"sizes",
+	"src",
+	"srcSet",
+	"useMap",
+	"width",
+	"accept",
+	"alt",
+	"autoComplete",
+	"autoFocus",
+	"checked",
+	"dirName",
+	"disabled",
+	"formAction",
+	"list",
+	"max",
+	"maxLength",
+	"min",
+	"multiple",
+	"name",
+	"pattern",
+	"placeholder",
+	"readOnly",
+	"required",
+	"size",
+	"src",
+	"step",
+	"type",
+	"whichForm",
+	"value",
+	"width",
+	"bindTo",
+	"getVal",
+	"setVal",
+	"dateTime",
+	"quoteCite",
+	"challenge",
+	"keyType",
+	"for",
+	"whichForm",
+	"value",
+	"name",
+	"type",
+	"high",
+	"low",
+	"max",
+	"min",
+	"optimum",
+	"whichForm",
+	"value",
+	"classId",
+	"codeBase",
+	"codeType",
+	"objectData",
+	"declare",
+	"height",
+	"name",
+	"standby",
+	"type",
+	"useMap",
+	"whichForm",
+	"width",
+	"reversed",
+	"start",
+	"disabled",
+	"disabled",
+	"optionLabel",
+	"selected",
+	"value",
+	"bindTo",
+	"getVal",
+	"setVal",
+	"for",
+	"name",
+	"whichForm",
+	"name",
+	"value",
+	"valueType",
+	"max",
+	"value",
+	"quoteCite",
+	"autoFocus",
+	"disabled",
+	"multiple",
+	"name",
+	"required",
+	"size",
+	"whichForm",
+	"bindTo",
+	"getVal",
+	"setVal",
+	"media",
+	"src",
+	"type",
+	"sizes",
+	"src",
+	"srcSet",
+	"type",
+	"border",
+	"cellPadding",
+	"cellSpacing",
+	"frame",
+	"rules",
+	"tableSummary",
+	"autoFocus",
+	"cols",
+	"dirName",
+	"disabled",
+	"maxLength",
+	"name",
+	"placeholder",
+	"readOnly",
+	"required",
+	"rows",
+	"whichForm",
+	"wrap",
+	"bindTo",
+	"getVal",
+	"setVal",
+	"charOff",
+	"vAlign",
+	"axis",
+	"char",
+	"colSpan",
+	"charOff",
+	"headers",
+	"nowrap",
+	"rowSpan",
+	"vAlign",
+	"charOff",
+	"vAlign",
+	"dateTime",
+	"axis",
+	"colSpan",
+	"charOff",
+	"headers",
+	"rowSpan",
+	"scope",
+	"vAlign",
+	"charOff",
+	"vAlign",
+	"charOff",
+	"vAlign",
+	"default",
+	"kind",
+	"src",
+	"srcLang",
+	"trackLabel",
+	"autoPlay",
+	"buffered",
+	"controls",
+	"height",
+	"loop",
+	"muted",
+	"poster",
+	"preload",
+	"src",
+	"width",
+	"pause",
+	"play",
+	"stop",
+])];
+
+for(let s of dotDocuments){
+	addTest(`${s} - core`, ()=>{
+		return dot.t(typeof dot[s])
+	}, "function");
+	addTest(`${s} - query`, ()=>{
+		return dot.t(typeof dot("body")[s])
+	}, "function");
+	addTest(`${s} - next`, ()=>{
+		return dot.t(typeof dot.div()[s])
+	}, "function");
+}
+for(let s of dotElements){
+	addTest(`${s} - query`, ()=>{
+		return dot.t(typeof dot("body")[s])
+	}, "function");
+	addTest(`${s} - next`, ()=>{
+		return dot.t(typeof dot.div()[s])
+	}, "function");
+}

package/unittests/hooks.test.ts

@@ -0,0 +1,67 @@
+import addTest from "./core";
+import dot from "../src/dothtml";
+import Component from "../src/component";
+
+// Testing hooks:
+// class CompHooksRegister extends Component{
+// 	x: number = 0;
+// 	add: boolean = false;
+
+// 	register(){ this.x = (this.x || 0); this.add1(); }
+// 	builder(x, add){this.x = x||this.x; this.add = add||this.add; if(this.add)this.add1(); return dot.div(this.x) }
+// 	add1(){ this.x++ }
+// }
+
+class CompHooksCreate extends Component{
+	myEl: Element;
+	testVal: any;
+	created(val){ this.myEl = this.$el; this.testVal = val }
+	builder(){ return dot.div("val: " + this.testVal + ", hadEl: " + (this.myEl ? "yes" : "no")) }
+}
+
+class CompHooksDelete extends Component{
+	deleteMe: boolean;
+	addEarlyMessage: boolean;
+	addLateMessage: boolean;
+	messageInSibling: string;
+	parent: ChildNode | ParentNode;
+	
+	created(deleteMe: boolean, addEarlyMessage: boolean, addLateMessage: boolean, messageInSibling: string){
+		this.deleteMe = deleteMe;
+		this.addEarlyMessage = addEarlyMessage;
+		this.addLateMessage = addLateMessage;
+		this.messageInSibling = messageInSibling;
+	}
+	builder(){ return dot.span("not deleted"); }
+	ready(){ this.parent = this.messageInSibling ? this.$el.parentNode.nextSibling : this.$el.parentNode; if(this.deleteMe) dot(this.parent).empty(); }
+	deleting(){ 
+		if(this.addEarlyMessage) dot(this.messageInSibling ? this.$el.parentNode.nextSibling : this.$el.parentNode ).p("deleted"); 
+	}
+	deleted(){ if(this.addLateMessage) dot(this.parent).b(this.$el ? "failure" : "success"); }
+}
+
+// register
+// I guess these are no longer valid.
+// addTest("Register hook gets called once.", function(){return dot.h(new CompHooksRegister())}, "<div>1</div>");
+// addTest("Register hook gets called only once.", function(){return dot.h(new CompHooksRegister())}, "<div>1</div>");
+// addTest("Prototype vars set by register cook can be updated.", function(){return dot.h(new CompHooksRegister(true))}, "<div>2</div>");
+// addTest("Prototype vars are cloned from prototype.", function(){return dot.h(new CompHooksRegister())}, "<div>1</div>"); // Kind of a weird javascript behavior. Cool though.
+
+// create
+addTest("Created hook.", function(){return dot.h(new CompHooksCreate("abc"));}, "<div>val: abc, hadEl: no</div>");
+
+// delete
+addTest("Delete hook doesn't get called right away.", function(){return dot.div(new CompHooksDelete());}, "<div><span>not deleted</span></div>");
+addTest("Deleting hook.", function(){return dot.div(new CompHooksDelete(true, true));}, "<div><p>deleted</p></div>");
+addTest("Deleted hook.", function(){return dot.div(new CompHooksDelete(true, false, true));}, "<div><b>success</b></div>");
+
+//Ensure deletion happens for inner components when using remove.
+addTest("Nested deleting via remove().", function(){ return dot.h(function(){ var ret = dot.i().div(
+	new CompHooksDelete(false, true, false, true)
+); var del = ret.getLast(); 
+ret = ret.b(); setTimeout(function(){dot(del).remove() }, 0); return ret; }) }, "<i></i><b><p>deleted</p></b>");
+
+addTest("Nested deleted via remove().", function(){ return dot.h(function(){ var ret = dot.i().div(
+	new CompHooksDelete(false, false, true, true)
+); var del = ret.getLast(); 
+ret = ret.b(); setTimeout(function(){dot(del).remove() }, 0); return ret; }) }, "<i></i><b><b>success</b></b>");

package/unittests/immutable-if.test.ts

@@ -0,0 +1,19 @@
+import addTest from "./core";
+import dot from "../src/dothtml";
+
+addTest("Conditional true.", function(){ return dot.h(1).when(true, dot.h("true")).h(2); }, "1true2");
+addTest("Conditional false.", function(){ return dot.h(1).when(false, dot.h("false")).h(2); }, "12");
+addTest("Conditional true true.", function(){ return dot.h(1).when(true, dot.h(2)).when(true, dot.h(3)).h(4); }, "1234");
+
+// No longer valid - use class bindings.
+//addTest("Conditional class.", function(){ return dot.div(1).when(true, dot["class"](2)); }, "<div class=\"2\">1</div>");
+
+//Not sure if the following two cases should be supported. They are broken as of 1.3.0, but I don't know if that matters.
+//addTest("Conditional deep class.", function(){ return dot.div(1).when(true, dot.when(true, dot["class"](2))); }, "<div class=\"2\">1</div>");
+//addTest("Conditional deep class with more confusion.", function(){ return dot.div(1).when(true, dot.when(true, dot["class"](2)).div(3)); }, "<div class=\"2\">1</div><div>3</div>");
+
+// Truthiness.
+
+// No longer valid in ts.
+// addTest("If null.", function(){ return dot.when(null, "if").otherwise("else"); }, "else");
+// addTest("If {}.", function(){ return dot.when({}, "if").otherwise("else"); }, "if");