Skip closing tag if it is an empty element (#378)

* skip closing tag if it is an empty element

* Format code

* Empty elements are closed by '/>'

src/middleware/jsx/index.test.tsx

@@ -27,6 +27,11 @@ describe('render to string', () => {
     expect(template.toString()).toBe('<p><span>a</span><span>b</span></p>')
   })
 
+  it('Empty elements are rended withtout closing tag', () => {
+    const template = (<input/>)
+    expect(template.toString()).toBe('<input/>')
+  })
+
   it('Props value is null', () => {
     const template = <span data-hello={null}>Hello</span>
     expect(template.toString()).toBe('<span>Hello</span>')

src/middleware/jsx/index.ts

@@ -10,6 +10,24 @@ declare global {
   }
 }
 
+const emptyTags = [
+  'area',
+  'base',
+  'br',
+  'col',
+  'embed',
+  'hr',
+  'img',
+  'input',
+  'keygen',
+  'link',
+  'meta',
+  'param',
+  'source',
+  'track',
+  'wbr',
+]
+
 export const jsx = (
   tag: string | Function,
   props: Record<string, any>,
@@ -41,6 +59,9 @@ export const jsx = (
   }
 
   if (tag !== '') {
+    if (emptyTags.includes(tag)) {
+      result += '/'
+    }
     result += '>'
   }
 
@@ -56,7 +77,7 @@ export const jsx = (
     }
   }
 
-  if (tag !== '') {
+  if (tag !== '' && !emptyTags.includes(tag)) {
     result += `</${tag}>`
   }