#4084·htmx

Extension events are inconsistent when used with metaCharacter

Author: scrhartleyCreated Sep 16, 2026Updated Sep 16, 2026

The v4 extensions are inconsistent in whether they use htmx.trigger or api.triggerHtmxEvent. The result of this is that when a metaCharacter is used, the user is left to guess what the event name is (and how to use it with hx-on).

In the following example you have: htmx:prompt and hx-on|htmx:prompt versus: htmx|ws|before|connection and hx-on||ws|before|connection (or hx-on|htmx|ws|before|connection)

(These extensions are chosen at random, the problem applies across multiple extensions.)

<!DOCTYPE html>
<html>
  <head>
    <meta name="htmx-config" content='{"metaCharacter":"|"}'>
    
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/htmx.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/ext/hx-prompt.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/ext/hx-ws.js"></script>
  </head>
  
  <body>
  
    <button

        hx-get="/prompt"
        hx-prompt="Press OK"
        hx-on|htmx:prompt="console.log(event.type); event.preventDefault();"

        hx-ws|connect="/chat"
        hx-on||ws|before|connection="console.log(event.type); event.preventDefault();"

    >
        Prompt
    </button>
  
  </body>
</html>

Aside:
I wish there was a metaCharacter setting so I could do hx-on|htmx:ws:before:connection, since I'd like to be able to use hx-boost|inherited without all my event names becoming hard to read, i.e. htmx|ws|before|connection or htmx|history|cache|before|save.