allows addEventListener to use handleEvent syntax while re-using the object for options

[titoBouzout]

This solves in a simple way the common need of wanting to use passive/once/capture events.

addEventListener has an "obscure" feature of allowing the listener to be in an object with key handleEvent

This PR allows this syntax:

<div on:click={ {
  handleEvent(e) {
    console.log("clicked", e)
  },
  once:true
}/>

I haven't tested this but it should work https://playground.solidjs.com/anonymous/df01ffcb-e7dc-4a36-b80d-51a398c02689

This is what pota does https://github.com/potahtml/pota/blob/master/src/lib/reactive.js#L1372

[titoBouzout]

Probably oncapture: can be removed here, but that would be a breaking change https://github.com/search?q=repo%3Aryansolid%2Fdom-expressions%20oncapture&type=code

[lxsmnsyc]

This is actually an interesting feature to put in.

[ryansolid]

Yeah I like the implications of this. Not needing oncapture: etc and allowing full config of native events seems a real win. I might be releasing one more minor of Solid 1.x and I'd like to see this get in.

[davedbase]

@titoBouzout I hope we don't forget to add this to the docs. :)

[titoBouzout]

@davedbase already on my mind, I will look if typings need updates and how to add tests so gets ready for merging, stay tuned

[titoBouzout]

ok if I am not missing anything I think this is ready for review

• updated types adding a CustomEventHandlerUnion which accepts a regular function or the object form
• it will use dom-expression addEventListener instead of the browser one, as it has the logic for checking if options it's an object. This has the nice side effect that output when minified should become smaller as node.addEventListener(...) will become $addEventListener(node, ...)
• added compilation test for expected output
• added jsdom test for actually checking if the options object is working as expected
• marked interface CustomCaptureEvents as deprecated

Considerations:

• is there any code related to hydration that needs an update?
• please double check my typings, can the addEventListener function signature types be improved to use the ones defined on client.d.ts?

should close:
solidjs/solid#2210
solidjs/solid#1939
solidjs/solid#1786

Thanks!

[titoBouzout]

@ryansolid pinging as it was noted the desired to include it on next release

[titoBouzout]

docs update at solidjs/solid-docs#866