Avoid conflicts with using Functions as Custom Element definitions

Function.name is readonly, use defition.elementName to store tagname
Add test
Fixes #362

Author: dfreedm

src/CustomElements.js

@@ -112,7 +112,7 @@ if (useNative) {
       throw new Error('Options missing required prototype property');
     }
     // record name
-    definition.name = name.toLowerCase();
+    definition.elementName = name.toLowerCase();
     // ensure a lifecycle object so we don't have to null test it
     definition.lifecycle = definition.lifecycle || {};
     // build a list of ancestral custom elements (for native base detection)
@@ -128,7 +128,7 @@ if (useNative) {
     // overrides to implement attributeChanged callback
     overrideAttributeApi(definition.prototype);
     // 7.1.5: Register the DEFINITION with DOCUMENT
-    registerDefinition(definition.name, definition);
+    registerDefinition(definition.elementName, definition);
     // 7.1.7. Run custom element constructor generation algorithm with PROTOTYPE
     // 7.1.8. Return the output of the previous step.
     definition.ctor = generateConstructor(definition);
@@ -161,10 +161,10 @@ if (useNative) {
       baseTag = a.is && a.tag;
     }
     // our tag is our baseTag, if it exists, and otherwise just our name
-    definition.tag = baseTag || definition.name;
+    definition.tag = baseTag || definition.elementName;
     if (baseTag) {
       // if there is a base tag, use secondary 'is' specifier
-      definition.is = definition.name;
+      definition.is = definition.elementName;
     }
   }
 

test/js/customElements.js

@@ -243,6 +243,24 @@
     xboo.setAttribute('foo', 'zot');
   });
 
+  test('document.register can use Functions as definitions', function() {
+    // function used as Custom Element defintion
+    function A$A() {
+      this.alive = true;
+    }
+    A$A.prototype = Object.create(HTMLElement.prototype);
+    // bind createdCallback to function body
+    A$A.prototype.createdCallback = A$A;
+    A$A = document.register('a-a', A$A);
+    // test via new
+    var a = new A$A();
+    assert.equal(a.alive, true);
+    // test via parser upgrade
+    work.innerHTML = '<a-a></a-a>';
+    CustomElements.takeRecords();
+    assert.equal(work.firstElementChild.alive, true);
+  });
+
   test('node.cloneNode upgrades', function(done) {
     var XBooPrototype = Object.create(HTMLElement.prototype);
     XBooPrototype.createdCallback = function() {