Fixes issues in the PR "Button widget data attributes" (#7852)

* fix: fixed ordered attributes handling and improved tests to catch event attributes

* fix: clean up code from testing

* fix: more tests and refactoring

* fix: use lowercase when checking for event attribute prefix

* fix: use lowercase when checking for event attribute prefix

* fix: changed comment wording

* fix: minor refactoring

* refactor: for brevity

core/modules/parsers/wikiparser/rules/conditional.js

@@ -1,120 +0,0 @@
-/*\
-title: $:/core/modules/parsers/wikiparser/rules/conditional.js
-type: application/javascript
-module-type: wikirule
-
-Conditional shortcut syntax
-
-```
-This is a <% if [{something}] %>Elephant<% elseif [{else}] %>Pelican<% else %>Crocodile<% endif %>
-```
-
-\*/
-(function(){
-
-/*jslint node: true, browser: true */
-/*global $tw: false */
-"use strict";
-
-exports.name = "conditional";
-exports.types = {inline: true, block: true};
-
-exports.init = function(parser) {
-	this.parser = parser;
-	// Regexp to match
-	this.matchRegExp = /\<\%\s*if\s+/mg;
-	this.terminateIfRegExp = /\%\>/mg;
-};
-
-exports.findNextMatch = function(startPos) {
-	// Look for the next <% if shortcut
-	this.matchRegExp.lastIndex = startPos;
-	this.match = this.matchRegExp.exec(this.parser.source);
-	// If not found then return no match
-	if(!this.match) {
-		return undefined;
-	}
-	// Check for the next %>
-	this.terminateIfRegExp.lastIndex = this.match.index;
-	this.terminateIfMatch = this.terminateIfRegExp.exec(this.parser.source);
-	// If not found then return no match
-	if(!this.terminateIfMatch) {
-		return undefined;
-	}
-	// Return the position at which the construction was found
-	return this.match.index;
-};
-
-/*
-Parse the most recent match
-*/
-exports.parse = function() {
-	// Get the filter condition
-	var filterCondition = this.parser.source.substring(this.match.index + this.match[0].length,this.terminateIfMatch.index);
-	// Advance the parser position to past the %>
-	this.parser.pos = this.terminateIfMatch.index + this.terminateIfMatch[0].length;
-	// Parse the if clause
-	return this.parseIfClause(filterCondition);
-};
-
-exports.parseIfClause = function(filterCondition) {
-	// Create the list widget
-	var listWidget = {
-		type: "list",
-		tag: "$list",
-		isBlock: this.is.block,
-		children: [
-			{
-				type: "list-template",
-				tag: "$list-template"
-			},
-			{
-				type: "list-empty",
-				tag: "$list-empty"
-			}
-		]
-	};
-	$tw.utils.addAttributeToParseTreeNode(listWidget,"filter",filterCondition);
-	$tw.utils.addAttributeToParseTreeNode(listWidget,"variable","condition");
-	$tw.utils.addAttributeToParseTreeNode(listWidget,"limit","1");
-	// Check for an immediately following double linebreak
-	var hasLineBreak = !!$tw.utils.parseTokenRegExp(this.parser.source,this.parser.pos,/([^\S\n\r]*\r?\n(?:[^\S\n\r]*\r?\n|$))/g);
-	// Parse the body looking for else or endif
-	var reEndString = "\\<\\%\\s*(endif)\\s*\\%\\>|\\<\\%\\s*(else)\\s*\\%\\>|\\<\\%\\s*(elseif)\\s+([\\s\\S]+?)\\%\\>",
-		ex;
-	if(hasLineBreak) {
-		ex = this.parser.parseBlocksTerminatedExtended(reEndString);
-	} else {
-		var reEnd = new RegExp(reEndString,"mg");
-		ex = this.parser.parseInlineRunTerminatedExtended(reEnd,{eatTerminator: true});
-	}
-	// Put the body into the list template
-	listWidget.children[0].children = ex.tree;
-	// Check for an else or elseif
-	if(ex.match) {
-		if(ex.match[1] === "endif") {
-			// Nothing to do if we just found an endif
-		} else if(ex.match[2] === "else") {
-			// Check for an immediately following double linebreak
-			hasLineBreak = !!$tw.utils.parseTokenRegExp(this.parser.source,this.parser.pos,/([^\S\n\r]*\r?\n(?:[^\S\n\r]*\r?\n|$))/g);
-			// If we found an else then we need to parse the body looking for the endif
-			var reEndString = "\\<\\%\\s*(endif)\\s*\\%\\>",
-			ex;
-			if(hasLineBreak) {
-				ex = this.parser.parseBlocksTerminatedExtended(reEndString);
-			} else {
-				var reEnd = new RegExp(reEndString,"mg");
-				ex = this.parser.parseInlineRunTerminatedExtended(reEnd,{eatTerminator: true});
-			}
-			// Put the parsed content inside the list empty template
-			listWidget.children[1].children = ex.tree;
-		} else if(ex.match[3] === "elseif") {
-			// Parse the elseif clause by reusing this parser, passing the new filter condition
-			listWidget.children[1].children = this.parseIfClause(ex.match[4]);
-		}
-	}
-	// Return the parse tree node
-	return [listWidget];
-};
-
-})();

core/modules/parsers/wikiparser/rules/transcludeblock.js

@@ -81,9 +81,6 @@ exports.parse = function() {
 			}
 			return [tiddlerNode];
 		} else {
-			// No template or text reference is provided, so we'll use a blank target. Otherwise we'll generate
-			// a transclude widget that transcludes the current tiddler, often leading to recursion errors
-			transcludeNode.attributes["$tiddler"] = {name: "$tiddler", type: "string", value: ""};
 			return [transcludeNode];
 		}
 	}

core/modules/parsers/wikiparser/rules/transcludeinline.js

@@ -79,9 +79,6 @@ exports.parse = function() {
 			}
 			return [tiddlerNode];
 		} else {
-			// No template or text reference is provided, so we'll use a blank target. Otherwise we'll generate
-			// a transclude widget that transcludes the current tiddler, often leading to recursion errors
-			transcludeNode.attributes["$tiddler"] = {name: "$tiddler", type: "string", value: ""};
 			return [transcludeNode];
 		}
 	}

core/modules/parsers/wikiparser/wikiparser.js

@@ -223,7 +223,7 @@ Parse a block from the current position
 	terminatorRegExpString: optional regular expression string that identifies the end of plain paragraphs. Must not include capturing parenthesis
 */
 WikiParser.prototype.parseBlock = function(terminatorRegExpString) {
-	var terminatorRegExp = terminatorRegExpString ? new RegExp(terminatorRegExpString + "|\\r?\\n\\r?\\n","mg") : /(\r?\n\r?\n)/mg;
+	var terminatorRegExp = terminatorRegExpString ? new RegExp("(" + terminatorRegExpString + "|\\r?\\n\\r?\\n)","mg") : /(\r?\n\r?\n)/mg;
 	this.skipWhitespace();
 	if(this.pos >= this.sourceLength) {
 		return [];
@@ -263,22 +263,12 @@ WikiParser.prototype.parseBlocksUnterminated = function() {
 	return tree;
 };
 
-/*
-Parse blocks of text until a terminating regexp is encountered. Wrapper for parseBlocksTerminatedExtended that just returns the parse tree
-*/
-WikiParser.prototype.parseBlocksTerminated = function(terminatorRegExpString) {
-	var ex = this.parseBlocksTerminatedExtended(terminatorRegExpString);
-	return ex.tree;
-};
-
 /*
 Parse blocks of text until a terminating regexp is encountered
 */
-WikiParser.prototype.parseBlocksTerminatedExtended = function(terminatorRegExpString) {
+WikiParser.prototype.parseBlocksTerminated = function(terminatorRegExpString) {
-	var terminatorRegExp = new RegExp(terminatorRegExpString,"mg"),
+	var terminatorRegExp = new RegExp("(" + terminatorRegExpString + ")","mg"),
-		result = {
+		tree = [];
-			tree: []
-		};
 	// Skip any whitespace
 	this.skipWhitespace();
 	//  Check if we've got the end marker
@@ -287,7 +277,7 @@ WikiParser.prototype.parseBlocksTerminatedExtended = function(terminatorRegExpSt
 	// Parse the text into blocks
 	while(this.pos < this.sourceLength && !(match && match.index === this.pos)) {
 		var blocks = this.parseBlock(terminatorRegExpString);
-		result.tree.push.apply(result.tree,blocks);
+		tree.push.apply(tree,blocks);
 		// Skip any whitespace
 		this.skipWhitespace();
 		//  Check if we've got the end marker
@@ -296,9 +286,8 @@ WikiParser.prototype.parseBlocksTerminatedExtended = function(terminatorRegExpSt
 	}
 	if(match && match.index === this.pos) {
 		this.pos = match.index + match[0].length;
-		result.match = match;
 	}
-	return result;
+	return tree;
 };
 
 /*
@@ -341,11 +330,6 @@ WikiParser.prototype.parseInlineRunUnterminated = function(options) {
 };
 
 WikiParser.prototype.parseInlineRunTerminated = function(terminatorRegExp,options) {
-	var ex = this.parseInlineRunTerminatedExtended(terminatorRegExp,options);
-	return ex.tree;
-};
-
-WikiParser.prototype.parseInlineRunTerminatedExtended = function(terminatorRegExp,options) {
 	options = options || {};
 	var tree = [];
 	// Find the next occurrence of the terminator
@@ -365,10 +349,7 @@ WikiParser.prototype.parseInlineRunTerminatedExtended = function(terminatorRegEx
 				if(options.eatTerminator) {
 					this.pos += terminatorMatch[0].length;
 				}
-				return {
+				return tree;
-					match: terminatorMatch,
-					tree: tree
-				};
 			}
 		}
 		// Process any inline rule, along with the text preceding it
@@ -392,9 +373,7 @@ WikiParser.prototype.parseInlineRunTerminatedExtended = function(terminatorRegEx
 		this.pushTextWidget(tree,this.source.substr(this.pos),this.pos,this.sourceLength);
 	}
 	this.pos = this.sourceLength;
-	return {
+	return tree;
-		tree: tree
-	};
 };
 
 /*

core/modules/utils/fakedom.js

@@ -104,7 +104,11 @@ TW_Element.prototype.setAttribute = function(name,value) {
 	if(this.isRaw) {
 		throw "Cannot setAttribute on a raw TW_Element";
 	}
-	this.attributes[name] = value + "";
+	if(name === "style") {
+		this.style = value;
+	} else {
+		this.attributes[name] = value + "";
+	}
 };
 
 TW_Element.prototype.setAttributeNS = function(namespace,name,value) {

core/modules/widgets/browse.js

@@ -70,6 +70,11 @@ BrowseWidget.prototype.render = function(parent,nextSibling) {
 		}
 		return false;
 	},false);
+	// Assign data- attributes
+	this.assignAttributes(domNode,{
+		sourcePrefix: "data-",
+		destPrefix: "data-"
+	});
 	// Insert element
 	parent.insertBefore(domNode,nextSibling);
 	this.renderChildren(domNode,null);
@@ -95,6 +100,11 @@ BrowseWidget.prototype.execute = function() {
 Selectively refreshes the widget if needed. Returns true if the widget or any of its children needed re-rendering
 */
 BrowseWidget.prototype.refresh = function(changedTiddlers) {
+	var changedAttributes = this.computeAttributes();
+	if($tw.utils.count(changedAttributes) > 0) {
+		this.refreshSelf();
+		return true;	
+	}
 	return false;
 };
 

core/modules/widgets/button.js

@@ -59,6 +59,11 @@ ButtonWidget.prototype.render = function(parent,nextSibling) {
 		$tw.utils.pushTop(classes,"tc-popup-handle");
 	}
 	domNode.className = classes.join(" ");
+	// Assign data- attributes
+	this.assignAttributes(domNode,{
+		sourcePrefix: "data-",
+		destPrefix: "data-"
+	});
 	// Assign other attributes
 	if(this.style) {
 		domNode.setAttribute("style",this.style);
@@ -250,7 +255,7 @@ ButtonWidget.prototype.updateDomNodeClasses = function() {
 	//Add new classes from updated class attribute.
 	$tw.utils.pushTop(domNodeClasses,newClasses);
 	this.domNode.className = domNodeClasses.join(" ");
-}
+};
 
 /*
 Selectively refreshes the widget if needed. Returns true if the widget or any of its children needed re-rendering
@@ -260,8 +265,15 @@ ButtonWidget.prototype.refresh = function(changedTiddlers) {
 	if(changedAttributes.actions || changedAttributes.to || changedAttributes.message || changedAttributes.param || changedAttributes.set || changedAttributes.setTo || changedAttributes.popup || changedAttributes.hover || changedAttributes.selectedClass || changedAttributes.style || changedAttributes.dragFilter || changedAttributes.dragTiddler || (this.set && changedTiddlers[this.set]) || (this.popup && changedTiddlers[this.popup]) || (this.popupTitle && changedTiddlers[this.popupTitle]) || changedAttributes.popupAbsCoords || changedAttributes.setTitle || changedAttributes.setField || changedAttributes.setIndex || changedAttributes.popupTitle || changedAttributes.disabled || changedAttributes["default"]) {
 		this.refreshSelf();
 		return true;
-	} else if(changedAttributes["class"]) {
+	} else {
-		this.updateDomNodeClasses();
+		if(changedAttributes["class"]) {
+			this.updateDomNodeClasses();
+		}
+		this.assignAttributes(this.domNodes[0],{
+			changedAttributes: changedAttributes,
+			sourcePrefix: "data-",
+			destPrefix: "data-"
+		});
 	}
 	return this.refreshChildren(changedTiddlers);
 };

core/modules/widgets/checkbox.js

@@ -53,6 +53,11 @@ CheckboxWidget.prototype.render = function(parent,nextSibling) {
 	this.labelDomNode.appendChild(this.inputDomNode);
 	this.spanDomNode = this.document.createElement("span");
 	this.labelDomNode.appendChild(this.spanDomNode);
+	// Assign data- attributes
+	this.assignAttributes(this.inputDomNode,{
+		sourcePrefix: "data-",
+		destPrefix: "data-"
+	});
 	// Add a click event handler
 	$tw.utils.addEventListeners(this.inputDomNode,[
 		{name: "change", handlerObject: this, handlerMethod: "handleChangeEvent"}
@@ -325,6 +330,11 @@ CheckboxWidget.prototype.refresh = function(changedTiddlers) {
 				$tw.utils.removeClass(this.labelDomNode,"tc-checkbox-checked");
 			}
 		}
+		this.assignAttributes(this.inputDomNode,{
+			changedAttributes: changedAttributes,
+			sourcePrefix: "data-",
+			destPrefix: "data-"
+		});
 		return this.refreshChildren(changedTiddlers) || refreshed;
 	}
 };
@@ -332,3 +342,4 @@ CheckboxWidget.prototype.refresh = function(changedTiddlers) {
 exports.checkbox = CheckboxWidget;
 
 })();
+	

core/modules/widgets/draggable.js

@@ -52,6 +52,11 @@ DraggableWidget.prototype.render = function(parent,nextSibling) {
 		classes.push("tc-draggable");
 	}
 	domNode.setAttribute("class",classes.join(" "));
+	// Assign data- attributes and style. attributes
+	this.assignAttributes(domNode,{
+		sourcePrefix: "data-",
+		destPrefix: "data-"
+	});
 	// Insert the node into the DOM and render any children
 	parent.insertBefore(domNode,nextSibling);
 	this.renderChildren(domNode,null);
@@ -108,13 +113,19 @@ DraggableWidget.prototype.updateDomNodeClasses = function() {
 Selectively refreshes the widget if needed. Returns true if the widget or any of its children needed re-rendering
 */
 DraggableWidget.prototype.refresh = function(changedTiddlers) {
-	var changedAttributes = this.computeAttributes(),
+	var changedAttributes = this.computeAttributes();
-		changedAttributesCount = $tw.utils.count(changedAttributes);
+	if(changedAttributes.tag || changedAttributes.selector || changedAttributes.dragimagetype || changedAttributes.enable || changedAttributes.startactions || changedAttributes.endactions) {
-	if(changedAttributesCount === 1 && changedAttributes["class"]) {
-		this.updateDomNodeClasses();
-	} else if(changedAttributesCount > 0) {
 		this.refreshSelf();
 		return true;
+	} else {
+		if(changedAttributes["class"]) {
+			this.assignDomNodeClasses();
+		}
+		this.assignAttributes(this.domNodes[0],{
+			changedAttributes: changedAttributes,
+			sourcePrefix: "data-",
+			destPrefix: "data-"
+		});
 	}
 	return this.refreshChildren(changedTiddlers);
 };

core/modules/widgets/droppable.js

@@ -42,6 +42,11 @@ DroppableWidget.prototype.render = function(parent,nextSibling) {
 	domNode = this.document.createElement(tag);
 	this.domNode = domNode;
 	this.assignDomNodeClasses();
+	// Assign data- attributes and style. attributes
+	this.assignAttributes(domNode,{
+		sourcePrefix: "data-",
+		destPrefix: "data-"
+	});
 	// Add event handlers
 	if(this.droppableEnable) {
 		$tw.utils.addEventListeners(domNode,[
@@ -166,8 +171,15 @@ DroppableWidget.prototype.refresh = function(changedTiddlers) {
 	if(changedAttributes.tag || changedAttributes.enable || changedAttributes.disabledClass || changedAttributes.actions || changedAttributes.effect) {
 		this.refreshSelf();
 		return true;
-	} else if(changedAttributes["class"]) {
+	} else {
-		this.assignDomNodeClasses();
+		if(changedAttributes["class"]) {
+			this.assignDomNodeClasses();
+		}
+		this.assignAttributes(this.domNodes[0],{
+			changedAttributes: changedAttributes,
+			sourcePrefix: "data-",
+			destPrefix: "data-"
+		});
 	}
 	return this.refreshChildren(changedTiddlers);
 };

core/modules/widgets/link.js

@@ -43,6 +43,11 @@ LinkWidget.prototype.render = function(parent,nextSibling) {
 	} else {
 		// Just insert the link text
 		var domNode = this.document.createElement("span");
+		// Assign data- attributes
+		this.assignAttributes(domNode,{
+			sourcePrefix: "data-",
+			destPrefix: "data-"
+		});
 		parent.insertBefore(domNode,nextSibling);
 		this.renderChildren(domNode,null);
 		this.domNodes.push(domNode);
@@ -138,6 +143,11 @@ LinkWidget.prototype.renderLink = function(parent,nextSibling) {
 			widget: this
 		});
 	}
+	// Assign data- attributes
+	this.assignAttributes(domNode,{
+		sourcePrefix: "data-",
+		destPrefix: "data-"
+	});
 	// Insert the link into the DOM and render any children
 	parent.insertBefore(domNode,nextSibling);
 	this.renderChildren(domNode,null);
@@ -207,8 +217,7 @@ Selectively refreshes the widget if needed. Returns true if the widget or any of
 */
 LinkWidget.prototype.refresh = function(changedTiddlers) {
 	var changedAttributes = this.computeAttributes();
-	if(changedAttributes.to || changedTiddlers[this.to] || changedAttributes["aria-label"] || changedAttributes.tooltip ||
+	if($tw.utils.count(changedAttributes) > 0) {
-		changedAttributes["class"] || changedAttributes.tabindex || changedAttributes.draggable || changedAttributes.tag) {
 		this.refreshSelf();
 		return true;
 	}
@@ -218,3 +227,4 @@ LinkWidget.prototype.refresh = function(changedTiddlers) {
 exports.link = LinkWidget;
 
 })();
+	

core/modules/widgets/list.js

@@ -60,7 +60,6 @@ ListWidget.prototype.render = function(parent,nextSibling) {
 Compute the internal state of the widget
 */
 ListWidget.prototype.execute = function() {
-	var self = this;
 	// Get our attributes
 	this.template = this.getAttribute("template");
 	this.editTemplate = this.getAttribute("editTemplate");
@@ -68,8 +67,6 @@ ListWidget.prototype.execute = function() {
 	this.counterName = this.getAttribute("counter");
 	this.storyViewName = this.getAttribute("storyview");
 	this.historyTitle = this.getAttribute("history");
-	// Look for <$list-template> and <$list-empty> widgets as immediate child widgets
-	this.findExplicitTemplates();
 	// Compose the list elements
 	this.list = this.getTiddlerList();
 	var members = [],
@@ -88,48 +85,18 @@ ListWidget.prototype.execute = function() {
 	this.history = [];
 };
 
-ListWidget.prototype.findExplicitTemplates = function() {
-	var self = this;
-	this.explicitListTemplate = null;
-	this.explicitEmptyTemplate = null;
-	var searchChildren = function(childNodes) {
-		$tw.utils.each(childNodes,function(node) {
-			if(node.type === "list-template") {
-				self.explicitListTemplate = node.children;
-			} else if(node.type === "list-empty") {
-				self.explicitEmptyTemplate = node.children;
-			} else if(node.type === "element" && node.tag === "p") {
-				searchChildren(node.children);
-			}
-		});
-	};
-	searchChildren(this.parseTreeNode.children);
-}
-
 ListWidget.prototype.getTiddlerList = function() {
-	var limit = $tw.utils.getInt(this.getAttribute("limit",""),undefined);
 	var defaultFilter = "[!is[system]sort[title]]";
-	var results = this.wiki.filterTiddlers(this.getAttribute("filter",defaultFilter),this);
+	return this.wiki.filterTiddlers(this.getAttribute("filter",defaultFilter),this);
-	if(limit !== undefined) {
-		if(limit >= 0) {
-			results = results.slice(0,limit);
-		} else {
-			results = results.slice(limit);
-		}
-	}
-	return results;
 };
 
 ListWidget.prototype.getEmptyMessage = function() {
 	var parser,
-		emptyMessage = this.getAttribute("emptyMessage");
+		emptyMessage = this.getAttribute("emptyMessage","");
-	// If emptyMessage attribute is not present or empty then look for an explicit empty template
+	// this.wiki.parseText() calls 
-	if(!emptyMessage) {
+	// new Parser(..), which should only be done, if needed, because it's heavy!
-		if(this.explicitEmptyTemplate) {
+	if (emptyMessage === "") {
-			return this.explicitEmptyTemplate;
+		return [];
-		} else {
-			return [];
-		}
 	}
 	parser = this.wiki.parseText("text/vnd.tiddlywiki",emptyMessage,{parseAsInline: true});
 	if(parser) {
@@ -155,19 +122,12 @@ ListWidget.prototype.makeItemTemplate = function(title,index) {
 	if(template) {
 		templateTree = [{type: "transclude", attributes: {tiddler: {type: "string", value: template}}}];
 	} else {
-		// Check for child nodes of the list widget
 		if(this.parseTreeNode.children && this.parseTreeNode.children.length > 0) {
-			// Check for a <$list-item> widget
+			templateTree = this.parseTreeNode.children;
-			if(this.explicitListTemplate) {
+		} else {
-				templateTree = this.explicitListTemplate;
-			} else if (!this.explicitEmptyTemplate) {
-				templateTree = this.parseTreeNode.children;
-			}
-		}
-		if(!templateTree) {
 			// Default template is a link to the title
 			templateTree = [{type: "element", tag: this.parseTreeNode.isBlock ? "div" : "span", children: [{type: "link", attributes: {to: {type: "string", value: title}}, children: [
-				{type: "text", text: title}
+					{type: "text", text: title}
 			]}]}];
 		}
 	}

core/modules/widgets/radio.js

@@ -40,6 +40,10 @@ RadioWidget.prototype.render = function(parent,nextSibling) {
 	);
 	this.inputDomNode = this.document.createElement("input");
 	this.inputDomNode.setAttribute("type","radio");
+	this.assignAttributes(this.inputDomNode,{
+		sourcePrefix: "data-",
+		destPrefix: "data-"
+	});
 	if(isChecked) {
 		this.inputDomNode.checked = true;
 	}

core/modules/widgets/range.js

@@ -50,6 +50,10 @@ RangeWidget.prototype.render = function(parent,nextSibling) {
 		this.inputDomNode.setAttribute("disabled",true);
 	}
 	this.inputDomNode.value = this.getValue();
+	this.assignAttributes(this.inputDomNode,{
+		sourcePrefix: "data-",
+		destPrefix: "data-"
+	});
 	// Add a click event handler
 	$tw.utils.addEventListeners(this.inputDomNode,[
 		{name:"mousedown", handlerObject:this, handlerMethod:"handleMouseDownEvent"},

core/modules/widgets/select.js

@@ -40,7 +40,31 @@ SelectWidget.prototype.render = function(parent,nextSibling) {
 	this.parentDomNode = parent;
 	this.computeAttributes();
 	this.execute();
-	this.renderChildren(parent,nextSibling);
+	//Create element
+	var domNode = this.document.createElement("select");
+	if(this.selectClass) {
+		domNode.classname = this.selectClass;
+	}
+	// Assign data- attributes
+	this.assignAttributes(domNode,{
+		sourcePrefix: "data-",
+		destPrefix: "data-"
+	});
+	if(this.selectMultiple) {
+		domNode.setAttribute("multiple","multiple");
+	}
+	if(this.selectSize) {
+		domNode.setAttribute("size",this.selectSize);
+	}
+	if(this.selectTabindex) {
+		domNode.setAttribute("tabindex",this.selectTabindex);
+	}
+	if(this.selectTooltip) {
+		domNode.setAttribute("title",this.selectTooltip);
+	}
+	this.renderChildren(domNode,nextSibling);
+	this.parentDomNode.insertBefore(domNode,nextSibling);
+	this.domNodes.push(domNode);
 	this.setSelectValue();
 	if(this.selectFocus == "yes") {
 		this.getSelectDomNode().focus();
@@ -113,7 +137,7 @@ SelectWidget.prototype.setSelectValue = function() {
 Get the DOM node of the select element
 */
 SelectWidget.prototype.getSelectDomNode = function() {
-	return this.children[0].domNodes[0];
+	return this.domNodes[0];
 };
 
 // Return an array of the selected opion values
@@ -149,27 +173,7 @@ SelectWidget.prototype.execute = function() {
 	this.selectTooltip = this.getAttribute("tooltip");
 	this.selectFocus = this.getAttribute("focus");
 	// Make the child widgets
-	var selectNode = {
+	this.makeChildWidgets();
-		type: "element",
-		tag: "select",
-		children: this.parseTreeNode.children
-	};
-	if(this.selectClass) {
-		$tw.utils.addAttributeToParseTreeNode(selectNode,"class",this.selectClass);
-	}
-	if(this.selectMultiple) {
-		$tw.utils.addAttributeToParseTreeNode(selectNode,"multiple","multiple");
-	}
-	if(this.selectSize) {
-		$tw.utils.addAttributeToParseTreeNode(selectNode,"size",this.selectSize);
-	}
-	if(this.selectTabindex) {
-		$tw.utils.addAttributeToParseTreeNode(selectNode,"tabindex",this.selectTabindex);
-	}
-	if(this.selectTooltip) {
-		$tw.utils.addAttributeToParseTreeNode(selectNode,"title",this.selectTooltip);
-	}
-	this.makeChildWidgets([selectNode]);
 };
 
 /*
@@ -178,17 +182,21 @@ Selectively refreshes the widget if needed. Returns true if the widget or any of
 SelectWidget.prototype.refresh = function(changedTiddlers) {
 	var changedAttributes = this.computeAttributes();
 	// If we're using a different tiddler/field/index then completely refresh ourselves
-	if(changedAttributes.tiddler || changedAttributes.field || changedAttributes.index || changedAttributes.tooltip) {
+	if(changedAttributes.tiddler || changedAttributes.field || changedAttributes.index || changedAttributes.tooltip || changedAttributes.tabindex) {
 		this.refreshSelf();
 		return true;
-	// If the target tiddler value has changed, just update setting and refresh the children
 	} else {
 		if(changedAttributes.class) {
 			this.selectClass = this.getAttribute("class");
 			this.getSelectDomNode().setAttribute("class",this.selectClass); 
 		}
-		
+		this.assignAttributes(this.getSelectDomNode(),{
+			changedAttributes: changedAttributes,
+			sourcePrefix: "data-",
+			destPrefix: "data-"
+		});
 		var childrenRefreshed = this.refreshChildren(changedTiddlers);
+		// If the target tiddler value has changed, just update setting and refresh the children
 		if(changedTiddlers[this.selectTitle] || childrenRefreshed) {
 			this.setSelectValue();
 		} 

core/modules/widgets/widget.js

@@ -413,16 +413,34 @@ Widget.prototype.getAttribute = function(name,defaultText) {
 };
 
 /*
-Assign the computed attributes of the widget to a domNode
+Assign the common attributes of the widget to a domNode
 options include:
-excludeEventAttributes: ignores attributes whose name begins with "on"
+sourcePrefix: prefix of attributes that are to be directly assigned (defaults to the empty string meaning all attributes)
+destPrefix: prefix to be applied to attribute names that are to be directly assigned (defaults to the emtpy string which means no prefix is added)
+changedAttributes: hashmap by attribute name of attributes to process (if missing, process all attributes)
+excludeEventAttributes: ignores attributes whose name would begin with "on"
 */
 Widget.prototype.assignAttributes = function(domNode,options) {
 	options = options || {};
-	var self = this;
+	var self = this,
+		changedAttributes = options.changedAttributes || this.attributes,
+		sourcePrefix = options.sourcePrefix || "",
+		destPrefix = options.destPrefix || "",
+		EVENT_ATTRIBUTE_PREFIX = "on";
 	var assignAttribute = function(name,value) {
+		// Process any style attributes before considering sourcePrefix and destPrefix
+		if(name.substr(0,6) === "style." && name.length > 6) {
+			domNode.style[$tw.utils.unHyphenateCss(name.substr(6))] = value;
+			return;
+		}
+		// Check if the sourcePrefix is a match
+		if(name.substr(0,sourcePrefix.length) === sourcePrefix) {
+			name = destPrefix + name.substr(sourcePrefix.length);
+		} else {
+			value = undefined;
+		}
 		// Check for excluded attribute names
-		if(options.excludeEventAttributes && name.substr(0,2) === "on") {
+		if(options.excludeEventAttributes && name.substr(0,2).toLowerCase() === EVENT_ATTRIBUTE_PREFIX) {
 			value = undefined;
 		}
 		if(value !== undefined) {
@@ -432,26 +450,24 @@ Widget.prototype.assignAttributes = function(domNode,options) {
 				namespace = "http://www.w3.org/1999/xlink";
 				name = name.substr(6);
 			}
-			// Handle styles
+			// Setting certain attributes can cause a DOM error (eg xmlns on the svg element)
-			if(name.substr(0,6) === "style." && name.length > 6) {
+			try {
-				domNode.style[$tw.utils.unHyphenateCss(name.substr(6))] = value;
+				domNode.setAttributeNS(namespace,name,value);
-			} else {
+			} catch(e) {
-				// Setting certain attributes can cause a DOM error (eg xmlns on the svg element)
-				try {
-					domNode.setAttributeNS(namespace,name,value);
-				} catch(e) {
-				}
 			}
 		}
-	}
+	};
-	// Not all parse tree nodes have the orderedAttributes property
+	// If the parse tree node has the orderedAttributes property then use that order
 	if(this.parseTreeNode.orderedAttributes) {
 		$tw.utils.each(this.parseTreeNode.orderedAttributes,function(attribute,index) {
-			assignAttribute(attribute.name,self.attributes[attribute.name]);
+			if(attribute.name in changedAttributes) {
+				assignAttribute(attribute.name,self.getAttribute(attribute.name));
+			}
 		});
+	// Otherwise update each changed attribute irrespective of order
 	} else {
-		$tw.utils.each(Object.keys(self.attributes).sort(),function(name) {
+		$tw.utils.each(changedAttributes,function(value,name) {
-			assignAttribute(name,self.attributes[name]);
+			assignAttribute(name,self.getAttribute(name));
 		});	
 	}
 };

core/ui/EditTemplate/body/default.tid

@@ -1,9 +1,5 @@
 title: $:/core/ui/EditTemplate/body/default
 
-\function edit-preview-state()
-[{$:/config/ShowEditPreview/PerTiddler}!match[yes]then[$:/state/showeditpreview]] :else[<qualify "$:/state/showeditpreview">] +[get[text]] :else[[no]]
-\end
-
 \define config-visibility-title()
 $:/config/EditorToolbarButtons/Visibility/$(currentTiddler)$
 \end
@@ -14,16 +10,15 @@ $:/config/EditorToolbarButtons/Visibility/$(currentTiddler)$
 
 \whitespace trim
 <$let
+	edit-preview-state={{{ [{$:/config/ShowEditPreview/PerTiddler}!match[yes]then[$:/state/showeditpreview]] :else[<qualify "$:/state/showeditpreview">] }}}
 	importTitle=<<qualify $:/ImportImage>>
 	importState=<<qualify $:/state/ImportImage>> >
 <$dropzone importTitle=<<importTitle>> autoOpenOnImport="no" contentTypesFilter={{$:/config/Editor/ImportContentTypesFilter}} class="tc-dropzone-editor" enable={{{ [{$:/config/DragAndDrop/Enable}match[no]] :else[subfilter{$:/config/Editor/EnableImportFilter}then[yes]else[no]] }}} filesOnly="yes" actions=<<importFileActions>> >
-<div>
+<$reveal stateTitle=<<edit-preview-state>> type="match" text="yes" tag="div">
-<div class={{{ [function[edit-preview-state]match[yes]then[tc-tiddler-preview]] +[join[ ]] }}}>
+<div class="tc-tiddler-preview">
 
 <$transclude tiddler="$:/core/ui/EditTemplate/body/editor" mode="inline"/>
 
-<$list filter="[function[edit-preview-state]match[yes]]" variable="ignore">
-
 <div class="tc-tiddler-preview-preview" data-tiddler-title={{!!draft.title}} data-tags={{!!tags}}>
 
 <$transclude tiddler={{$:/state/editpreviewtype}} mode="inline">
@@ -34,12 +29,13 @@ $:/config/EditorToolbarButtons/Visibility/$(currentTiddler)$
 
 </div>
 
-</$list>
-
 </div>
+</$reveal>
 
-</div>
+<$reveal stateTitle=<<edit-preview-state>> type="nomatch" text="yes" tag="div">
 
+<$transclude tiddler="$:/core/ui/EditTemplate/body/editor" mode="inline"/>
+
+</$reveal>
 </$dropzone>
-
 </$let>

core/ui/EditorToolbar/preview.tid

@@ -9,17 +9,11 @@ button-classes: tc-text-editor-toolbar-item-start-group
 shortcuts: ((preview))
 
 \whitespace trim
-<$let
-	edit-preview-state={{{ [{$:/config/ShowEditPreview/PerTiddler}!match[yes]then[$:/state/showeditpreview]] :else[<qualify "$:/state/showeditpreview">] }}}
->
 <$reveal state=<<edit-preview-state>> type="match" text="yes" tag="span">
 {{$:/core/images/preview-open}}
 <$action-setfield $tiddler=<<edit-preview-state>> $value="no"/>
-<$action-sendmessage $message="tm-edit-text-operation" $param="focus-editor"/>
 </$reveal>
 <$reveal state=<<edit-preview-state>> type="nomatch" text="yes" tag="span">
 {{$:/core/images/preview-closed}}
 <$action-setfield $tiddler=<<edit-preview-state>> $value="yes"/>
-<$action-sendmessage $message="tm-edit-text-operation" $param="focus-editor"/>
 </$reveal>
-</$let>

core/wiki/macros/tabs.tid

@@ -4,7 +4,15 @@ code-body: yes
 
 \define tabs-button()
 \whitespace trim
-<$button set=<<tabsState>> setTo=<<currentTab>> default=<<__default__>> selectedClass="tc-tab-selected" tooltip={{!!tooltip}} role="switch">
+<$button
+	set=<<tabsState>>
+	setTo=<<currentTab>>
+	default=<<__default__>>
+	selectedClass="tc-tab-selected"
+	tooltip={{!!tooltip}}
+	role="switch"
+	data-tab-title=<<currentTab>>
+>
 	<$tiddler tiddler=<<save-currentTiddler>>>
 		<$set name="tv-wikilinks" value="no">
 			<$transclude tiddler=<<__buttonTemplate__>> mode="inline">

editions/de-AT-server/tiddlers/system/favicon.ico.meta

@@ -1,2 +1,2 @@
 title: $:/favicon.ico
-type: image/png
+type: image/x-icon

editions/dev/tiddlers/images/favicon.ico.meta

@@ -1,2 +1,2 @@
 title: $:/favicon.ico
-type: image/png
+type: image/x-icon

editions/es-ES-server/tiddlers/system/favicon.ico.meta

@@ -1,2 +1,2 @@
 title: $:/favicon.ico
-type: image/png
+type: image/x-icon

editions/es-ES/tiddlers/images/favicon.ico.meta

@@ -1,2 +1,2 @@
 title: $:/favicon.ico
-type: image/png
+type: image/x-icon

editions/es-ES/tiddlers/images/green_favicon.ico.meta

@@ -1,2 +1,2 @@
 title: $:/green_favicon.ico
-type: image/png
+type: image/x-icon

editions/fr-FR-server/tiddlers/system/favicon.ico.meta

@@ -0,0 +1,2 @@
+title: $:/favicon.ico
+type: image/x-icon

editions/fr-FR-server/tiddlers/system/favicon.png.meta

@@ -1,2 +0,0 @@
-title: $:/favicon.ico
-type: image/png

editions/fr-FR/tiddlers/images/favicon.ico.meta

@@ -0,0 +1,2 @@
+title: $:/favicon.ico
+type: image/x-icon

editions/fr-FR/tiddlers/images/favicon.png.meta

@@ -1,2 +0,0 @@
-title: $:/favicon.ico
-type: image/png

editions/fr-FR/tiddlers/images/green_favicon.ico.meta

@@ -1,2 +1,2 @@
 title: $:/green_favicon.ico
-type: image/png
+type: image/x-icon

editions/ja-JP/tiddlers/images/favicon.ico.meta

@@ -0,0 +1,2 @@
+title: $:/favicon.ico
+type: image/x-icon

editions/ja-JP/tiddlers/images/favicon.png.meta

@@ -1,2 +0,0 @@
-title: $:/favicon.ico
-type: image/png

editions/ja-JP/tiddlers/images/green_favicon.ico.meta

@@ -1,2 +1,2 @@
 title: $:/green_favicon.ico
-type: image/png
+type: image/x-icon

editions/ko-KR-server/tiddlers/system/favicon.ico.meta

@@ -0,0 +1,2 @@
+title: $:/favicon.ico
+type: image/x-icon

editions/ko-KR-server/tiddlers/system/favicon.png.meta

@@ -1,2 +0,0 @@
-title: $:/favicon.ico
-type: image/png

editions/ko-KR/tiddlers/images/favicon.ico.meta

@@ -0,0 +1,2 @@
+title: $:/favicon.ico
+type: image/x-icon

editions/ko-KR/tiddlers/images/favicon.png.meta

@@ -1,2 +0,0 @@
-title: $:/favicon.ico
-type: image/png

editions/ko-KR/tiddlers/images/green_favicon.ico.meta

@@ -1,2 +1,2 @@
 title: $:/green_favicon.ico
-type: image/png
+type: image/x-icon

editions/prerelease/tiddlers/Release 5.3.2.tid

@@ -4,7 +4,6 @@ modified: 20230820114855583
 tags: ReleaseNotes
 title: Release 5.3.2
 type: text/vnd.tiddlywiki
-description: Under development
 
 //[[See GitHub for detailed change history of this release|https://github.com/Jermolene/TiddlyWiki5/compare/v5.3.1...master]]//
 
@@ -12,50 +11,27 @@ description: Under development
 
 Improvements to the following translations:
 
-* Chinese
+* 
-* Polish
-* Spanish
-
-! Plugin Improvements
-
-* <<.link-badge-fixed "https://github.com/Jermolene/TiddlyWiki5/commit/1be8f0a9336952d4745d2bd4f2327e353580a272">> comments plugin to use predefined palette colours
 
 ! Widget Improvements
 
 * 
 
-! Usability Improvements
-
-* <<.link-badge-updated "https://github.com/Jermolene/TiddlyWiki5/pull/7747">> editor preview button to automatically focus the editor
-* <<.link-badge-improved "https://github.com/Jermolene/TiddlyWiki5/pull/7764">> file type names in the export menu
-
 ! Hackability Improvements
 
-* <<.link-badge-added "https://github.com/Jermolene/TiddlyWiki5/pull/7737">> an automatic build of the external core TiddlyWiki at https://tiddlywiki.com/empty-external-core.html
+* 
-* <<.link-badge-improved "https://github.com/Jermolene/TiddlyWiki5/pull/7690">> the default page layout to better support CSS grid and flexbox layouts
 
 ! Bug Fixes
 
-* <<.link-badge-fixed "https://github.com/Jermolene/TiddlyWiki5/issues/7665">> `{{}}` generating a recursion error
+* 
-* <<.link-badge-fixed "https://github.com/Jermolene/TiddlyWiki5/pull/7758">> ordering of Vanilla stylesheets
-* <<.link-badge-fixed "https://github.com/Jermolene/TiddlyWiki5/commit/fa9bfa07a095548eb2f8339b0b1b816d2e6794ef">> missing closing tag in tag-pill-inner macro
-* <<.link-badge-removed "https://github.com/Jermolene/TiddlyWiki5/issues/7732">> invalid "type" attribute from textarea elements generated by the EditTextWidget
-* <<.link-badge-fixed "https://github.com/Jermolene/TiddlyWiki5/pull/7749">> editor "type" dropdown state tiddlers
-* <<.link-badge-fixed "https://github.com/Jermolene/TiddlyWiki5/pull/7712">> handling of "counter-last" variable when appending items with the ListWidget
-* <<.link-badge-fixed "https://github.com/Jermolene/TiddlyWiki5/pull/6088">> upgrade download link in Firefox
 
 ! Node.js Improvements
 
 * 
 
-! Performance Improvements
-
-* <<.link-badge-improved "https://github.com/Jermolene/TiddlyWiki5/pull/7702">> performance of predefined patterns with [[all Operator]]
-* <<.link-badge-updated "https://github.com/Jermolene/TiddlyWiki5/issues/7671">> favicon format to PNG
-
 ! Developer Improvements
 
-* <<.link-badge-improved "https://github.com/Jermolene/TiddlyWiki5/pull/7751">> global hook handling to support removing hooks
+* 
 
 ! Acknowledgements
 
@@ -63,16 +39,22 @@ Improvements to the following translations:
 
 <<.contributors """
 AnthonyMuscio
-BramChen
+btheado
-BuckarooBanzay
+catter-fly
-BurningTreeC
+cmo-pomerium
-EvidentlyCube
+CrossEye
-joebordes
+flibbles
-kookma
+hffqyd
+lilscribby
 linonetwo
+Marxsal
 mateuszwilczek
+pille1842
 pmario
 rmunn
-simonbaird
+saqimtiaz
-T1mL3arn
+stevesunypoly
+TiddlyTweeter
+twMat
+yaisog
 """>>

editions/prerelease/tiddlers/system/favicon.ico.meta

@@ -0,0 +1,2 @@
+title: $:/favicon.ico
+type: image/x-icon

editions/prerelease/tiddlers/system/favicon.png.meta

@@ -1,2 +0,0 @@
-title: $:/favicon.ico
-type: image/png

editions/test/tiddlers/tests/data/conditionals/Basic.tid

@@ -1,26 +0,0 @@
-title: Conditionals/Basic
-description: Basic conditional shortcut syntax
-type: text/vnd.tiddlywiki-multiple
-tags: [[$:/tags/wiki-test-spec]]
-
-title: Text
-
-This is a <% if [<something>match[one]] %>Elephant<% endif %>, I think.
-+
-title: Output
-
-<$let something="one">
-{{Text}}
-</$let>
-
-<$let something="two">
-{{Text}}
-</$let>
-+
-title: ExpectedResult
-
-<p>
-This is a Elephant, I think.
-</p><p>
-This is a , I think.
-</p>

editions/test/tiddlers/tests/data/conditionals/BlockMode.tid

@@ -1,37 +0,0 @@
-title: Conditionals/BlockMode
-description: Basic conditional shortcut syntax in block mode
-type: text/vnd.tiddlywiki-multiple
-tags: [[$:/tags/wiki-test-spec]]
-
-title: Output
-
-\procedure test(animal)
-<% if [<animal>match[Elephant]] %>
-
-! It is an elephant
-
-<% else %>
-
-<% if [<animal>match[Giraffe]] %>
-
-! It is a giraffe
-
-<% else %>
-
-! It is completely unknown
-
-<% endif %>
-
-<% endif %>
-
-\end
-
-<<test "Giraffe">>
-
-<<test "Elephant">>
-
-<<test "Antelope">>
-+
-title: ExpectedResult
-
-<h1 class="">It is a giraffe</h1><h1 class="">It is an elephant</h1><h1 class="">It is completely unknown</h1>

editions/test/tiddlers/tests/data/conditionals/Else.tid

@@ -1,26 +0,0 @@
-title: Conditionals/Else
-description: Else conditional shortcut syntax
-type: text/vnd.tiddlywiki-multiple
-tags: [[$:/tags/wiki-test-spec]]
-
-title: Text
-
-This is a <% if [<something>match[one]] %>Elephant<% else %>Crocodile<% endif %>, I think.
-+
-title: Output
-
-<$let something="one">
-{{Text}}
-</$let>
-
-<$let something="two">
-{{Text}}
-</$let>
-+
-title: ExpectedResult
-
-<p>
-This is a Elephant, I think.
-</p><p>
-This is a Crocodile, I think.
-</p>

editions/test/tiddlers/tests/data/conditionals/Elseif.tid

@@ -1,32 +0,0 @@
-title: Conditionals/Elseif
-description: Elseif conditional shortcut syntax
-type: text/vnd.tiddlywiki-multiple
-tags: [[$:/tags/wiki-test-spec]]
-
-title: Text
-
-This is a <% if [<something>match[one]] %>Elephant<% elseif [<something>match[two]] %>Antelope<% else %>Crocodile<% endif %>, I think.
-+
-title: Output
-
-<$let something="one">
-{{Text}}
-</$let>
-
-<$let something="two">
-{{Text}}
-</$let>
-
-<$let something="three">
-{{Text}}
-</$let>
-+
-title: ExpectedResult
-
-<p>
-This is a Elephant, I think.
-</p><p>
-This is a Antelope, I think.
-</p><p>
-This is a Crocodile, I think.
-</p>

editions/test/tiddlers/tests/data/conditionals/MissingEndIf.tid

@@ -1,26 +0,0 @@
-title: Conditionals/MissingEndif
-description: Conditional shortcut syntax with missing endif
-type: text/vnd.tiddlywiki-multiple
-tags: [[$:/tags/wiki-test-spec]]
-
-title: Text
-
-This is a <% if [<something>match[one]] %>Elephant
-+
-title: Output
-
-<$let something="one">
-{{Text}}
-</$let>
-
-<$let something="two">
-{{Text}}
-</$let>
-+
-title: ExpectedResult
-
-<p>
-This is a Elephant
-</p><p>
-This is a 
-</p>

editions/test/tiddlers/tests/data/conditionals/MultipleResults.tid

@@ -1,12 +0,0 @@
-title: Conditionals/MultipleResults
-description: Check that multiple results from the filter are ignored
-type: text/vnd.tiddlywiki-multiple
-tags: [[$:/tags/wiki-test-spec]]
-
-title: Output
-
-This is a <% if 1 2 3 4 5 6 %>Elephant<% endif %>, I think.
-+
-title: ExpectedResult
-
-<p>This is a Elephant, I think.</p>

editions/test/tiddlers/tests/data/conditionals/Nested.tid

@@ -1,38 +0,0 @@
-title: Conditionals/Nested
-description: Nested conditional shortcut syntax
-type: text/vnd.tiddlywiki-multiple
-tags: [[$:/tags/wiki-test-spec]]
-
-title: Output
-
-\procedure test(animal)
-<% if [<animal>match[Elephant]] %>
-It is an elephant
-<% else %>
-<% if [<animal>match[Giraffe]] %>
-It is a giraffe
-<% else %>
-It is completely unknown
-<% endif %>
-<% endif %>
-\end
-
-<<test "Giraffe">>
-
-<<test "Elephant">>
-
-<<test "Antelope">>
-
-+
-title: ExpectedResult
-
-
-
-It is a giraffe
-
-
-It is an elephant
-
-
-It is completely unknown
-

editions/test/tiddlers/tests/data/conditionals/NestedElseif.tid

@@ -1,60 +0,0 @@
-title: Conditionals/NestedElseif
-description: Nested elseif conditional shortcut syntax
-type: text/vnd.tiddlywiki-multiple
-tags: [[$:/tags/wiki-test-spec]]
-
-title: Text
-
-\whitespace trim
-This is a 
-	<% if [<something>match[one]] %>
-		<% if [<another>match[one]] %>
-			Indian
-		<% elseif [<another>match[two]] %>
-			African
-		<% else %>
-			Unknown
-		<% endif %>
-		&#32;Elephant
-	<% elseif [<something>match[two]] %>
-		Antelope
-	<% else %>
-		Crocodile
-	<% endif %>
-, I think.
-+
-title: Output
-
-<$let something="one" another="one">
-{{Text}}
-</$let>
-
-<$let something="one" another="two">
-{{Text}}
-</$let>
-
-<$let something="one" another="three">
-{{Text}}
-</$let>
-
-<$let something="two">
-{{Text}}
-</$let>
-
-<$let something="three">
-{{Text}}
-</$let>
-+
-title: ExpectedResult
-
-<p>
-This is a Indian Elephant, I think.
-</p><p>
-This is a African Elephant, I think.
-</p><p>
-This is a Unknown Elephant, I think.
-</p><p>
-This is a Antelope, I think.
-</p><p>
-This is a Crocodile, I think.
-</p>

editions/test/tiddlers/tests/data/list-widget/WithExplicitTemplates.tid

@@ -1,29 +0,0 @@
-title: ListWidget/WithExplicitTemplates
-description: List widget with explicit templates
-type: text/vnd.tiddlywiki-multiple
-tags: [[$:/tags/wiki-test-spec]]
-
-+
-title: Output
-
-\whitespace trim
-
-\procedure test(filter)
-<$list filter=<<filter>>>
-	<$list-template>
-		<$text text=<<currentTiddler>>/>
-	</$list-template>
-	<$list-empty>
-		None!
-	</$list-empty>
-</$list>
-\end
-
-<<test "1 2 3">>
-
-<<test "">>
-
-+
-title: ExpectedResult
-
-<p>123</p><p>None!</p>

editions/test/tiddlers/tests/data/list-widget/WithExplicitTemplatesInBlockMode.tid

@@ -1,32 +0,0 @@
-title: ListWidget/WithExplicitTemplatesInBlockMode
-description: List widget with explicit templates in block mode
-type: text/vnd.tiddlywiki-multiple
-tags: [[$:/tags/wiki-test-spec]]
-
-+
-title: Output
-
-\whitespace trim
-
-\procedure test(filter)
-<$list filter=<<filter>>>
-
-	<$list-template>
-		<$text text=<<currentTiddler>>/>
-	</$list-template>
-
-	<$list-empty>
-		None!
-	</$list-empty>
-
-</$list>
-\end
-
-<<test "1 2 3">>
-
-<<test "">>
-
-+
-title: ExpectedResult
-
-123None!

editions/test/tiddlers/tests/data/list-widget/WithExplicitTemplatesOverriddenByAttributes.tid

@@ -1,33 +0,0 @@
-title: ListWidget/WithExplicitTemplatesOverriddenByAttributes
-description: List widget with explicit templates
-type: text/vnd.tiddlywiki-multiple
-tags: [[$:/tags/wiki-test-spec]]
-
-+
-title: Output
-
-\whitespace trim
-
-\procedure test(filter)
-<$list filter=<<filter>> emptyMessage="Zero" template="Template">
-	<$list-template>
-		<$text text=<<currentTiddler>>/>
-	</$list-template>
-	<$list-empty>
-		None!
-	</$list-empty>
-</$list>
-\end
-
-<<test "1 2 3">>
-
-<<test "">>
-
-+
-title: Template
-
-<$text text=<<currentTiddler>>/><$text text=<<currentTiddler>>/>
-+
-title: ExpectedResult
-
-<p>112233</p><p>Zero</p>

editions/test/tiddlers/tests/data/list-widget/WithLimit.tid

@@ -1,25 +0,0 @@
-title: ListWidget/WithLimit
-description: List widget with limit
-type: text/vnd.tiddlywiki-multiple
-tags: [[$:/tags/wiki-test-spec]]
-
-+
-title: Output
-
-Zero: <$list filter="1 2 3 4" limit="0" template="Template"/>
-
-One: <$list filter="1 2 3 4" limit="1" template="Template"/>
-
-Two: <$list filter="1 2 3 4" limit="2" template="Template"/>
-
-Minus Two: <$list filter="1 2 3 4" limit="-2" template="Template"/>
-
-+
-title: Template
-
-<$text text=<<currentTiddler>>/>
-+
-title: ExpectedResult
-
-<p>Zero: </p><p>One: 1</p><p>Two: 12</p><p>Minus Two: 34
-</p>

editions/test/tiddlers/tests/data/list-widget/WithMissingTemplate.tid

@@ -1,26 +0,0 @@
-title: ListWidget/WithMissingTemplate
-description: List widget with explicit templates
-type: text/vnd.tiddlywiki-multiple
-tags: [[$:/tags/wiki-test-spec]]
-
-+
-title: Output
-
-\whitespace trim
-
-\procedure test(filter)
-<$list filter=<<filter>>>
-	<$list-empty>
-		None!
-	</$list-empty>
-</$list>
-\end
-
-<<test "1 2 3">>
-
-<<test "">>
-
-+
-title: ExpectedResult
-
-<p><span><a class="tc-tiddlylink tc-tiddlylink-missing" href="#1">1</a></span><span><a class="tc-tiddlylink tc-tiddlylink-missing" href="#2">2</a></span><span><a class="tc-tiddlylink tc-tiddlylink-missing" href="#3">3</a></span></p><p>None!</p>

editions/test/tiddlers/tests/data/widgets/DataAttributes/ButtonWidget-DataAttributes.tid

@@ -0,0 +1,27 @@
+title: Widgets/DataAttributes/ButtonWidget
+description: Data Attributes for ButtonWidget
+type: text/vnd.tiddlywiki-multiple
+tags: [[$:/tags/wiki-test-spec]]
+
+title: Output
+
+\whitespace trim
+<$button tag="div" class="myclass" data-title="mytiddler" style.color="red" onclick="clicked">
+my tiddler
+</$button>
+<$button tag="div" class="myclass" data-title={{Temp}} style.color={{{ [[Temp]get[color]] }}}>
+hello
+</$button>
++
+title: Actions
+
+<$action-setfield $tiddler="Temp" $field="text" $value="Title2" color="red"/>
++
+title: Temp
+color: black
+
+Title1
++
+title: ExpectedResult
+
+<p><div class="myclass" data-title="mytiddler" style="color:red;">my tiddler</div><div class="myclass" data-title="Title2" style="color:red;">hello</div></p>

editions/test/tiddlers/tests/data/widgets/DataAttributes/CheckboxWidget-DataAttributes.tid

@@ -0,0 +1,22 @@
+title: Widgets/DataAttributes/CheckboxWidget
+description: Data Attributes for CheckboxWidget
+type: text/vnd.tiddlywiki-multiple
+tags: [[$:/tags/wiki-test-spec]]
+
+title: Output
+
+\whitespace trim
+<$checkbox tag="done" data-title={{Temp}} style.color={{{ [[Temp]get[color]] }}} onclick="clicked"> Is it done?</$checkbox>
++
+title: Actions
+
+<$action-setfield $tiddler="Temp" $field="text" $value="Title2" color="red"/>
++
+title: Temp
+color: black
+
+Title1
++
+title: ExpectedResult
+
+<p><label class="tc-checkbox "><input data-title="Title2" type="checkbox" style="color:red;"><span>Is it done?</span></label></p>

editions/test/tiddlers/tests/data/widgets/DataAttributes/DraggableWidget-DataAttributes.tid

@@ -0,0 +1,27 @@
+title: Widgets/DataAttributes/DraggableWidget
+description: Data Attributes for DraggableWidget
+type: text/vnd.tiddlywiki-multiple
+tags: [[$:/tags/wiki-test-spec]]
+
+title: Output
+
+\whitespace trim
+<$draggable tag="div" class="myclass" data-title="mytiddler" style.color="red" onclick="clicked">
+my tiddler
+</$draggable>
+<$draggable tag="div" class="myclass" data-title={{Temp}} style.color={{{ [[Temp]get[color]] }}}>
+hello
+</$draggable>
++
+title: Actions
+
+<$action-setfield $tiddler="Temp" $field="text" $value="Title2" color="red"/>
++
+title: Temp
+color: black
+
+Title1
++
+title: ExpectedResult
+
+<p><div class="myclass tc-draggable" data-title="mytiddler" draggable="true" style="color:red;">my tiddler</div><div class="myclass tc-draggable" data-title="Title2" draggable="true" style="color:red;">hello</div></p>

editions/test/tiddlers/tests/data/widgets/DataAttributes/DroppableWidget-DataAttributes.tid

@@ -0,0 +1,27 @@
+title: Widgets/DataAttributes/DroppableWidget
+description: Data Attributes for DroppableWidget
+type: text/vnd.tiddlywiki-multiple
+tags: [[$:/tags/wiki-test-spec]]
+
+title: Output
+
+\whitespace trim
+<$droppable tag="div" class="myclass" data-title="mytiddler" style.color="red" onclick="clicked">
+my tiddler
+</$droppable>
+<$droppable tag="div" class="myclass" data-title={{Temp}} style.color={{{ [[Temp]get[color]] }}}>
+hello
+</$droppable>
++
+title: Actions
+
+<$action-setfield $tiddler="Temp" $field="text" $value="Title2" color="red"/>
++
+title: Temp
+color: black
+
+Title1
++
+title: ExpectedResult
+
+<p><div class="myclass tc-droppable" data-title="mytiddler" style="color:red;">my tiddler</div><div class="myclass tc-droppable" data-title="Title2" style="color:red;">hello</div></p>

editions/test/tiddlers/tests/data/widgets/DataAttributes/LinkWidget-DataAttributes.tid

@@ -0,0 +1,27 @@
+title: Widgets/DataAttributes/LinkWidget
+description: Data Attributes for LinkWidget
+type: text/vnd.tiddlywiki-multiple
+tags: [[$:/tags/wiki-test-spec]]
+
+title: Output
+
+\whitespace trim
+<$link data-id="mytiddler" style.color="red" to="Temp" onclick="clicked">
+link to Temp
+</$link>
+<$link tag="button" data-id={{Temp}} style.color={{{ [[Temp]get[color]] }}} to="SomeTiddler">
+some tiddler
+</$link>
++
+title: Actions
+
+<$action-setfield $tiddler="Temp" $field="text" $value="Title2" color="red"/>
++
+title: Temp
+color: black
+
+Title1
++
+title: ExpectedResult
+
+<p><a class="tc-tiddlylink tc-tiddlylink-resolves" data-id="mytiddler" href="#Temp" style="color:red;">link to Temp</a><button class="tc-tiddlylink tc-tiddlylink-missing" data-id="Title2" draggable="true" style="color:red;">some tiddler</button></p>

editions/test/tiddlers/tests/data/widgets/DataAttributes/OrderedStyleAttributes.tid

@@ -0,0 +1,15 @@
+title: Widgets/DataAttributes/OrderedStyleAttributes
+description: Ordered style attributes
+type: text/vnd.tiddlywiki-multiple
+tags: [[$:/tags/wiki-test-spec]]
+
+title: Output
+
+\whitespace trim
+<div style="background:red;color:blue;" style.background="green">
+hello
+</div>
++
+title: ExpectedResult
+
+<p><div style="background:green;color:blue;">hello</div></p>

editions/test/tiddlers/tests/data/widgets/DataAttributes/SelectWidget-DataAttributes.tid

@@ -0,0 +1,27 @@
+title: Widgets/DataAttributes/SelectWidget
+description: Data Attributes for SelectWidget
+type: text/vnd.tiddlywiki-multiple
+tags: [[$:/tags/wiki-test-spec]]
+
+title: Output
+
+\whitespace trim
+<$select tiddler='New Tiddler' field='text' default='Choose a new text' data-title={{Temp}} style.color={{{ [[Temp]get[color]] }}} onclick="clicked">
+<option disabled>Choose a new text</option>
+<option>A Tale of Two Cities</option>
+<option>A New Kind of Science</option>
+<option>The Dice Man</option>
+</$select>
++
+title: Actions
+
+<$action-setfield $tiddler="Temp" $field="text" $value="Title2" color="red"/>
++
+title: Temp
+color: black
+
+Title1
++
+title: ExpectedResult
+
+<p><select data-title="Title2" value="Choose a new text" style="color:red;"><option disabled="true">Choose a new text</option><option>A Tale of Two Cities</option><option>A New Kind of Science</option><option>The Dice Man</option></select></p>

editions/test/tiddlers/tests/data/widgets/ElementWidgetEventAttributes.tid

@@ -0,0 +1,15 @@
+title: Widgets/ElementWidgetEventAttributes
+description: Element widget should not support event attributes starting with "on"
+type: text/vnd.tiddlywiki-multiple
+tags: [[$:/tags/wiki-test-spec]]
+
+title: Output
+
+\whitespace trim
+<div class="hello" onclick="clicked">
+TiddlyWiki
+</div>
++
+title: ExpectedResult
+
+<p><div class="hello">TiddlyWiki</div></p>

editions/test/tiddlers/tests/data/widgets/ElementWidgetStyleAttributes.tid

@@ -0,0 +1,15 @@
+title: Widgets/ElementWidgetStyleAttributes
+description: Element widget should support style.* attributes
+type: text/vnd.tiddlywiki-multiple
+tags: [[$:/tags/wiki-test-spec]]
+
+title: Output
+
+\whitespace trim
+<div class="hello" onclick="clicked" style.color="blue" style.color="red" style.background="yellow">
+TiddlyWiki
+</div>
++
+title: ExpectedResult
+
+<p><div class="hello" style="color:red;background:yellow;">TiddlyWiki</div></p>

editions/tw5.com-server/tiddlers/system/favicon.ico.meta

@@ -0,0 +1,2 @@
+title: $:/favicon.ico
+type: image/x-icon

editions/tw5.com-server/tiddlers/system/tiddlywiki.com.server.png.meta

@@ -1,2 +0,0 @@
-title: $:/favicon.ico
-type: image/png

editions/tw5.com/tiddlers/_tw_shared/favicons/classic.tiddlywiki.com.ico.meta

@@ -1,3 +1,3 @@
 title: $:/_tw_shared/favicons/classic.tiddlywiki.com
-type: image/png
+type: image/x-icon
 tags: TiddlyWikiSitesMenu

editions/tw5.com/tiddlers/_tw_shared/favicons/links.tiddlywiki.org.ico.meta

@@ -1,3 +1,3 @@
 title: $:/_tw_shared/favicons/links.tiddlywiki.org
-type: image/png
+type: image/x-icon
 tags: TiddlyWikiSitesMenu