Open him2him2 opened 6 years ago
@him2him2 I think you're right. I also believe it's a problem in bel
which prevents the use of custom events as well. For instance, hyperHTML
uses addEventListener
to attach events after parsing out the on
prefix.
bel
does not do this so projects based on bel
can't pass the declarative-event tests at https://custom-elements-everywhere.com/. So far, I've tested bel
, choo
and gza
but none pass.
I also believe it's a problem in bel which prevents the use of custom events as well. For instance, hyperHTML uses addEventListener to attach events after parsing out the on prefix.
If we were to use this method, how would we access the event handlers? Right now we can iterate over the list, and access it as for example an onclick
property on the object. Afaik using event listeners prohibits that.
An idea might be to only attach listeners that aren't registered in the list through .addEventListener()
, but then we'd have diverging behavior because the listeners cannot be copied over.
Ideally the DOM spec would allow enumerating listeners, but afaik it's not possible at the moment. I'm keen for someone to prove me wrong though, as I agree using .addEventListener
would definitely be a preferred method.
I've been trying some stuff out with hyperHTML
. I noticed it's using handleEvent
(blog post here). You might be able to keep all handlers in one collection and only copy the collection by reference instead of doing the physical copy because every element would have a handleEvent
method with a default noop handler.
@AutoSponge that's a really cool article! We should try out some stuff with that for sure!
Woah that is super neat! Thanks for sharing :D
@AutoSponge Thats a great blogpost! Would you be willing to talk about this some more in irc sometime? https://www.irccloud.com/invite?channel=%23hypermodules&hostname=irc.freenode.net&port=6697&ssl=1 (ping bret) . This seems super useful for https://github.com/choojs/nanocomponent as well
I'll work on a branch and see if I can make it work then we might have something to talk about :)
Issue in OP could also be related to https://github.com/choojs/nanomorph/blob/master/lib/events.js
Related: #https://github.com/choojs/nanomorph/issues/89
I created tests for the events listed in https://github.com/choojs/nanomorph/blob/master/lib/events.js#L32
The following events fail to parse from HTML attribute. I believe this is a problem in bel. But I am not sure where this problem originates.
The first two are listed as problematic and fail
onfocusin https://www.w3schools.com/jsref/event_onfocusin.asp
onfocusout https://www.w3schools.com/jsref/event_onfocusout.asp
These events are listed as Editor's Draft(Non-stable version), but should work in chrome. They also fail.
ontouchcancel https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/ontouchcancel https://developer.mozilla.org/en-US/docs/Web/Events/touchcancel
ontouchend https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/ontouchend https://developer.mozilla.org/en-US/docs/Web/Events/touchend
ontouchmove https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/ontouchmove https://developer.mozilla.org/en-US/docs/Web/Events/touchmove
ontouchstart https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/ontouchstart https://developer.mozilla.org/en-US/docs/Web/Events/touchstart
This event should only work on the body tag, but also seems to fail.
onunload https://www.w3schools.com/jsref/event_onunload.asp Should only work on the body tag. Testing on the body tag fails.
I will submit a pull request that contains the event tests.
Note: Failing tests have been commented out.