Passing props issues when using lit-domexpression

[codart1]

Describe the bug
Passing props issues when using lit-domexpression

To Reproduce
Provide a code snippet and steps to reproduce the behavior:

1. Go to https://codesandbox.io/s/solid-simple-todos-tagged-template-literals-forked-3vx04?file=/index.js
2. Notice that the <H3 />'s onclick handler got called unexpectedly without any interaction. I have to wrap one more level to make it works: () => () => console.log("click h3")

Expected behavior
I should be able to pass onClick handler to custom component and it should only get called when I actually click the component

[ryansolid]

Yeah I need to document this. This is a tricky one. Because I can't tell if it is a handler or a signal when you pass a thunk. As any thunk can be reactive. This is a core part of the design not to have a isSignal mechanism since I don't want to force people to use createMemo's to compose behavior. Reactivity should be able to composed freely.

JSX doesn't have this shortcoming because you write it as if you pass values. A function passed to a binding is always considered not requiring a reactive wrapper so passing functions never has this problem. But since HyperScript and Lit versions don't have the ability to analyze the shape of the input we can't do that.

I had 2 choices here. One is to make the on prefix special on components. On DOM elements this is something I do and you won't have this problem there. So this only happens when passed through a component.

The other option which I implemented was if the function has an argument I knew it couldn't be a signal. So changing it to (e) => {}will actually work. It occurs to me though typing this that a minifier might mess with this. But then again if you are using a minifier you probably should be using JSX.

I'm open to thoughts. Both of these options are pretty awkward. Technically I could apply both safely as long as people didn't pass things that started with on to components and expect them to be reactive (because they wouldn't be if I implemented this).

[codart1]

Yeah, that's what I guessed, thanks for confirming. I end up passing using this style: onClick=${[handler, 'foo']} which I saw somewhere but not documented. It's not that bad 😄
Will try this too: (e) => {}