Simplifies whitespace control and adds an option

docs/tags/whitespace.md

@@ -9,7 +9,7 @@
   `-` character by the braces. When present, all whitespace on that side will be
   omitted up to the next tag, magic tag, or non-whitespace character. It also works with [can-stache.tags.unescaped].
 
-  The following ensures there is no extra between the second `<pre>`, the output of `{{-this.message-}}`,
+  The following ensures there is no extra whitespace between the second `<pre>`, the output of `{{-this.message-}}`,
   and the `</pre>` closing tag:
 
   ```html
@@ -39,6 +39,52 @@
 
   @param {can-stache/expressions/literal|can-stache/expressions/key-lookup|can-stache/expressions/call|can-stache/expressions/helper} EXPRESSION An expression whose unescaped result is inserted into the page.
 
+@signature `{{--}}`
+
+  Whitespace may be omitted without an expression. This is useful between html tags, for example, where it may cause issues in the display of static inline elements.
+
+  The following ensures there is no extra whitespace between the inline items:
+
+  ```html
+  <my-demo></my-demo>
+  <style>
+  .slantycolors {
+    display: inline-block;
+    transform: skewX(15deg);
+    padding: 10px;
+    color: white;
+    font-weight: bold;
+    background: linear-gradient(to top, orange, black, blue);
+  }
+  </style>
+  <script type="module">
+  import {Component} from "can";
+
+  Component.extend({
+    tag: "my-demo",
+    view: `
+      <span class="slantycolors">
+        orange
+      </span>
+      {{--}}
+      <span class="slantycolors">
+        black
+      </span>
+      {{--}}
+      <span class="slantycolors">
+        blue
+      </span>
+      <span class="slantycolors">
+        {{message}}
+      </span>`,
+    ViewModel: {
+      message: {default: "There's no {{--}} before me."}
+    }
+  });
+  </script>
+  ```
+  @codepen
+
 @body
 
 ## Examples
@@ -122,3 +168,23 @@ would render as:
 		{{ user.name }}
 	{{/ if -}}</div>
 ```
+
+### Special Case
+
+ You may want to remove all whitespace between elements without output or comment.
+
+ ```html
+<ul>
+  {{--}}
+  <li>Inline Nav Item 1</li>
+  {{--}}
+  <li>Inline Nav Item 2</li>
+  {{--}}
+</ul>
+```
+
+ would render as:
+
+ ```html
+<ul><li>Inline Nav Item 1</li><li>Inline Nav Item 2</li></ul>
+```

src/mustache_core.js

@@ -38,7 +38,7 @@ defineLazyValue(HelperOptions.prototype,"context", function(){
 // ## Helpers
 
 var mustacheLineBreakRegExp = /(?:(^|\r?\n)(\s*)(\{\{([\s\S]*)\}\}\}?)([^\S\n\r]*)($|\r?\n))|(\{\{([\s\S]*)\}\}\}?)/g,
-	mustacheWhitespaceRegExp = /(\s*)(\{\{\{?)(-?)([\s\S]*?)(-?)(\}\}\}?)(\s*)/g,
+	mustacheWhitespaceRegExp = /\s*\{\{--\}\}\s*|\s*(\{\{\{?)-|-(\}\}\}?)\s*/g,
 	k = function(){};
 var viewInsertSymbol = canSymbol.for("can.viewInsert");
 
@@ -522,29 +522,7 @@ var core = {
 	 * @return {String}
 	 */
 	cleanWhitespaceControl: function(template) {
-		return template.replace(mustacheWhitespaceRegExp, function(
-			whole,
-			spaceBefore,
-			bracketBefore,
-			controlBefore,
-			expression,
-			controlAfter,
-			bracketAfter,
-			spaceAfter,
-			matchIndex
-		) {
-
-			if (controlBefore === '-') {
-				spaceBefore = '';
-			}
-
-			if (controlAfter === '-') {
-				spaceAfter = '';
-			}
-
-			return spaceBefore + bracketBefore + expression + bracketAfter + spaceAfter;
-
-		});
+		return template.replace(mustacheWhitespaceRegExp, "$1$2");
 	},
 	getTemplateById: function(){}
 };

test/stache-test.js

@@ -5025,6 +5025,18 @@ function makeTest(name, doc, mutation) {
 		equal(core.cleanWhitespaceControl(
 			"<foo>\n\t{{-! comment -}}\n</foo>"),
 			"<foo>{{! comment }}</foo>");
+		// right only
+		equal(core.cleanWhitespaceControl(
+			"<foo>\n\t{{! comment -}}\n</foo>"),
+			"<foo>\n\t{{! comment }}</foo>");
+		// left only
+		equal(core.cleanWhitespaceControl(
+			"<foo>\n\t{{-! comment }}\n</foo>"),
+			"<foo>{{! comment }}\n</foo>");
+		// both without output
+		equal(core.cleanWhitespaceControl(
+			"<foo>\n\t{{--}}\n</foo>"),
+			"<foo></foo>");
 
 		var div = doc.createElement('div');
 		div.appendChild(stache("<foo>\n\t{{-! comment -}}\n</foo>")());