Comments between JSX attributes lead to props being ignored

[marvinhagemeister]

Describe the bug
When there is a comment between JSX attributes, all following props are ignored.

<div
  // comment
  id="foo"
/>

The above snippet will be transformed to this during development:

html`<div
  // comment
  id="foo"
/>`

...and because htm only recognises HTML-style comments, it gets confused and thinks that the slash is an indicator for closing the tag, thereby dropping props.

<!-- this will be rendered in the final HTML -->
<div></div>

I'm not sure where the best place to solve this is. On one hand htm can be seen as more or less strict HTML DSL and therefore only <!-- --> comments should be allowed. On the other hand it's often used as an alternative to JSX which favors /* */ or // foo comments.

I'm currently leaning to supporting JS-style comments in htm as it feels kinda "nice" and easier for folks being used to JSX to adapt to. Made an upstream PR to enhance htm's parser to ignore JS-style comments at: developit/htm#214

To Reproduce

See above.

Expected behavior

<div id="foo"></div>

Bug occurs with:

• wmr or wmr start (development)
• wmr build (production)
• wmr serve

The bug doesn't occur during production builds as we use the babel htm transform plugin that drops all comments.