Document kebab-case event names for hx-on

[axelfontaine]

I just spent quite a bit of time debugging why hx-on:htmx:afterOnLoad wasn't firing.

The docs say it isn't possible to handle this event with hx:on:

Note that HTML attributes are case insensitive. This means that, unfortunately, events that rely on capitalization/ camel casing, cannot be responded to.

And the debug extension only displays the camelCase event names.

However, buried deeper in that same paragraph in the docs the very solution to this limitation is provided:

htmx dispatches all its events in both camelCase and in kebab-case for this very reason.

I eventually figured out that hx-on:htmx:after-on-load very much does the trick.

This was much harder to find than it should have been.

Ideally https://htmx.org/events/ should be updated to included all kebab-case events as well. Or event better, it should only mention the kebab-case event names as those work everywhere. The camelCase event names can remain supported in the library for backwards compatibility.

[PedroAVJ]

I just spent around an hour debugging the exact same issue with hx-on:htmx:afterOnLoad. Since htmx.logAll(); shows the events in camelCase, I was thrown off as to why the event was firing in the logs but not in my code.

Ideally, https://htmx.org/events/ should be updated to include all kebab-case events as well. Or even better, it should only mention the kebab-case event names since those work everywhere. The camelCase event names can remain supported in the library for backwards compatibility.

I wholly agree with this statement.