Upgrade guide maps htmx:load and htmx:afterOnLoad to htmx:after:init, which fires at different times
Author: mdesco-crglCreated Sep 24, 2026Updated Sep 24, 2026
The htmx 2 to 4 upgrade material maps both htmx:load and htmx:afterOnLoad to htmx:after:init:
- whats-new-in-htmx-4.md#L162 and #L176
- upgrade-check.py#L52 and #L66
- htmx-upgrade-from-htmx2.md#L147 and #L149
htmx:after:init fires once, when htmx initializes an element that has hx-* attributes. It matches neither htmx 2 event.
Reproduction
A page has <button id="btn" hx-get="/plain" hx-target="#out">. The response is <p id="plain">, with no hx-* attributes. Document listeners log each event.
| Event | Page load | After click and swap |
|---|---|---|
2.0.10 htmx:load |
body | #plain |
2.0.10 htmx:afterOnLoad |
none | #btn |
4.0.0 htmx:after:init |
#btn |
none |
4.0.0 htmx:after:process |
body | #plain |
4.0.0 htmx:after:request |
none | #btn |
Impact
- A
htmx:loadhandler moved tohtmx:after:initnever runs on swapped content withouthx-*attributes, for example tooltip setup. - A
htmx:afterOnLoadhandler moved tohtmx:after:initruns at page load, not after the request. A row withon htmx:afterOnLoad remove meis removed as soon as the page loads.
Proposed mapping
htmx:loadtohtmx:after:process.htmx.onLoad()already listens for this event.htmx:afterOnLoadtohtmx:after:request. It fires before the swap, while the requesting element is still in the DOM.
Source: bigskysoftware/htmx