Merge pull request #314 from webcomponents/create-lowercase-extend

Make sure createElement normalizes input when checking custom element defintions

Author: dfreedm

src/CustomElements/register.js

@@ -268,6 +268,12 @@ function createElementNS(namespace, tag, typeExtension) {
 function createElement(tag, typeExtension) {
   // TODO(sjmiles): ignore 'tag' when using 'typeExtension', we could
   // error check it, or perhaps there should only ever be one argument
+  if (tag) {
+    tag = tag.toLowerCase();
+  }
+  if (typeExtension) {
+    typeExtension = typeExtension.toLowerCase();
+  }
   var definition = getRegisteredDefinition(typeExtension || tag);
   if (definition) {
     if (tag == definition.tag && typeExtension == definition.is) {

tests/CustomElements/js/customElements.js

@@ -179,6 +179,26 @@ suite('customElements', function() {
     assert.equal(xbarbarbar.textContent, 'x-barbarbar');
   });
 
+  test('document.registerElement with type extension treats names as case insensitive', function() {
+    var proto = {prototype: Object.create(HTMLButtonElement.prototype), extends: 'button'};
+    proto.prototype.isXCase = true;
+    var XCase = document.registerElement('X-EXTEND-CASE', proto);
+    // createElement
+    var x = document.createElement('button', 'X-EXTEND-CASE');
+    assert.equal(x.isXCase, true);
+    x = document.createElement('button', 'x-extend-case');
+    assert.equal(x.isXCase, true);
+    x = document.createElement('BUTTON', 'X-EXTEND-CASE');
+    assert.equal(x.isXCase, true);
+    x = document.createElement('BUTTON', 'x-extend-case');
+    assert.equal(x.isXCase, true);
+    // upgrade
+    work.innerHTML = '<button is="X-EXTEND-CASE"></button><button is="x-ExTeNd-CaSe"></button>';
+    CustomElements.takeRecords();
+    assert.equal(work.firstChild.isXCase, true);
+    assert.equal(work.firstChild.nextSibling.isXCase, true);
+  });
+
   test('document.registerElement createdCallback in prototype', function() {
     var XBooPrototype = Object.create(HTMLElement.prototype);
     XBooPrototype.createdCallback = function() {