Fixes #226 - Allow placeholders in tag name

compiler/CompileContext.js

@@ -225,8 +225,6 @@ class CompileContext {
             throw new Error('Invalid attributes');
         }
 
-        ok(typeof tagName === 'string', 'Invalid "tagName"');
-
         var node;
         var elNode = builder.htmlElement(elDef);
         var taglibLookup = this.taglibLookup;

compiler/Parser.js

@@ -93,6 +93,7 @@ class Parser {
         var builder = context.builder;
 
         var tagName = el.tagName;
+        var tagNameExpression = el.tagNameExpression;
         var attributes = el.attributes;
         var argument = el.argument; // e.g. For <for(color in colors)>, argument will be "color in colors"
 
@@ -100,7 +101,9 @@ class Parser {
             argument = argument.value;
         }
 
-        if (tagName === 'compiler-options') {
+        if (tagNameExpression) {
+            tagName = builder.parseExpression(tagNameExpression);
+        } else if (tagName === 'compiler-options') {
             attributes.forEach(function (attr) {
                 let attrName = attr.name;
                 let handler = COMPILER_ATTRIBUTE_HANDLERS[attrName];

taglibs/html/html-element-tag.js

@@ -1,14 +0,0 @@
-'use strict';
-
-module.exports = function(elNode, codegen) {
-    var tagName = elNode.argument;
-    if (!tagName) {
-        codegen.addError('Invalid <html-element> tag. Expected: <html-element(<tag-name-expression>) ... >');
-        return;
-    }
-
-    tagName = codegen.builder.parseExpression(tagName, { escapeXml: false });
-
-    elNode.setTagName(tagName);
-    return elNode;
-};

taglibs/html/marko.json

@@ -2,8 +2,5 @@
     "taglib-id": "marko-html",
     "<html-comment>": {
         "renderer": "./html-comment-tag.js"
-    },
-    "<html-element>": {
-        "code-generator": "./html-element-tag.js"
     }
 }

test/fixtures/render/autotest/dynamic-tag-name/template.marko

@@ -0,0 +1,3 @@
+<hello-${data.myTagName} class="my-class" foo="bar">
+    My nested content
+</>

test/fixtures/render/autotest/html-element-tag/template.marko

@@ -1,3 +0,0 @@
-<html-element("hello-${data.myTagName}") class="my-class" foo="bar">
-    My nested content
-</html-element>