feat(emSize): add support for missing width/height

Author: tomchentw

src/cli/__snapshots__/index.test.js.snap

@@ -4,7 +4,7 @@ exports[`cli --icon 1`] = `
 "import React from \\"react\\";
 
 const One = props => (
-  <svg width=\\"1em\\" height=\\"1em\\" viewBox=\\"0 0 48 1\\" {...props}>
+  <svg viewBox=\\"0 0 48 1\\" width=\\"1em\\" height=\\"1em\\" {...props}>
     <path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" />
   </svg>
 );

src/h2x/emSize.js

@@ -1,13 +1,23 @@
+import { JSXAttribute } from 'h2x-plugin-jsx'
+
+const makeSizeAttr = name => {
+  const attr = new JSXAttribute()
+  attr.name = name
+  attr.value = '1em'
+  attr.litteral = false
+  return attr
+}
+
 const emSize = () => ({
   visitor: {
-    JSXAttribute: {
+    JSXElement: {
       enter(path) {
-        if (
-          path.parent.name === 'svg' &&
-          (path.node.name === 'width' || path.node.name === 'height')
-        ) {
-          path.node.value = '1em'
-          path.node.litteral = false
+        if (path.node.name === 'svg' && !path.node.attributes.some(attr => attr && attr.name === 'width' && attr.value === '1em') && !path.node.attributes.some(attr => attr && attr.name === 'height' && attr.value === '1em')) {
+          const nextAttrs = path.node.attributes.filter(attr => attr.name !== 'width' && attr.name !== 'height');
+          nextAttrs.push(makeSizeAttr('width'));
+          nextAttrs.push(makeSizeAttr('height'));
+          path.node.attributes = nextAttrs;
+          path.replace(path.node);
         }
       },
     },