I have been trying Hyperapp.
For a number of reasons I want to use the h function rather than JSX, I won't get into the whys and wherefores here but no JSX please!
Thing is when I create an instance of a component by using JSX everything is fine.
Example component (both this and the JSX equivalent work the same in examples below):
const Examp = (props) => (
h("p",{},["this is an example"])
)
Example view using JSX, this loads the Examp component as expected (I see 'this is an example'):
const view = (state, actions) => (
<main>
<h1>JSX Example</h1>
<p>Begin</p>
<Examp/>
<p>End</p>
</main>
)
Example view using h, this doesn't work, I get an empty "examp" node (note the case):
const view = (state, actions) => (
h("main",{},[
h("h1",{},["H Example"]),
h("p",{},["Begin"]),
h("Examp",{},[]),
h("p",{},["End"])
])
)
It looks like h is changing the capitalisation of the node and this is causing it not be load the component.
Am I doing something wrong, if so, how should I deal with this?
Edit: having looked at the Hyperapp source code; hyperapp uses document.createElement to create nodes and will always create a lowercase node, as component functions need a capital, have components ever worked with h or has this been overlooked? In which case hyperapp needs JSX :/
