Add support for block comments in Spacebars

packages/spacebars-compiler/spacebars_tests.js

@@ -32,6 +32,12 @@ Tinytest.add("spacebars - stache tags", function (test) {
   run('{{! asdf }}', {type: 'COMMENT', value: ' asdf '});
   run('{{ ! asdf }}', {type: 'COMMENT', value: ' asdf '});
   run('{{ ! asdf }asdf', "Unclosed");
+  run('{{!-- asdf --}}', {type: 'BLOCKCOMMENT', value: ' asdf '});
+  run('{{ !-- asdf -- }}', {type: 'BLOCKCOMMENT', value: ' asdf '});
+  run('{{ !-- {{asdf}} -- }}', {type: 'BLOCKCOMMENT', value: ' {{asdf}} '});
+  run('{{ !-- {{as--df}} --}}', {type: 'BLOCKCOMMENT', value: ' {{as--df}} '});
+  run('{{ !-- asdf }asdf', "Unclosed");
+  run('{{ !-- asdf --}asdf', "Unclosed");
   run('{{else}}', {type: 'ELSE'});
   run('{{ else }}', {type: 'ELSE'});
   run('{{else x}}', "Expected");
@@ -225,6 +231,9 @@ Tinytest.add("spacebars - parse", function (test) {
   test.equal(HTML.toJS(Spacebars.parse('{{!foo}}')), 'null');
   test.equal(HTML.toJS(Spacebars.parse('x{{!foo}}y')), '"xy"');
 
+  test.equal(HTML.toJS(Spacebars.parse('{{!--foo--}}')), 'null');
+  test.equal(HTML.toJS(Spacebars.parse('x{{!--foo--}}y')), '"xy"');
+
   test.equal(HTML.toJS(Spacebars.parse('{{#foo}}x{{/foo}}')),
              'HTMLTools.Special({type: "BLOCKOPEN", path: ["foo"], content: "x"})');
 
@@ -254,7 +263,10 @@ Tinytest.add("spacebars - parse", function (test) {
     Spacebars.parse('<a {{> x}}></a>');
   });
 
-  test.equal(HTML.toJS(Spacebars.parse('<a {{! x}} b=c{{! x}} {{! x}}></a>')),
+  test.equal(HTML.toJS(Spacebars.parse('<a {{! x--}} b=c{{! x}} {{! x}}></a>')),
+             'HTML.A({b: "c"})');
+
+  test.equal(HTML.toJS(Spacebars.parse('<a {{!-- x--}} b=c{{ !-- x --}} {{!-- x -- }}></a>')),
              'HTML.A({b: "c"})');
 
   // currently, if there are only comments, the attribute is truthy.  This is
@@ -264,5 +276,9 @@ Tinytest.add("spacebars - parse", function (test) {
              'HTML.INPUT({selected: ""})');
   test.equal(HTML.toJS(Spacebars.parse('<input selected={{!foo}}{{!bar}}>')),
              'HTML.INPUT({selected: ""})');
+  test.equal(HTML.toJS(Spacebars.parse('<input selected={{!--foo--}}>')),
+    'HTML.INPUT({selected: ""})');
+  test.equal(HTML.toJS(Spacebars.parse('<input selected={{!--foo--}}{{!--bar--}}>')),
+    'HTML.INPUT({selected: ""})');
 
 });

packages/spacebars-compiler/templatetag.js

@@ -48,6 +48,7 @@ var starts = {
   ELSE: makeStacheTagStartRegex(/^\{\{\s*else(?=[\s}])/i),
   DOUBLE: makeStacheTagStartRegex(/^\{\{\s*(?!\s)/),
   TRIPLE: makeStacheTagStartRegex(/^\{\{\{\s*(?!\s)/),
+  BLOCKCOMMENT: makeStacheTagStartRegex(/^\{\{\s*!--/),
   COMMENT: makeStacheTagStartRegex(/^\{\{\s*!/),
   INCLUSION: makeStacheTagStartRegex(/^\{\{\s*>\s*(?!\s)/),
   BLOCKOPEN: makeStacheTagStartRegex(/^\{\{\s*#\s*(?!\s)/),
@@ -226,6 +227,7 @@ TemplateTag.parse = function (scannerOrString) {
   if (run(starts.ELSE)) type = 'ELSE';
   else if (run(starts.DOUBLE)) type = 'DOUBLE';
   else if (run(starts.TRIPLE)) type = 'TRIPLE';
+  else if (run(starts.BLOCKCOMMENT)) type = 'BLOCKCOMMENT';
   else if (run(starts.COMMENT)) type = 'COMMENT';
   else if (run(starts.INCLUSION)) type = 'INCLUSION';
   else if (run(starts.BLOCKOPEN)) type = 'BLOCKOPEN';
@@ -236,7 +238,12 @@ TemplateTag.parse = function (scannerOrString) {
   var tag = new TemplateTag;
   tag.type = type;
 
-  if (type === 'COMMENT') {
+  if (type === 'BLOCKCOMMENT') {
+    var result = run(/^[\s\S]*?--\s*?\}\}/);
+    if (! result)
+      error("Unclosed block comment");
+    tag.value = result.slice(0, result.lastIndexOf('--'));
+  } else if (type === 'COMMENT') {
     var result = run(/^[\s\S]*?\}\}/);
     if (! result)
       error("Unclosed comment");
@@ -320,6 +327,9 @@ TemplateTag.parseCompleteTag = function (scannerOrString, position) {
   if (! result)
     return result;
 
+  if (result.type === 'BLOCKCOMMENT')
+    return null;
+
   if (result.type === 'COMMENT')
     return null;
 

packages/spacebars-tests/template_tests.html

@@ -676,3 +676,9 @@ Hi there!
   <button type="button">button</button>
 </template>
 
+<template name="spacebars_test_block_comment">
+  {{!-- foo --}}
+  {{!--
+    {{bar}}
+  --}}
+</template>

packages/spacebars-tests/template_tests.js

@@ -1877,3 +1877,11 @@ Tinytest.add(
   }
 );
 
+Tinytest.add(
+  "spacebars - template - block comments should not be displayed",
+  function (test) {
+    var tmpl = Template.spacebars_test_block_comment;
+    var div = renderToDiv(tmpl);
+    test.equal(canonicalizeHtml(div.innerHTML), '');
+  }
+);