Bug in samples demo

[w3guy]

Go to https://www.jsviews.com/#samples/data-link/toggle:~:text=is%20correctly%20preserved.-,Using%20the%20merge%20converter%20to,-toggle%20the%20%27%2D%20(Lead

My understanding is "details" should be the users role.

Looks like a bug with jsviews handling of merging innertext

Cc @BorisMoore

[BorisMoore]

Yes, you are right. Thanks for calling this out!

Here is a corrected version of the merge converter:

$.views.converters("merge", function(val) {
	// Special converter used in data-linking to space-separated lists, such as className:
	// Currently only supports toggle semantics - and has no effect if toggle string is not specified
	// data-link="class{merge:boolExpr toggle=className}"
	var attr = this.linkCtx.attr;
	attr = (attr == "" || attr === "text") ? "innerText" : attr === "class" ? "className" : attr;
	
	var regularExpression,
		currentValue = this.linkCtx.elem[attr],
		toggle = this.tagCtx.props.toggle;

	if (toggle) {
		// We are toggling the class specified by the toggle property,
		// and the boolean val binding is driving the insert/remove toggle

		regularExpression = toggle.replace(/[\\^$.|?*+()[{]/g, "\\$&");
		// Escape any regular expression special characters (metacharacters) within the toggle string
		regularExpression = "(\\s(?=" + regularExpression + "$)|(\\s)|^)(" + regularExpression + "(\\s|$))";
		// Example: /(\s(?=myclass$)|(\s)|^)?(myclass(\s|$))/ - so matches (" myclass" or " " or ^ ) followed by ("myclass " or "myclass$") where ^/$ are beginning/end of string
		currentValue = currentValue.replace(new RegExp(regularExpression), "$2");
		val = currentValue + (val ? (currentValue && " ") + toggle : "");
	}
	return val;
});

You can insert this at the beginning of your code, to override the built-in merge conveter.
Let me know if that works for you.