Add support for passing unadjusted tag names

See:

*   <https://html.spec.whatwg.org/multipage/parsing.html#tag-name-state>

    The HTML tokenizer consumes ASCII upper alpha as lower alpha
*   <https://html.spec.whatwg.org/multipage/parsing.html#parsing-main-inforeign>

    SVG in HTML is therefore first lowercased, and afterwards has to
    be adjusted
*   <https://github.com/syntax-tree/hast#element>

    The hast spec already described the local name must be used on
    elements

Closes GH-11.
Closes GH-12.

Author: wooorm

build.js

@@ -0,0 +1,12 @@
+'use strict'
+
+var fs = require('fs')
+var tagNames = require('svg-tag-names')
+
+var casing = tagNames.filter(function(d) {
+  return d !== d.toLowerCase()
+})
+
+var doc = JSON.stringify(casing, null, 2) + '\n'
+
+fs.writeFileSync('./svg-case-sensitive-tag-names.json', doc)

factory.js

@@ -8,15 +8,22 @@ var commas = require('comma-separated-tokens').parse
 
 module.exports = factory
 
-function factory(schema, defaultTagName) {
+var own = {}.hasOwnProperty
+
+function factory(schema, defaultTagName, caseSensitive) {
+  var adjust = caseSensitive ? createAdjustMap(caseSensitive) : null
+
   return h
 
   // Hyperscript compatible DSL for creating virtual hast trees.
   function h(selector, properties) {
     var node = parseSelector(selector, defaultTagName)
     var children = Array.prototype.slice.call(arguments, 2)
+    var name = node.tagName.toLowerCase()
     var property
 
+    node.tagName = adjust && own.call(adjust, name) ? adjust[name] : name
+
     if (properties && isChildren(properties, node)) {
       children.unshift(properties)
       properties = null
@@ -189,3 +196,17 @@ function style(value) {
 
   return result.join('; ')
 }
+
+function createAdjustMap(values) {
+  var length = values.length
+  var index = -1
+  var result = {}
+  var value
+
+  while (++index < length) {
+    value = values[index]
+    result[value.toLowerCase()] = value
+  }
+
+  return result
+}

package.json

@@ -23,7 +23,8 @@
     "index.js",
     "factory.js",
     "html.js",
-    "svg.js"
+    "svg.js",
+    "svg-case-sensitive-tag-names.json"
   ],
   "dependencies": {
     "comma-separated-tokens": "^1.0.0",
@@ -37,18 +38,20 @@
     "prettier": "^1.0.0",
     "remark-cli": "^6.0.0",
     "remark-preset-wooorm": "^5.0.0",
+    "svg-tag-names": "^2.0.0",
     "tape": "^4.0.0",
     "tinyify": "^2.0.0",
     "xo": "^0.24.0"
   },
   "scripts": {
+    "generate": "node build",
     "format": "remark . -qfo && prettier --write \"**/*.js\" && xo --fix",
     "build-bundle": "browserify . -s hastscript > hastscript.js",
     "build-mangle": "browserify . -s hastscript -p tinyify > hastscript.min.js",
     "build": "npm run build-bundle && npm run build-mangle",
     "test-api": "node test",
     "test-coverage": "nyc --reporter lcov tape test.js",
-    "test": "npm run format && npm run build && npm run test-coverage"
+    "test": "npm run generate && npm run format && npm run build && npm run test-coverage"
   },
   "nyc": {
     "check-coverage": true,

svg-case-sensitive-tag-names.json

@@ -0,0 +1,41 @@
+[
+  "altGlyph",
+  "altGlyphDef",
+  "altGlyphItem",
+  "animateColor",
+  "animateMotion",
+  "animateTransform",
+  "clipPath",
+  "feBlend",
+  "feColorMatrix",
+  "feComponentTransfer",
+  "feComposite",
+  "feConvolveMatrix",
+  "feDiffuseLighting",
+  "feDisplacementMap",
+  "feDistantLight",
+  "feDropShadow",
+  "feFlood",
+  "feFuncA",
+  "feFuncB",
+  "feFuncG",
+  "feFuncR",
+  "feGaussianBlur",
+  "feImage",
+  "feMerge",
+  "feMergeNode",
+  "feMorphology",
+  "feOffset",
+  "fePointLight",
+  "feSpecularLighting",
+  "feSpotLight",
+  "feTile",
+  "feTurbulence",
+  "foreignObject",
+  "glyphRef",
+  "linearGradient",
+  "radialGradient",
+  "solidColor",
+  "textArea",
+  "textPath"
+]

svg.js

@@ -1,9 +1,10 @@
 'use strict'
 
 var schema = require('property-information/svg')
+var caseSensitive = require('./svg-case-sensitive-tag-names.json')
 var factory = require('./factory')
 
-var svg = factory(schema, 'g')
+var svg = factory(schema, 'g', caseSensitive)
 svg.displayName = 'svg'
 
 module.exports = svg

test.js

@@ -1121,5 +1121,49 @@ test('hastscript', function(t) {
     st.end()
   })
 
+  t.test('tag names', function(st) {
+    st.deepEqual(
+      h(null, [h('DIV'), h('dIv'), h('div')]),
+      {
+        type: 'element',
+        tagName: 'div',
+        properties: {},
+        children: [
+          {type: 'element', tagName: 'div', properties: {}, children: []},
+          {type: 'element', tagName: 'div', properties: {}, children: []},
+          {type: 'element', tagName: 'div', properties: {}, children: []}
+        ]
+      },
+      'should create lowercase tag names'
+    )
+
+    st.deepEqual(
+      s(null, [
+        s('RECT'),
+        s('rEcT'),
+        s('rect'),
+        s('feFuncA'),
+        s('FEFUNCA'),
+        s('fefunca')
+      ]),
+      {
+        type: 'element',
+        tagName: 'g',
+        properties: {},
+        children: [
+          {type: 'element', tagName: 'rect', properties: {}, children: []},
+          {type: 'element', tagName: 'rect', properties: {}, children: []},
+          {type: 'element', tagName: 'rect', properties: {}, children: []},
+          {type: 'element', tagName: 'feFuncA', properties: {}, children: []},
+          {type: 'element', tagName: 'feFuncA', properties: {}, children: []},
+          {type: 'element', tagName: 'feFuncA', properties: {}, children: []}
+        ]
+      },
+      'should create lowercase SVG tag names, and fix certain cases'
+    )
+
+    st.end()
+  })
+
   t.end()
 })