Per DOM spec, tagName/nodeName should be canonical uppercase form in HTML document contexts

Author: tomdale

packages/@simple-dom/document/src/node.ts

@@ -175,9 +175,12 @@ export default class SimpleNodeImpl<
   }
 
   public createElementNS(this: SimpleDocumentImpl, namespace: ElementNamespace, qualifiedName: string): SimpleElement {
+    // Node name is case-preserving in XML contexts, but returns canonical uppercase form in HTML contexts
+    // https://www.w3.org/TR/2004/REC-DOM-Level-3-Core-20040407/core.html#ID-104682815
+    const nodeName = namespace === Namespace.HTML ? qualifiedName.toUpperCase() : qualifiedName;
     // we don't care to parse the qualified name because we only support HTML documents
     // which don't support prefixed elements
-    return new SimpleNodeImpl(this, NodeType.ELEMENT_NODE, qualifiedName, null, namespace);
+    return new SimpleNodeImpl(this, NodeType.ELEMENT_NODE, nodeName, null, namespace);
   }
 
   public createTextNode(this: SimpleDocumentImpl, text: string): SimpleText {

packages/@simple-dom/document/test/element-test.ts

@@ -22,6 +22,17 @@ moduleWithDocument('Element', (helper) => {
     assert.strictEqual(body.firstChild!.nodeName, 'DIV', 'fragment\'s child is added as child of document');
   });
 
+  QUnit.test('create HTML-namespaced div element', (assert) => {
+    const { document } = helper;
+
+    const svg = document.createElementNS(Namespace.HTML, 'div');
+
+    assert.strictEqual(svg.namespaceURI, Namespace.HTML, 'has HTML namespace');
+
+    assert.strictEqual(svg.nodeName, 'DIV', 'nodeName is uppercased');
+    assert.strictEqual(svg.tagName, 'DIV', 'tagName is uppercased');
+  });
+
   QUnit.test('create svg element', (assert) => {
     const { document } = helper;